rust yew realworld example app

Rost + Yew + WebAssembly -Codebasis, die Beispiele in realer Welt (CRUD, Auth, erweiterte Muster usw.) enthält, die sich an die Realworld -Spezifikation und die API halten.

Demo Realworld

Diese Codebasis wurde erstellt, um eine vollwertige WebAssembly -Webanwendung zu demonstrieren, die mit Yew erstellt wurde, einschließlich CRUD -Operationen, Authentifizierung, Routing, Pagination und vielem mehr. Es verwendet die neuesten function components und hooks von Yew. Es unterstützt auch die Desktop -Anwendung von Tauri.

Wir haben große Anstrengungen unternommen, um uns an die Yew Community StyleGuides & Best Practices zu halten.

Weitere Informationen dazu finden Sie mit anderen Frontends/Backends, um das Realworld Repo zu erhalten.

Wie es aussieht

Sie können eine lebende Demo bei der Demo anzeigen

Home (Web)	Artikel (Web)

Bearbeiten (Desktop)	Melden Sie sich an (Desktop)

Wie es funktioniert

Dies ist eine Anwendung, die in Rust geschrieben wurde und die Eibe und WebAssembly verwendet, um die Frontend -Web -App zu entwickeln, die die Realworld -Anwendung betreibt.

Sie können eine vollständige Liste der Kisten anzeigen, die in Fracht verwendet werden.

• Eibe - Ein modernes Rost -Framework zum Erstellen von Apps mit Multi -Thread -Frontend -Apps mit WebAssembly.
• Yew -Router - eine Routing -Bibliothek für das Eiben -Framework.
• Yew-Hooks-Haken für das Yew-Web-Framework, inspiriert von React-Hook-Libs wie Streamich/React-Use und Alibaba/Hooks.
• Lazy_Static - Ein Makro für die faul ausgewertete Statik in Rost.
• park_lot - Bietet Implementierungen von Mutex , RwLock , Condvar und Once usw.
• PULLDOWN -CMARK - Ein Pull -Parser für Commonmark, der zum Analyse von Markdown verwendet wird.
• SERDE - Ein generisches Serialisierungs-/Deserialisierungsrahmen.
• Chrono - Datums- und Uhrbibliothek für Rost.

Erste Schritte

Mit Docker

docker-compose up

Sie können jetzt http://127.0.0.1:8080 in Ihrem Browser besuchen.

Manuell

• Rost einbauen

• WASM-Pack einbauen

  cargo install wasm-pack

• Kofferraum einbauen

• Bauen und entwickeln

  Kopieren Sie .env.example in .env , und Sie können die Umgebungsvariablen ändern, wenn Sie möchten.

  cp .env.example .env
  cd crates/conduit-wasm && trunk serve

  Sie können jetzt http://127.0.0.1:8080 in Ihrem Browser besuchen.

• Bauen und veröffentlichen

   cd crates/conduit-wasm && trunk build

  Sie sollten jetzt statische Dateien im Ordner crates/conduit-wasm/dist finden. Sie werden jetzt als Demo in GH-Pages-Zweiggeblieben gehostet.

• Prüfen

  Installieren Sie Chromedriver, führen Sie Tests in kopflosen Browsern aus.

  wasm-pack test --headless --chrome

• JustFile

  • Installieren Sie just install-wasm-pack
  • just env .env.example .env
  • Kofferraum-Serve just trunk-serve
  • Kofferraumbau just trunk-build
  • Testen Sie just test

Mit Tauri für Desktop (optional)

• Tauri installieren

  cargo install tauri-cli

• Erstellen und entwickeln Sie sich für den Desktop

  cargo tauri dev

• Erstellen und Freigabe für Desktop

  cargo tauri build

• JustFile

  • Installieren Sie Tauri just install-tauri
  • Bauen und entwickeln just tauri-dev
  • Bauen und veröffentlichen Sie just tauri-build

Eiben -App erstellen

Dieses Projekt wurde mit Create Yew -App mit der Erstellung von Created -App mit einer neuen Yew -Web -App für Ihre eigene einrichten.

npx create-yew-app my-app
cd my-app
trunk serve

JustFile:

• Erstellen yew-Apps just create-yew-app
• App-Serve just app-serve

Beitragen

Schauen Sie sich gerne die aktuellen Probleme in diesem Repo für alles an, worauf er bearbeitet werden muss.

Sie können auch ein PR oder ein neues Problem eröffnen, wenn Sie sehen, dass etwas fehlt oder verbessert werden könnte.

Lizenz

Apache -Lizenz (Version 2.0)

Weitere Einzelheiten finden Sie in Lizenz

Expandieren