Modularer Baukasten für lokale Vernetzung und dezentrale Zusammenarbeit
Lokale Gemeinschaften brauchen digitale Werkzeuge, die echte Begegnungen fördern statt ersetzen. Real Life Stack ist ein modularer Baukasten, mit dem Communities eigene Apps für lokale Vernetzung bereitstellen und an ihre Bedürfnisse anpassen können.
Selbstorganisation leicht gemacht – Werkzeuge für echte Zusammenarbeit, die Gruppen dabei helfen, gemeinsam vor Ort etwas zu bewegen.
Lokale Initiativen werden zu zentralen Akteuren bei der Bewältigung sozialer und ökologischer Herausforderungen. Doch:
- Etablierte Plattformen sind auf Aufmerksamkeit und Reichweite optimiert, nicht auf lokale Zusammenarbeit
- Kleine Initiativen besitzen nicht die Ressourcen, eigene Systeme zu bauen
- Fehlende Infrastruktur zwingt Communities auf Plattformen, die ihre Daten kontrollieren
Real Life Stack bietet eine gemeinsame technische Grundlage:
- Modularer UI-Baukasten – Karte, Kalender, Gruppen, Profile, Feed als wiederverwendbare Komponenten
- White-Label-App – Sofort einsetzbar, ohne Programmierkenntnisse anpassbar
- Backend-agnostisch – Connector-Architektur für REST, Local-first, P2P oder E2EE
- Vertrauensbasierte Identität – Web of Trust durch reale Begegnungen
Vorschlagen → Planen → Umsetzen → Vertrauen aufbauen → Erfolge teilen → ↩
Real Life Stack unterstützt den gesamten Kreislauf: von der Idee über die Verabredung bis zur gemeinsamen Umsetzung vor Ort. Durch echte Zusammenarbeit entsteht ein Vertrauensnetzwerk (Web of Trust), das die Gemeinschaft nachhaltig stärkt.
┌──────────────────────────────────────────────────────────┐
│ UI │
│ ┌────────────────────────────────────────────────────┐ │
│ │ App-Shell │ │
│ └────────────────────────────────────────────────────┘ │
│ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌──────┐ │
│ │ Kanban │ │Kalender│ │ Karte │ │ Feed │ │ ... │ │
│ └────────┘ └────────┘ └────────┘ └────────┘ └──────┘ │
├──────────────────────────────────────────────────────────┤
│ Hooks (dünn) │
├──────────────────────────────────────────────────────────┤
│ DataInterface │
├──────────────────────────────────────────────────────────┤
│ Connectoren │
│ ┌────────┐ ┌───────────┐ ┌────────────────────────┐ │
│ │ Mock │ │ REST │ │ WoT (Automerge+E2EE) │ │
│ └────────┘ └───────────┘ └────────────────────────┘ │
└──────────────────────────────────────────────────────────┘
Die App-Shell ist der Container, die UI-Module (Kanban, Kalender, Karte, Feed, ...) sind austauschbar. Jede Gruppe wählt, welche Module sie nutzt. Module prüfen nicht den Item-Typ, sondern welche Daten-Felder vorhanden sind (status → Kanban, start/end → Kalender, location → Karte).
Die Hooks sind eine dünne Schicht zwischen UI und Connector — sie übersetzen Observables in React State und Mutations in Promises. Das DataInterface definiert den Vertrag: Items, Gruppen, Identität, Reaktivität. Module kennen nur dieses Interface, nicht das Backend.
Jeder Connector implementiert das DataInterface für ein spezifisches Backend. Der MockConnector (in-memory) dient zur Entwicklung, ein REST-Connector für klassische Server, der WoT-Connector (Automerge + E2EE) für dezentrale, verschlüsselte Zusammenarbeit.
| Modul | Beschreibung |
|---|---|
| Map | Lokale Orte, Ressourcen und Aktivitäten auf einer Karte visualisieren |
| Calendar | Events planen, Termine koordinieren, Einladungen verwalten |
| Feed | Aktivitäten-Stream aus allen Modulen – was passiert in der Community? |
| Groups | Gruppen mit Rollen, Mitgliedschaften und gemeinsamen Ressourcen |
| Profiles | Nutzerprofile mit Fähigkeiten, Interessen und Vertrauensbeziehungen |
- Nachbarschaftsnetzwerke und Urban-Gardening-Gruppen
- Repair-Cafés, Foodsharing-Initiativen, Solawis
- Jugendgruppen und freie Lernorte
- Sharing- und Tausch-Communities
- Organisationen, die lokale Gruppen stärken
| Demo | Beschreibung |
|---|---|
| Landing Page | Projektübersicht und Einstieg |
| Reference App | Implementierung mit allen Modulen |
| UI-Prototyp | Experimentelle UI-Konzepte und Komponenten |
| Storybook | Komponenten-Dokumentation |
| Web-of-Trust | Forschungs-Prototyp für dezentrale Identität |
Web-of-Trust ist eine experimentelle Spielwiese, auf der wir Ideen und Ansätze für Real Life Stack erforschen und testen:
- Dezentrale Identitäten – Experimente mit did:key und Ed25519
- Web of Trust – QR-Code-basierte Verifizierung, JWS-Signaturen
- Local-first – Automerge CRDT für Offline-Fähigkeit
- Modulare Architektur – AppShell-Pattern für verschiedene Apps
Zur Landing Page → | Zum Prototyp → | GitHub →
Das Projekt wird von einem Team mit langjähriger Erfahrung in Open-Source-Community-Tools entwickelt:
- Anton Tranelis – Projektkoordination, System-Architektur, Full Stack
- Ulf Gebhardt – Full Stack, DevOps, Infrastruktur
- Sebastian Stein – Frontend-Entwicklung, UX/UI
- Mathias Lenz – Qualitätssicherung, Testing, Dokumentation
- Utopia Map – Kartenplattform für lokale Vernetzung
- ocelot.social – Soziales Netzwerk für Communities
real-life-stack/
├── packages/
│ ├── data-interface/ # @real-life-stack/data-interface - TypeScript-Typen
│ ├── mock-connector/ # @real-life-stack/mock-connector - In-Memory-Implementierung
│ └── toolkit/ # @real-life-stack/toolkit - UI-Komponenten
├── apps/
│ ├── landing/ # Landing Page
│ ├── reference/ # Reference App (React 19)
│ └── prototype/ # UI-Prototyp (experimentell)
└── docs/ # Dokumentation
├── spec/ # Architektur-Spezifikation
├── modules/ # Modul-Spezifikationen
├── concepts/ # Konzept-Dokumente
└── funding/ # Förderantrag
# Dependencies installieren
pnpm install
# Reference App starten
pnpm dev:reference
# Landing Page starten
pnpm dev:landing
# Toolkit bauen
pnpm build:toolkitUI-Module arbeiten gegen das DataInterface — ein TypeScript-Interface, das Daten, Gruppen, Identitaet und Reaktivitaet abstrahiert. Connectoren implementieren dieses Interface fuer verschiedene Backends.
Reine TypeScript-Typen (keine Runtime-Abhaengigkeiten):
import type { DataInterface, Item, Group, User, Observable } from "@real-life-stack/data-interface"In-Memory-Implementierung mit Demo-Daten fuer Entwicklung ohne Backend:
import { MockConnector } from "@real-life-stack/mock-connector"
const connector = new MockConnector()
await connector.init()
const tasks = await connector.getItems({ type: "task" }) // 5 Demo-Tasks
const groups = await connector.getGroups() // 3 Demo-Gruppen
// Reaktiv beobachten
const obs = connector.observe({ type: "task" })
obs.subscribe((tasks) => { /* Live-Updates */ })Architektur-Details: docs/spec/architektur2.md
Das Toolkit-Package exportiert wiederverwendbare UI-Komponenten:
import { Button, Card, Avatar, Tabs } from '@real-life-stack/toolkit'# Storybook lokal starten
pnpm storybook
# Storybook bauen
pnpm build:storybook- TypeScript + React 19
- Tailwind CSS v4
- Radix UI Primitives
- CVA (class-variance-authority)
- Vite
Gemeinsam gestalten wir die Zukunft – lokal vernetzt, global gedacht.