7ce0bd8d3a
* Update run instructions `python3 -m http.server --directory` flag was added in Python 3.7. Change instructions to cd into static and skip the flag instead - makes it work with earlier Pythons too. * Add visual feedback for button click The minimal example has a button, but clicking it does nothing. This makes it hard to tell whether the example works or not. This adds a label that is update when the button is clicked. * Small improvements to crm example * Add a heading to each scene to make it more obvious what the page is for. * Improve layout of input form by stack the inputs vertically. * Add a little space between entries when displaying the list. * Add a hint to the Description input that Markdown can be used. * Add an explanation to the file_upload example * Clarify purpose of var in fragments example * Improve futures_wp example * Add a second button that demonstrates an unsuccessful fetch. * Render the markdown document (since we're fetching markdown after all). * Remove vague comment that's not really helping. * Improve inner_html example * Include a textual explanation of what the example is doing. * Run cargo fmt * Remove 'static lifetime for constant * Improve suggestion in inner_html example * move markdown.rs to a common crate * add description to common Cargo.toml * PR feedback * PR feedback * remove static lifetime annotation
1.8 KiB
Yew Examples
In order to build the examples, use the build.sh script.
All the examples are designed to work with wasm-bindgen except for examples in folders ending in _wp (these are prepared for wasm-pack).
- The examples do not use external bundlers and all use the same
static/index.htmlafter being built. wasm-bindgenbuilds projects as binary crates (main.rs)wasm-packbuilds projects as library crates (lib.rs)
Have a look at Yew's starter templates when starting a project using Yew – they can significantly simplify things.
How to run the examples
git clone https://github.com/yewstack/yew.git
cd yew/examples
./build.sh minimal # example subfolder
cd static && python3 -m http.server # open localhost:8000 in browser
Note: Visual Studio Code has an extension called Live Server which can be used to run examples in the browser (with automatic page refreshes when a file is changed). After installing the extension open index.html and press Open with Live Server in the context menu.
Requirements
The default way to build the examples is by using wasm-bindgen (this is automatically installed if you've installed wasm-pack). If they aren't installed, these tools can be installed by using cargo (cargo install wasm-pack wasm-bindgen-cli).
Installation guides: Rust and wasm-pack
# rust install
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
# wasm-pack install
curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh;
# wasm-bindgen-cli install
cargo install wasm-bindgen-cli