Datei-basiertes CMS für Projekte implementiert und Scroll-Animationen hinzugefügt
This commit is contained in:
114
README.md
114
README.md
@@ -1,99 +1,87 @@
|
||||
bytemalte_de – Community Chat
|
||||
bytemalte_de – Community Chat & Projekt-Portfolio
|
||||
|
||||
Dies ist ein Fullstack-Projekt für einen modernen Gruppenchat, entwickelt mit:
|
||||
- Leptos – Web-Framework aus Rust
|
||||
- cargo-leptos – Fullstack-Build-Tool
|
||||
- Axum – Webserver-Framework
|
||||
- SQLite – Leichte Embedded-Datenbank
|
||||
Dies ist ein Fullstack-Projekt für eine moderne Community-Plattform, entwickelt mit:
|
||||
|
||||
Leptos (0.8) – Web-Framework aus Rust (Frontend & SSR)
|
||||
|
||||
cargo-leptos – Fullstack-Build-Tool
|
||||
|
||||
Axum – Webserver-Framework
|
||||
|
||||
SQLite & SQLx – Datenbank für Chat & Benutzer
|
||||
|
||||
File-based CMS – JSON-basiertes System für Projekt-Verwaltung
|
||||
|
||||
Projekt-Features
|
||||
|
||||
Echtzeit-Chat: Benutzerregistrierung und Gruppenchat mit SQLite-Backend.
|
||||
|
||||
Projekt-Portfolio: Dynamische Anzeige von Projekten direkt aus einer projects.json.
|
||||
|
||||
Infinite Scroll: Performantes Nachladen von Inhalten auf der Startseite.
|
||||
|
||||
Server Side Rendering (SSR): Schnelle Ladezeiten und SEO-Optimierung.
|
||||
|
||||
Projekt-Setup
|
||||
|
||||
1. Datenbank konfigurieren
|
||||
Voraussetzungen & Tools Stelle sicher, dass Rust installiert ist. Installiere zusätzlich die benötigten Komponenten:
|
||||
|
||||
Erstelle im Hauptverzeichnis eine .env Datei mit folgendem Inhalt:
|
||||
DATABASE_URL="sqlite:community.db"
|
||||
rustup target add wasm32-unknown-unknown cargo install cargo-leptos cargo install sqlx-cli --no-default-features --features sqlite
|
||||
|
||||
Initialisiere anschließend die Datenbank und führe Migrationen aus:
|
||||
sqlx db create
|
||||
sqlx migrate run
|
||||
SASS Compiler: Fedora: sudo dnf install dart-sass Oder via npm: npm install -g sass
|
||||
|
||||
Damit werden die Tabellen für Benutzer und Nachrichten in der Datei community.db angelegt.
|
||||
Datenbank & Umgebung Erstelle eine .env Datei im Hauptverzeichnis: DATABASE_URL="sqlite:community.db"
|
||||
|
||||
Initialisiere die Datenbank und führe Migrationen aus: sqlx db create sqlx migrate run
|
||||
|
||||
2. Entwicklungsserver starten
|
||||
CMS Konfiguration (Projekte) Die Projekte auf der Startseite werden über die Datei projects.json gesteuert. Du kannst Projekte hinzufügen oder ändern, ohne den Code neu zu kompilieren. Die Datei muss im Hauptverzeichnis liegen.
|
||||
|
||||
Starte das Projekt mit Hot-Reload:
|
||||
cargo leptos watch
|
||||
Struktur der projects.json: [ { "id": 1, "title": "Projekt Name", "description": "Beschreibung...", "image_url": "/assets/bild.png", "download_url": "#", "code_url": "https://..." } ]
|
||||
|
||||
Nach erfolgreicher Kompilierung (WASM für das Frontend und Binärdatei für das Backend) ist die Anwendung unter
|
||||
http://127.0.0.1:3000 erreichbar.
|
||||
Entwicklungsserver starten
|
||||
|
||||
Starte das Projekt mit Hot-Reload: cargo leptos watch
|
||||
|
||||
Zusätzliche Tools und Konfiguration
|
||||
Nach erfolgreicher Kompilierung ist die Anwendung unter http://127.0.0.1:3000 erreichbar.
|
||||
|
||||
Dieses Projekt nutzt kryptografische Funktionen (bcrypt) und Datenbankzugriffe. Stelle sicher, dass folgende Tools installiert sind:
|
||||
Zusätzliche Konfiguration
|
||||
|
||||
rustup target add wasm32-unknown-unknown
|
||||
cargo install sqlx-cli --no-default-features --features sqlite
|
||||
|
||||
SASS Compiler:
|
||||
Fedora:
|
||||
sudo dnf install dart-sass
|
||||
oder mit npm:
|
||||
npm install -g sass
|
||||
|
||||
Füge folgende Konfiguration in .cargo/config.toml hinzu, um das WASM-Krypto-Backend zu aktivieren:
|
||||
[target.wasm32-unknown-unknown]
|
||||
rustflags = ["--cfg", "getrandom_backend=\"wasm_js\""]
|
||||
Füge folgende Konfiguration in .cargo/config.toml hinzu, um das WASM-Krypto-Backend (bcrypt) zu aktivieren:
|
||||
|
||||
[target.wasm32-unknown-unknown] rustflags = ["--cfg", "getrandom_backend="wasm_js""]
|
||||
|
||||
Produktion / Release Build
|
||||
|
||||
Erzeuge eine optimierte Release-Version:
|
||||
cargo leptos build --release
|
||||
Erzeuge eine optimierte Release-Version: cargo leptos build --release
|
||||
|
||||
Dieser Befehl erstellt:
|
||||
- Die Server-Binärdatei unter target/release/bytemalte_de
|
||||
- Das Frontend-Paket (WASM/JS/CSS) unter target/site
|
||||
|
||||
Die Server-Binärdatei unter target/release/bytemalte_de
|
||||
|
||||
Tests ausführen
|
||||
|
||||
Führe End-to-End-Tests mit Playwright aus:
|
||||
cargo leptos end-to-end
|
||||
|
||||
Die Tests befinden sich im Verzeichnis end2end/tests.
|
||||
|
||||
Das Frontend-Paket (WASM/JS/CSS) unter target/site
|
||||
|
||||
Deployment auf einem entfernten Server (Ubuntu 24.04 VPS)
|
||||
|
||||
Nach cargo leptos build --release benötigst du auf dem Zielserver folgende Dateien:
|
||||
- target/release/bytemalte_de
|
||||
- target/site/
|
||||
- community.db
|
||||
- .env
|
||||
Nach dem Build benötigst du auf dem Zielserver folgende Dateien:
|
||||
|
||||
Beispielhafte Verzeichnisstruktur:
|
||||
bytemalte_de/
|
||||
├── site/
|
||||
├── community.db
|
||||
└── .env
|
||||
die Binärdatei (bytemalte_de)
|
||||
|
||||
Exportiere die Umgebungsvariablen (z. B. in einem Systemd-Service):
|
||||
export LEPTOS_OUTPUT_NAME="bytemalte_de"
|
||||
export LEPTOS_SITE_ROOT="site"
|
||||
export LEPTOS_SITE_PKG_DIR="pkg"
|
||||
export LEPTOS_SITE_ADDR="0.0.0.0:3000"
|
||||
export DATABASE_URL="sqlite:community.db"
|
||||
den Ordner site/
|
||||
|
||||
Starte die Anwendung:
|
||||
./bytemalte_de
|
||||
projects.json
|
||||
|
||||
community.db
|
||||
|
||||
.env
|
||||
|
||||
Beispielhafte Verzeichnisstruktur: bytemalte_de/ ├── site/ ├── projects.json ├── community.db └── .env
|
||||
|
||||
Exportiere die Umgebungsvariablen (z. B. in einem Systemd-Service): export LEPTOS_OUTPUT_NAME="bytemalte_de" export LEPTOS_SITE_ROOT="site" export LEPTOS_SITE_PKG_DIR="pkg" export LEPTOS_SITE_ADDR="0.0.0.0:3000" export DATABASE_URL="sqlite:community.db"
|
||||
|
||||
Anwendung starten: ./bytemalte_de
|
||||
|
||||
Lizenz & Urheberrecht
|
||||
|
||||
Dieses Projekt basiert auf dem Leptos Axum Starter Template.
|
||||
Die spezifische Chat-Logik, das Styling und UI-Design wurden individuell für bytemalte_de entwickelt.
|
||||
Dieses Projekt basiert auf dem Leptos Axum Starter Template. Die spezifische Chat-Logik, das JSON-CMS, das Styling und UI-Design wurden individuell für bytemalte_de entwickelt.
|
||||
|
||||
Entwickelt mit ❤️ von bytemalte
|
||||
|
||||
Reference in New Issue
Block a user