Awesome Yew
プロジェクト
- Realworld example - Rust + Yew + WebAssemblyで構築された、模範的な現実世界のアプリケーション。Yewの最新の`関数コンポーネント`と`フック`を使用しています。Tauriを駆使したデスクトップアプリケーションもサポートしています。
- webapp.rs - フロントエンドがYewで構築された、完全にRustで記述されたウェブアプリケーション。
- Rust-Full-Stack - 簡単にテストでき、動作するRustコードと、それらを説明するブログ記事。
- Bucket Questions - ばかげたパーティーゲーム用の、完全にRustで記述されたウェブアプリ。
- web-view todomvc デスクトップアプリ - WebAssemblyにコンパイルされ、Electronの代替としてweb-viewによって軽量(約2MB)のデスクトップアプリとしてバンドルされるTodomvcにYewを使用する方法のデモ。web-viewにはデモもあります。
- yew-react-example - このプロジェクトは、Yewコンポーネント内にReactコンポーネントを使用してウェブアプリを作成する方法を示しています。
- Kirk - Rust WebAssemblyブログ。
- rust-async-wasm-demo - Rustと非同期処理を学習するための、Webに展開可能な玩具プロジェクト。
- karaoke-rs - シンプルなネットワーク対応カラオケプレーヤー(Rust製)。
- I Love Hue! (rs) - モバイルゲーム「I Love Hue」のYew(Rust)によるクローン。
- yew-styles-page - Yewのフレームワークスタイルの初期プロジェクト。
- caniuse.rs - Rust機能検索。
- Rust electron yew demo - Electronを使用してRustベースのウェブアプリ(Yew)をネイティブアプリにビルドする例。
- covplot - 世界中のCOVID-19データのライブグラフ。
- Tanoshi - Tachiyomiのようなウェブマンガリーダー。tanoshiのフロントエンド。
- Minesweeper - Rust、Yew、WebAssemblyで構築されたマインスイーパー。
- Freecell - RustとYewで記述されたソリティアゲーム。
- Daydream - Rustで記述された小さなMatrixウェブクライアント。
- Yew-WebRTC-Chat - Yewで作成されたシンプルなWebRTCチャット。
- Yew Fullstack Boilerplate - Rustを使用してフルスタックアプリケーションを作成するための、非常に意見の強いボイラープレート。
- Chord Quiz - このRust/Yew/WebAssemblyアプリでコードの認識を練習しましょう。
- RustMart - Rust、Wasm、Yewを使用して記述されたシングルページアプリケーション(SPA)。
- DevAndDev - 開発者がペアプログラミングのパートナーを見つけられるウェブサイト。Rustで記述され、フロントエンドにはYewを使用しています。
- yew-octicons - YewプロジェクトでOcticonsを使用するための簡単なインターフェース。
- Pipe - タスクコントロールセンターであるRust/Wasmクライアントウェブアプリ。
- note-to-yew - マークアップをYewマクロにオンラインで変換します。これもYewで作成されています。
- ASCII-Hangman - ASCIIアートで報われる、子供向けの構成可能なHangmanゲーム。
- dotdotyew - Dot-votingをYewを使用し、バックエンドAPIにはRustを使用。
- wasm-2048 - RustとYewで実装され、Wasmにコンパイルされた2048ゲーム。
- website-wasm - Yew/Wasmを使用してRustで記述された個人的なウェブサイト。
- KeyPress - 中国人のための英語学習練習用Rust WebAssemblyウェブサイトの例。
- yew-train-ticket - Yewの最新のフックと関数型APIに基づいたRust WebAssembly Webアプリの例。コードスタイルはReact関数コンポーネントに非常に似ています。
- yew-d3-example - Yewでd3チャートを表示。
- Oxfeed - Yewフロントエンドを持つRustで記述されたフィードリーダー。
- Flow.er - ToDoリストユーティリティと統合されたノートアプリ。Rust、WebAssembly、Yew、Trunkで開発。
- Fullstack-Rust - Actix-web、Yew、Bulma CSS、Dieselを使用したフルスタックRustアプリケーション(Connect5ゲーム)。
- Sea_battle - 海戦ゲームの簡単な例。Rust + Yew。
- tide-async-graphql-mongodb - wasm/yewフロントエンド付き、graphqlサービス用のクリーンなボイラープレート。
- surfer - Yew + graphqlで構築されたブログ。ライブデモサイトあり。graphqlサービスのバックエンドとウェブアプリケーションのフロントエンド。
- qubit - RustとWebAssemblyに基づく便利な電卓。ライブデモあり。
- Paudle - Josh Wardleによる優れた単語ゲームWordleの再実装。
- Rust algorithms - 様々なアルゴリズムのインタラクティブな実装を含むウェブサイト(現時点ではソートアルゴリズムのみ)。
- Marc Portfolio - ソフトウェア開発者のポートフォリオ。ライブデモあり。
- zzhack - Rust & Yewに基づく個人的なブログ。ライブデモあり。
- viz.rs - vizウェブフレームワークのウェブサイト。ライブデモあり。
- hurlurl - ランダム化されたリンク短縮サービス。ライブデモあり。
- Macige - モバイルアプリ開発のためのCIワークフロージェネレーター。ライブデモあり。
- Spaceman - gRPC通信プロトコルのクロスプラットフォームグラフィカルクライアント。
テンプレート
- Create Yew App - 1つのコマンド`npx create-yew-app my-app`で最新のYewウェブアプリをセットアップ。
- yew-wasm-pack-template - wasm-packで使用されるYewプロジェクトの開始用テンプレート。
- yew-wasm-pack-minimal - wasm-bindgenとwasm-packを使用したYewプロジェクトの開始用最小限のテンプレート。
- yew-parcel-template - Yew-RouterとParcelアプリケーションを使用したAwesome Yew。
クレート
コンポーネントライブラリ
- yew-mdc - Yewフレームワーク用のマテリアルデザインコンポーネント。
- muicss-yew - Yewフレームワーク用のMUI-CSSコンポーネント。
- yew-bulma - Yewを使用するプロジェクト向けに、bulma cssライブラリに基づいたコンポーネントを提供するRustライブラリ。
- material-yew - Material Web ComponentsのYewラッパー。
- Yewprint - blueprintjs.comのYewへの移植。
- ybc - Bulma CSSフレームワークに基づいたYewコンポーネントライブラリ。
- patternfly-yew - Yew用のPatternflyコンポーネント。
- yew-feather - Yew用のFeather Iconsコンポーネント。
- tailwind-yew-builder - docker-compose を使用して Yew 用の Tailwind CSS をビルドします。Trunk もサポートしています。
- yew-components - Yew フレームワーク用のマテリアルデザインコンポーネント。
- yew-chart - SVG ベースのコンポーネントを提供してチャートをレンダリングする、Yew ベースのチャートライブラリ。
コンポーネント
- Yew Form - Yew でフォーム処理を簡素化するコンポーネント。
- yew-component-size - 親コンポーネントの幅/高さが変更されたときにイベントを発行する Yew コンポーネント。
- yew-virtual-scroller - バーチャルスクロール/スクロールウィンドウ用の Yew コンポーネント。
- yew-autoprops - Yew コンポーネントの引数から Properties 構造体を自動的に導出するための proc-macro。
フック
- yew-hooks - streamich/react-use と alibaba/hooks にインスパイアされた、Yew 用のカスタムフックライブラリ。
- yew-side-effect - react-side-effect と react-helmet にインスパイアされた、Yew アプリケーションにおける副作用の調整。
- Bounce - Redux と Recoil にインスパイアされた、Yew 用のシンプルな状態管理ライブラリ。
ユーティリティ
- Yewdux - Yew アプリ用の Redux ライクな状態コンテナ。
- reacty_yew - Typescript 型定義を使用して、React コンポーネントから Yew コンポーネントを生成します。
- styled-yew - styled-components と同様の、Yew 用の Rust で記述する CSS。
- stylist-rs - WebAssembly アプリケーションのための Rust で記述する CSS スタイリングソリューション。
- Yew Interop - Yew で JavaScript と CSS を非同期に読み込みます。
- Tailwind RS - Rust での Tailwind スタイルトレーサー、JIT + AOT インタープリタ。
Wasm
- wasm-bindgen - WebAssembly モジュールと JavaScript の間の高レベルなインタラクションを容易にします。
- stdweb - Web API への Rust バインディングを提供し、Rust と JavaScript の高い相互運用性を可能にします。
ツール
- wasm-pack - お気に入りの Rust -> WebAssembly ワークフローツール。
- wasm-pack-action - 実行可能ファイルをダウンロードして `wasm-pack` をインストールすることで、CI/CD を高速化する GitHub アクション。
- wasm-bindgen-action - 実行可能ファイルをダウンロードして `wasm-bindgen` をインストールすることで、CI/CD を高速化する GitHub アクション。
- cargo-web - クライアントサイド Web 用の Cargo サブコマンド。
- Trunk - Rust Wasm アプリケーションを Web にビルド、バンドル、配信します。
- trunk-action - 実行可能ファイルをダウンロードして `Trunk` をインストールすることで、CI/CD を高速化する GitHub アクション。
- .wasm ファイルサイズを削減するための `wasm-strip` と `wasm-objdump` ツールを提供する WebAssembly バイナリツールキット。
- .wasm ファイルサイズを削減するための `wasm-opt` ツールを提供する WebAssembly 用のコンパイラインフラストラクチャとツールチェーンライブラリ。
記事
- Yew を使用して Rust フロントエンドを構築しましょう
- 完全に Rust で作成された Web アプリケーション
- Yew - Rust と WebAssembly フロントエンドフレームワーク
- Tauri と Yew を使用して Rust でデスクトップアプリを作成する
- Christopher Hunt と Kiki Carter による、実世界のアプリを使用した Yew のコードウォークスルービデオ
書籍
- The WebAssembly Book - Web での作業と .wasm ファイルの生成。
- The wasm-bindgen Guide - Rust と JavaScript API のバインド方法。
- The wasm-pack Guide - Rust で生成された WebAssembly のビルドと使用方法。
- Programming WebAssembly with Rust - Yew を使用したアプリの作成に関する章「Advanced JavaScript Integration with Yew」を含む。
- Creative Projects for Rust Programmers - 第5章「Yew を使用したクライアントサイド WebAssembly アプリの作成」。
代替案
Yew チームは他のプロジェクトとアイデアを共有することを好み、このエキサイティングな新技術の潜在能力を最大限に発揮するために、互いに協力できると信じています。
- Draco - WebAssembly を使用したクライアントサイド Web アプリケーションを構築するための Rust ライブラリ。
- Percy - Rust + WebAssembly を使用して同型 Web アプリを構築するためのモジュール式ツールキット。
- Sauron - Web アプリを構築するための HTML Web フレームワーク。
- Seed - Web アプリを作成するための Rust フレームワーク。
- Smithy - Rust で WebAssembly アプリを構築するためのフレームワーク。
- Dioxus - デスクトップ、Web、モバイル、SSR、liveview など、ユーザーインターフェースを構築するためのエレガントな React ライクなライブラリ。
- Sycamore - Rust と WebAssembly で Web アプリを作成するためのリアクティブライブラリ。
関連リスト
- Awesome Rust and WebAssembly - 素晴らしい Rust と WebAssembly のプロジェクト、ライブラリ、ツール、リソースのリスト。
- Awesome WebAssembly - WebAssembly エコシステムに関する素晴らしいもののコレクション。
- Awesome Rust - Rust のコードとリソースの厳選されたリスト。