-
yew
-
test 할 수 있는 playground 먼저 해 보고 코드 만들자
https://yew.rs/docs/getting-started/introduction
-
The Yew Tutorial | chris biscardi
-
Series
trunk serve --open
- Build, bundle & ship your Rust WASM application to the web
https://github.com/thedodd/trunk
- Prerequisites
This tutorial assumes you're already familiar with Rust. If you're new to Rust, the free Rust Book offers a great starting point for beginners and continues to be an excellent resource even for experienced Rust developers.
Ensure the latest version of Rust is installed by running rustup update or by installing rust if you haven't already done so.
After installing Rust, you can use Cargo to install trunk by running:
cargo install trunk
We will also need to add the WASM build target by running:
rustup target add wasm32-unknown-unknown
# Install via homebrew on Mac, Linux or Windows (WSL).
brew install trunk
# Install a release binary (great for CI).
# You will need to specify a value for ${VERSION}.
wget -qO- https://github.com/thedodd/trunk/releases/download/${VERSION}/trunk-x86_64-unknown-linux-gnu.tar.gz | tar -xzf-
# Install via cargo.
cargo install --locked trunk
# Until wasm-bindgen has pre-built binaries for Apple M1, M1 users will
# need to install wasm-bindgen manually.
cargo install --locked wasm-bindgen-cli
-
tokio.rs
-
A runtime for writing reliable asynchronous applications with Rust. Provides I/O, networking, scheduling, timers, ...
-
Website | Guides | API Docs | Chat
A runtime for writing reliable, asynchronous, and slim applications with the Rust programming language. It is:
-
Fast: Tokio's zero-cost abstractions give you bare-metal performance.
-
Reliable: Tokio leverages Rust's ownership, type system, and concurrency model to reduce bugs and ensure thread safety.
-
Scalable: Tokio has a minimal footprint, and handles backpressure and cancellation naturally.
-
This template should help get you started developing with Tauri and Yew.
VS Code + Tauri + rust-analyzer.
cargo install create-tauri-app
cargo create-tauri-app
PS D:\my_tutorial> cargo create-tauri-app
✔ Project name · clickme
✔ Choose which language to use for your frontend · Rust - (cargo)
✔ Choose your UI template · Yew - (https://yew.rs/)
Template created!
Your system is missing dependencies (or they do not exist in $PATH):
╭───────────┬───────────────────────────────╮
│ Tauri CLI │ Run `cargo install tauri-cli` │
╰───────────┴───────────────────────────────╯
Make sure you have installed the prerequisites for your OS: https://tauri.app/v1/guides/getting-started/prer
equisites, then run:
cd clickme
cargo tauri dev
PS D:\my_tutorial> cargo install tauri-cli
https://yew.rs/docs/getting-started/introduction
- Series
https://youtube.com/playlist?list=PLWtPciJ1UMuBpRg1KbXqxE5WOdY9ze37S
https://yew.rs/docs/getting-started/editor-setup
- Snippets:Configure User
- New Snippet files for
Navigate to File > Preferences > User Snippets. Select Rust as the language. Add the following snippet in the snippet JSON file:
- prefix
yewfc, prefixyewsc
{
"New Yew function component": {
"prefix": "yewfc",
"body": [
"#[derive(PartialEq, Properties)]",
"pub struct ${1:ComponentName}Props {}",
"",
"#[function_component]",
"pub fn $1(props: &${1}Props) -> Html {",
" let ${1}Props {} = props;",
" html! {",
" <${2:div}>$0</${2}>",
" }",
"}"
],
"description": "Create a minimal Yew function component"
},
"New Yew struct component": {
"prefix": "yewsc",
"body": [
"pub struct ${1:ComponentName};",
"",
"pub enum ${1}Msg {",
"}",
"",
"impl Component for ${1} {",
" type Message = ${1}Msg;",
" type Properties = ();",
"",
" fn create(ctx: &Context<Self>) -> Self {",
" Self",
" }",
"",
" fn view(&self, ctx: &Context<Self>) -> Html {",
" html! {",
" $0",
" }",
" }",
"}"
],
"description": "Create a new Yew component with a message enum"
}
}
https://marketplace.visualstudio.com/items?itemName=TechTheAwesome.rust-yew
This is a work in progress, and community maintained project! Please see details and direct related bug reports / issues / questions over to the extension's repository
Rust-Yew extension is avaliable on VSC Marketplace, providing syntax highlight, renames, hover, and more.
Emmet support should work out of the box, if not please fall back to edditing the settings.json file:
"emmet.includeLanguages": {
"rust": "html",
}
-
GitLab CI To test your package on GitLab CI, here is a sample .gitlab-ci.yml file:
stages: - build rust-latest: stage: build image: rust:latest script: - cargo build --verbose - cargo test --verbose rust-nightly: stage: build image: rustlang/rust:nightly script: - cargo build --verbose - cargo test --verbose allow_failure: true
This will test on the stable channel and nightly channel, but any breakage in nightly will not fail your overall build. Please see the GitLab CI documentation for more information.
- builds.sr.ht To test your package on sr.ht, here is a sample .build.yml file. Be sure to change and to the repo to clone and the directory where it was cloned.
image: archlinux
packages:
- rustup
sources:
- <your repo>
tasks:
- setup: |
rustup toolchain install nightly stable
cd <your project>/
rustup run stable cargo fetch
- stable: |
rustup default stable
cd <your project>/
cargo build --verbose
cargo test --verbose
- nightly: |
rustup default nightly
cd <your project>/
cargo build --verbose ||:
cargo test --verbose ||:
- docs: |
cd <your project>/
rustup run stable cargo doc --no-deps
rustup run nightly cargo doc --no-deps ||:
This will test and build documentation on the stable channel and nightly channel, but any breakage in nightly will not fail your overall build. Please see the builds.sr.ht documentation for more information.
https://doc.rust-lang.org/cargo/guide/continuous-integration.html
https://github.com/ShironCat/ShironCat.github.io
-
Series(UI in Rust and WASM)