Awesome Yew
Projects
- Realworld example - Exemplary real world app built with Rust + Yew + WebAssembly. It utilizes Yew's latest
function components
andhooks
. It also supports desktop application powered by Tauri. - webapp.rs - A web application completely written in Rust, frontend is built with Yew.
- Rust-Full-Stack - Easily testable and working Rust codes with blog posts to explain them.
- Bucket Questions - A webapp written entirely in Rust for a dumb party game.
- web-view todomvc desktop app - Demo how to use yew for a todomvc that compiles to WebAssembly and is bundled as a lightweight(~2mb) desktop app by web-view, as an alternative to Electron, web-view also has a demo.
- yew-react-example - This project shows how to create a web app using a React component inside a Yew component.
- Kirk - Just A Rust WebAssembly Blog.
- rust-async-wasm-demo - Toy project to learn Rust and async that can be deployed to the web.
- karaoke-rs - A simple, network enabled karaoke player in Rust.
- I Love Hue! (rs) - A clone of the mobile game I Love Hue in Yew (Rust).
- yew-styles-page - This is an initial project of a framework style for yew.
- caniuse.rs - Rust feature search.
- Rust electron yew demo - An example of building a Rust based web app (Yew) into a native app using electron.
- covplot - Live graphs of worldwide CoVID-19 data.
- Tanoshi - Tachiyomi-like web manga reader. Front-end for tanoshi.
- Minesweeper - Minesweeper built with Rust, Yew and WebAssembly.
- Freecell - A patience game written in Rust and Yew.
- Daydream - A small Matrix web client written in Rust.
- Yew-WebRTC-Chat - A simple WebRTC chat made with Yew.
- Yew Fullstack Boilerplate - Highly opinionated boilerplate for creating full stack applications with Rust.
- Chord Quiz - Practice recognizing chords in this Rust/Yew/WebAssembly app.
- RustMart - Single Page Application (SPA) written using Rust, Wasm and Yew.
- DevAndDev - A website where developers can find pair-programming partners. Written in Rust, Yew frontend.
- yew-octicons - An easy interface for using Octicons in Yew projects.
- Pipe - This is a Rust / Wasm client web app which is a task control center.
- note-to-yew - Convert your markups into Yew macro online, which is also made by Yew.
- ASCII-Hangman - Configurable Hangman game for children with ASCII-art rewarding.
- dotdotyew - Dot-voting using Yew, with Rust powering the backend API.
- wasm-2048 - 2048 game implemented with Rust and Yew and compiled to Wasm.
- website-wasm - My personal website written in Rust via Yew/Wasm.
- KeyPress - A Rust WebAssembly Website example for practising english for chinese.
- yew-train-ticket - A Rust WebAssembly Webapp example basing Yew newest hooks and functional API, the code style is extremely like React Function Component.
- yew-d3-example - Showing a d3 chart with Yew.
- Oxfeed - A feed reader written in Rust with a Yew frontend.
- Flow.er - A notebook app integrated with todo lists utility. Developed with Rust, WebAssembly, Yew and Trunk.
- Fullstack-Rust - A Full Stack Rust application (Connect5 game) with Actix-web, Yew, Bulma CSS and Diesel.
- Sea_battle - A simple example of a sea battle game. Rust + Yew.
- tide-async-graphql-mongodb - Clean boilerplate for graphql services, with wasm/yew frontend.
- surfer - A blog built on yew + graphql, with live demo site. Backend for graphql services, and frontend for web application.
- qubit - A handy calculator, based on Rust and WebAssembly, Live Demo.
- Paudle - A reimplementation of the excellent word game Wordle by Josh Wardle.
- Rust algorithms - A website with interactive implementations of various algorithms (only sorting algorithms for now).
- Marc Portfolio - A software developer portfolio, Live Demo.
- zzhack - A personal blog, based on Rust & Yew, Live Demo.
- viz.rs - A website for viz web framework, Live Demo.
- hurlurl - A randomizing link shortener, Live Demo.
- Macige - CI workflow generator for mobile app development, Live Demo.
- Spaceman - A cross-platform and graphical client for the gRPC communication protocol.
Templates
- Create Yew App - Set up a modern Yew web app by running one command,
npx create-yew-app my-app
. - yew-wasm-pack-template - A template for starting a Yew project to be used with wasm-pack.
- yew-wasm-pack-minimal - A minimal template for starting a Yew project using wasm-bindgen and wasm-pack.
- yew-parcel-template - Awesome Yew with Yew-Router and Parcel application.
Crates
Component Libraries
- yew-mdc - Material Design Components for the Yew framework.
- muicss-yew - MUI-CSS Components for Yew framework.
- yew-bulma - A Rust library providing components based on the bulma css library for projects using Yew.
- material-yew - Yew wrapper for Material Web Components.
- Yewprint - Port of blueprintjs.com to Yew.
- ybc - A Yew component library based on the Bulma CSS framework.
- patternfly-yew - Patternfly components for Yew.
- yew-feather - Feather Icons components for Yew.
- tailwind-yew-builder - Builds Tailwind CSS for Yew using docker-compose. Also supports Trunk.
- yew-components - Material Design Components for the Yew framework.
- yew-chart - A Yew-based charting library that provides SVG based components for rendering charts.
Components
- Yew Form - Components to simplify handling forms with Yew.
- yew-component-size - A Yew component that emits events when the parent component changes width/height.
- yew-virtual-scroller - A Yew component for virtual scrolling / scroll windowing.
- yew-autoprops - proc-macro to automatically derive Properties structs from args for Yew components.
Hooks
- yew-hooks - Custom Hooks library for Yew, inspired by streamich/react-use and alibaba/hooks.
- yew-side-effect - Reconcile Side Effects in Yew Applications, inspired by react-side-effect and react-helmet.
- Bounce - The uncomplicated state management library for Yew, inspired by Redux and Recoil.
Utils
- Yewdux - Redux-like state containers for Yew apps.
- reacty_yew - Generate Yew components from React components via Typescript type definitions.
- styled-yew - CSS in Rust, similar to styled-components, but for Yew.
- stylist-rs - A CSS-in-Rust styling solution for WebAssembly Applications.
- Yew Interop - Load JavaScript and CSS asynchronously in Yew.
- Tailwind RS - Tailwind style tracer in rust, JIT + AOT interpreter.
Wasm
- wasm-bindgen - Facilitating high-level interactions between WebAssembly modules and JavaScript.
- stdweb - Provides Rust bindings to the Web APIs and to allow a high degree of interoperability between Rust and JavaScript.
Tooling
- wasm-pack - Your favorite Rust -> WebAssembly workflow tool.
- wasm-pack-action - Github action to install
wasm-pack
by downloading the executable to speed up CI/CD. - wasm-bindgen-action - Github action to install
wasm-bindgen
by downloading the executable to speed up CI/CD. - cargo-web - A Cargo subcommand for the client-side Web.
- Trunk - Build, bundle & ship your Rust Wasm application to the web.
- trunk-action - Github action to install
Trunk
by downloading the executable to speed up CI/CD. - wabt - The WebAssembly Binary Toolkit, for the
wasm-strip
andwasm-objdump
tools to reduce .wasm file size. - binaryen - Compiler infrastructure and toolchain library for WebAssembly, for the
wasm-opt
tool to reduce .wasm file size.
Articles
- Let's Build a Rust Frontend with Yew
- A Web Application completely in Rust
- Yew - Rust & WebAsse-frontend framework
- Create a desktop app in Rust using Tauri and Yew
- A code walkthrough video of Yew with a real-world app with Christopher Hunt and Kiki Carter
Books
- The WebAssembly Book - Working with the web and producing .wasm files.
- The wasm-bindgen Guide - How to bind Rust and JavaScript APIs.
- The wasm-pack Guide - How to build and work with rust-generated WebAssembly.
- Programming WebAssembly with Rust - Includes a chapter
Advanced JavaScript Integration with Yew
on creating an app with Yew. - Creative Projects for Rust Programmers - Chapter 5,
Creating a Client-Side WebAssembly App Using Yew
.
Alternatives
Yew team love to share ideas with other projects and believe we can all help each other reach the full potential of this exciting new technology.
- Draco - A Rust library for building client side web applications with WebAssembly.
- Percy - A modular toolkit for building isomorphic web apps with Rust + WebAssembly.
- Sauron - Sauron is an HTML web framework for building web-apps.
- Seed - A Rust framework for creating web apps.
- Smithy - A framework for building WebAssembly apps in Rust.
- Dioxus - Elegant React-like library for building user interfaces for desktop, web, mobile, SSR, liveview, and more.
- Sycamore - A reactive library for creating web apps in Rust and WebAssembly.
Related lists
- Awesome Rust and WebAssembly - A list of awesome Rust and WebAssembly projects, libraries, tools, and resources.
- Awesome WebAssembly - Collection of awesome things regarding WebAssembly ecosystem.
- Awesome Rust - A curated list of Rust code and resources.