Awesome Yew Overview
😎 A curated list of awesome things related to Yew / WebAssembly.
🏠 Home · 🔥 Feed · 📮 Subscribe · ❤️ Sponsor · 😺 jetli/awesome-yew · ⭐ 1.5K · 🏷️ Front-End Development
Awesome Yew
A curated list of awesome things related to Yew.
Yew (⭐31k) is a modern Rust framework inspired by Elm and React for creating multi-threaded frontend apps with WebAssembly.
Contributions welcome! Read the contribution guidelines first.
Contents
Official
- Yew (⭐31k) - Rust / WebAssembly framework for building client web apps.
- Live demo - A todomvc demo.
- Examples (⭐31k) - Smaller examples included in official repo.
- API Docs - Docs on docs.rs.
- Website - Official website.
- Chatroom - It is pretty active and is a great place to ask questions.
- Reddit - Dedicated Sub Reddit.
- Financial Contribute - Become a financial contributor and help us sustain our community.
- Playground - Online playground for Yew.
Projects
- Realworld example (⭐856) - 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 (⭐82k). - webapp.rs (⭐2.2k) - A web application completely written in Rust, frontend is built with Yew.
- Rust-Full-Stack (⭐1.5k) - Easily testable and working Rust codes with blog posts to explain them.
- Bucket Questions (⭐5) - A webapp written entirely in Rust for a dumb party game.
- web-view todomvc desktop app (⭐109) - Demo how to use yew for a todomvc that compiles to WebAssembly and is bundled as a lightweight(~2mb) desktop app by web-view (⭐1.9k), as an alternative to Electron, web-view (⭐1.9k) also has a demo (⭐1.9k).
- yew-react-example (⭐65) - This project shows how to create a web app using a React component inside a Yew component.
- Kirk (⭐42) - Just A Rust WebAssembly Blog.
- rust-async-wasm-demo (⭐49) - Toy project to learn Rust and async that can be deployed to the web.
- karaoke-rs (⭐161) - A simple, network enabled karaoke player in Rust.
- I Love Hue! (rs) (⭐24) - A clone of the mobile game I Love Hue in Yew (Rust).
- yew-styles-page (⭐155) - This is an initial project of a framework style for yew.
- caniuse.rs (⭐173) - Rust feature search.
- Rust electron yew demo (⭐18) - An example of building a Rust based web app (Yew) into a native app using electron.
- covplot (⭐21) - Live graphs of worldwide CoVID-19 data.
- Minesweeper (⭐35) - Minesweeper built with Rust, Yew and WebAssembly.
- Freecell (⭐6) - A patience game written in Rust and Yew.
- Yew-WebRTC-Chat (⭐124) - A simple WebRTC chat made with Yew.
- Yew Fullstack Boilerplate (⭐58) - Highly opinionated boilerplate for creating full stack applications with Rust.
- Chord Quiz (⭐16) - Practice recognizing chords in this Rust/Yew/WebAssembly app.
- RustMart (⭐270) - Single Page Application (SPA) written using Rust, Wasm and Yew.
- DevAndDev (⭐40) - A website where developers can find pair-programming partners. Written in Rust, Yew frontend.
- yew-octicons (⭐18) - An easy interface for using Octicons in Yew projects.
- Pipe (⭐32) - This is a Rust / Wasm client web app which is a task control center.
- note-to-yew (⭐3) - Convert your markups into Yew macro online, which is also made by Yew.
- ASCII-Hangman (⭐7) - Configurable Hangman game for children with ASCII-art rewarding.
- dotdotyew (⭐3) - Dot-voting using Yew, with Rust powering the backend API.
- wasm-2048 (⭐151) - 2048 game implemented with Rust and Yew and compiled to Wasm.
- website-wasm (⭐58) - My personal website written in Rust via Yew/Wasm.
- KeyPress (⭐7) - A Rust WebAssembly Website example for practising english for chinese.
- yew-train-ticket (⭐4) - A Rust WebAssembly Webapp example basing Yew newest hooks and functional API, the code style is extremely like React Function Component.
- yew-d3-example (⭐24) - Showing a d3 chart with Yew.
- Oxfeed (⭐12) - A feed reader written in Rust with a Yew frontend.
- Flow.er (⭐53) - A notebook app integrated with todo lists utility. Developed with Rust, WebAssembly, Yew and Trunk.
- Fullstack-Rust (⭐91) - A Full Stack Rust application (Connect5 game) with Actix-web, Yew, Bulma CSS and Diesel.
- Sea_battle (⭐1) - A simple example of a sea battle game. Rust + Yew.
- tide-async-graphql-mongodb (⭐44) - Clean boilerplate for graphql services, with wasm/yew frontend.
- surfer (⭐53) - 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 (⭐41) - A reimplementation of the excellent word game Wordle by Josh Wardle.
- Rust algorithms (⭐107) - A website with interactive implementations of various algorithms.
- Marc Portfolio - A software developer portfolio, Live Demo.
- zzhack (⭐319) - A personal blog, based on Rust & Yew, Live Demo.
- Rquote (⭐3) - Rquote is a web application built using Rust and WebAssembly. It fetches Anime quotes from the Animechan API. Live Demo.
- yew-ssr-tide (⭐1) - The example demonstrates Yew server-side rendering with tide & surf, it needs the development version of Yew.
- yew-ssr-actix-web (⭐15) - The example demonstrates Yew server-side rendering with actix-web & reqwest, it needs the development version of Yew.
- PixelGuesser (⭐8) - PixelGuesser is a real life party gam where players try to guess the contents of an image as quickly as possible.
- Crabtyper (⭐187) - A speedtyping web app written in Rust.
- We-Come Monorepo (⭐1) - This is a monorepo for wecome KM ITB, Live Demo.
- blog-rs (⭐57) - A blog system in which frontend and backend are ALL written in Rust. Backend powered by Warp and frontend built on Yew (WASM).
- mb2 - A poker server with a Yew client. Click the
Demo
button and thenStart
to see the client. - Puzzle Cube (⭐9) - Rubix Cube solver using Rust and Yew, Live Demo.
- CubeShuffle (⭐21) - Card game shuffling utility built with Rust, Yew, Bulma and Tauri.
- Rust Audio (⭐49) - Realtime audio processing / synthesis using Rust/WASM in the browser, Live Demo.
- Kiomet (⭐75) - An online real-time strategy game in which you expand your territory by capturing towers.
- Portfolio website (⭐11) - A portfolio SPA with accessibility built-in by Spencer Imbleau.
- tchatche.rs (⭐187) - A Websocket chat based application built in Yew and Axum.
- viz.rs (⭐9) - A website for viz web framework, Live Demo.
- theiskaa.com (⭐2) - A real world implementation of Yew framework. Live at theiskaa.com.
- live-ask.com (⭐96) - Realtime Event/Meetup Q&A Platform. Live at live-ask.com.
- Sumi (⭐10) - Multi-user issue tracking and knowledge base app built with Yew & Actix.
- hurlurl (⭐61) - A randomizing link shortener, Live Demo.
- Macige (⭐90) - CI workflow generator for mobile app development, Live Demo.
- Spaceman (⭐367) - Spaceman is a cross-platform gRPC client designed to be pleasant to use and pretty to look at.
- Crypto-helper (⭐33) - Web app that can hash, encrypt, and sign the data on the client side. Also includes a JWT debugger. Website.
- zoom-rs (⭐1.4k) - Zoom clone written in rust for research purposes.
- Ubiquity (⭐175) - An open-source, cross-platform markdown editor; built with Yew, Tauri, Tailwind, and DaisyUI. Web App.
- demo_web_zip_wasm (⭐4) - A simple example program for creating ZIP archives running in the browser using WebAssembly, Live Demo.
- RustedLessPass (⭐41) - A stateless password manager. Web App.
- windows-terminal-theme-generator (⭐17) - Simplify your life to create a windows terminal theme. Live Demo
- SandCat (⭐49) - The software has primarily implemented the basic functionalities of an IM application, which includes a fundamental friend system, one-on-one chat, group chat, and one-on-one audio/video calls. It also supports i18n and currently offers a switch between Chinese and English.
- PinePods (⭐188) - PinePods is a Rust based podcast management system that manages podcasts with multi-user support and relies on a central database with clients to connect to it.
- 0721 (⭐10) - The engine of image hosting written in Rust.
- Hikari (⭐19) - The Frontend of Everything.
- simply-view-image-for-python-debugging (⭐53) - Visual studio code extension simply view the image of the image variables when debugging python.
- Mindsweeper (⭐66) - A principled take on minesweeper, Live Demo.
- scap-rs (⭐16) - National Vulnerability Database (NVD) implemented by Rust, Live Demo.
- Sentry Relay (⭐318) - The Sentry Relay is a service that pushes some functionality from the Sentry SDKs as well as the Sentry server into a proxy process.
- Syre (⭐11) - Scientific data management and insights.
- candle-wasm-examples (⭐15k) - Candle is a minimalist ML framework for Rust with a focus on performance (including GPU support) and ease of use. Try our online demos: whisper, LLaMA2, T5, yolo, Segment Anything.
- chipbox (⭐80) - chipbox is an open-source desktop DAW written in Rust.
- Taxy (⭐67) - A reverse proxy server with built-in WebUI, supporting TCP/HTTP/TLS/WebSocket, written in Rust.
- Proxelar (⭐405) - Rust-based Man in the Middle proxy, an early-stage project aimed at providing visibility into network traffic.
- diff.rs (⭐86) - Web application to render a diff between Rust crate versions. Implemented in Yew, runs fully in the browser as WebAssembly, Live Demo.
- konnektoren.help (⭐0) - An interactive web application for learning German grammar, featuring gamified challenges and a map-based interface. Web App
Templates
- Create Yew App (⭐164) - Set up a modern Yew web app by running one command,
npx create-yew-app my-app
. - yew-wasm-pack-template (⭐118) - A template for starting a Yew project to be used with wasm-pack.
- yew-wasm-pack-minimal (⭐112) - A minimal template for starting a Yew project using wasm-bindgen and wasm-pack.
- yew-parcel-template (⭐113) - Awesome Yew with Yew-Router and Parcel application.
- yew-template-for-github-io (⭐26) - Directly deployable Template of yew project for github.io, using tailwind and webpack for css, trunk for build and serve.
- tailwindcss-yew-template (⭐14) - Simple layout for using Tailwindcss with Yew.
- axum-yew-setup (⭐143) - A starter project that sets up Axum and Yew for full stack Rust web apps.
- rust-yew-axum-tauri-desktop (⭐130) - Rust + Yew + Axum + Tauri, full-stack Rust development for Desktop apps.
- Yew PWA Minimal (⭐56) - A minimal Progressive Web App using Yew.
- Yew HTTP Starter (⭐4) - Yew template with a simple HTTP message & useful helper comments.
- Yew minimlistic template (⭐0) - A minimalistic template for quickly starting a project on yew.
Crates
Component Libraries
- yew-mdc (⭐63) - Material Design Components for the Yew framework.
- muicss-yew (⭐35) - MUI-CSS Components for Yew framework.
- yew-bulma (⭐20) - A Rust library providing components based on the bulma css library for projects using Yew.
- material-yew (⭐230) - Yew wrapper for Material Web Components.
- Yewprint (⭐450) - Port of blueprintjs.com to Yew.
- ybc (⭐258) - A Yew component library based on the Bulma CSS framework.
- patternfly-yew (⭐155) - Patternfly components for Yew.
- yew-feather (⭐19) - Feather Icons components for Yew.
- tailwind-yew-builder (⭐76) - Builds Tailwind CSS for Yew using docker-compose. Also supports Trunk.
- yew-components (⭐61) - Material Design Components for the Yew framework.
- yew-chart (⭐59) - A Yew-based charting library that provides SVG based components for rendering charts.
- tailyew (⭐18) - Yew wrapper around DaisyUI (tailwindcss based) components.
- yew-duskmoon-ui (⭐5) - Duskmoon UI Component Library. This package use
stylist
to embbed css in components, so no extra CSS file is needed. Live Demo. - yew-bootstrap (⭐37) - A Yew wrapper for the Bootstrap 5 component library.
- Zu (⭐6) - Yew web components, implementing Material Design.
- yew-nav-link (⭐1) - A navigational link that is aware of its active state based on the current route in the application.
Components
- Yew Form (⭐95) - Components to simplify handling forms with Yew.
- yew-component-size (⭐4) - A Yew component that emits events when the parent component changes width/height.
- yew-virtual-scroller (⭐4) - A Yew component for virtual scrolling / scroll windowing.
- yew-oauth2 (⭐44) - A plain Yew OAuth2/OpenIDConnect component, not tied to any CSS framework.
- yew-scroll-area (⭐3) - Custom scroll area for Yew.
Hooks
- yew-hooks (⭐169) - Custom Hooks library for Yew, inspired by streamich/react-use (⭐42k) and alibaba/hooks (⭐14k).
- yew-side-effect (⭐5) - Reconcile Side Effects in Yew Applications, inspired by react-side-effect (⭐1.2k) and react-helmet (⭐17k).
- Bounce (⭐100) - The uncomplicated state management library for Yew, inspired by Redux (⭐61k) and Recoil (⭐20k).
- yewv (⭐11) - A lightning fast state management module for Yew built with performance and simplicity as a first priority.
Javascript Library Ports
- Plotly.rs (⭐1.1k) - Rust bindings for the popular Plotly charting library.
- ag-grid-rs (⭐15) - Rust bindings for the AG Grid datatable library.
- popper-rs (⭐5) - Popper JS bindings for Rust.
Utils
- Yewdux (⭐319) - Redux-like state containers for Yew apps.
- reacty_yew (⭐54) - Generate Yew components from React components via Typescript type definitions.
- styled-yew (⭐35) - CSS in Rust, similar to styled-components, but for Yew.
- stylist-rs (⭐370) - A CSS-in-Rust styling solution for WebAssembly Applications.
- Yew Interop (⭐41) - Load JavaScript and CSS asynchronously in Yew.
- Tailwind RS (⭐111) - Tailwind style tracer in rust, JIT + AOT interpreter.
- yew-style-in-rs (⭐23) - Scoped CSS in Rust for Yew.
- yew_icons (⭐41) - Easily include a variety of svg icons(Feather/Font Awesome/Octicons) into your Yew app.
- Yew-Template (⭐39) - A crate for separating HTML and Rust code when using Yew.
- yew-nested-router (⭐6) - A router that supported nesting, with Yew 0.20.
- turf (⭐51) - Macro based compile-time SCSS transpilation, CSS minification, and class name uniquification toolchain inspired by CSS modules.
- browser-panic-hook (⭐7) - A panic handler for browser environments, allowing to fail in an end-user friendly way.
Wasm
- wasm-bindgen (⭐7.7k) - Facilitating high-level interactions between WebAssembly modules and JavaScript.
- stdweb (⭐3.4k) - Provides Rust bindings to the Web APIs and to allow a high degree of interoperability between Rust and JavaScript.
- tauri-sys (⭐90) - Raw bindings to the Tauri API for projects using wasm-bindgen.
Frameworks
- stackable (⭐22) - A framework experience for Yew.
Tooling
- wasm-pack (⭐6.2k) - Your favorite Rust -> WebAssembly workflow tool.
- wasm-pack-action (⭐50) - Github action to install
wasm-pack
by downloading the executable to speed up CI/CD. - wasm-bindgen-action (⭐10) - Github action to install
wasm-bindgen
by downloading the executable to speed up CI/CD. - cargo-web (⭐1.1k) - A Cargo subcommand for the client-side Web.
- Trunk (⭐3.4k) - Build, bundle & ship your Rust Wasm application to the web.
- trunk-action (⭐31) - Github action to install
Trunk
by downloading the executable to speed up CI/CD. - wabt (⭐6.8k) - The WebAssembly Binary Toolkit, for the
wasm-strip
andwasm-objdump
tools to reduce .wasm file size. - binaryen (⭐7.4k) - Compiler infrastructure and toolchain library for WebAssembly, for the
wasm-opt
tool to reduce .wasm file size. - Tauri (⭐82k) - Tauri is a framework for building tiny, blazingly fast binaries for all major desktop platforms. Developers can integrate any front-end framework that compiles to HTML, JS and CSS for building their user interface. The backend of the application is a rust-sourced binary with an API that the front-end can interact with.
- yew-fmt (⭐19) - A configurable extension to
rustfmt
for formatting Yew HTML.
Articles
- Let's Build a Rust Frontend with Yew
- How to use Rust Yew (⭐2)
- How to use a modal in Rust (⭐2)
- How to use routers in Rust Frontend (⭐2)
- How to modulize your Rust Frontend (⭐2)
- How to use NPM packages with Rust Frontend (⭐2)
- How to use markdown with Rust Frontend (⭐2)
- Fullstack Rust with Yew (⭐2)
- How to write Full Stack Rust code (⭐2)
- How to render a YouTube vlog with Rust Yew fetch API (⭐2)
- How to render blog posts with Rust Yew mounted API (⭐2)
- 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
Courses
- full-stack-todo-rust-course (⭐244) - Full stack rust course including course for Yew.
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 (⭐302) - A Rust library for building client side web applications with WebAssembly.
- Percy (⭐2.3k) - A modular toolkit for building isomorphic web apps with Rust + WebAssembly.
- Sauron (⭐2k) - Sauron is an HTML web framework for building web-apps.
- Seed (⭐3.8k) - A Rust framework for creating web apps.
- Smithy (⭐350) - A framework for building WebAssembly apps in Rust.
- Dioxus (⭐20k) - Elegant React-like library for building user interfaces for desktop, web, mobile, SSR, liveview, and more.
- Sycamore (⭐2.8k) - A reactive library for creating web apps in Rust and WebAssembly.
- Leptos (⭐16k) - Build fast web applications with Rust.
Related lists
- Awesome Rust and WebAssembly (⭐632) - A list of awesome Rust and WebAssembly projects, libraries, tools, and resources.
- Awesome WebAssembly (⭐8.8k) - Collection of awesome things regarding WebAssembly ecosystem.
- Awesome Rust (⭐46k) - A curated list of Rust code and resources.