Task-Manager mit Gleam bauen: Eine Sprache für Backend, Frontend und Apps

Entwickler träumen seit Langem davon, Code einmal zu schreiben und überall laufen zu lassen. Java, Electron oder Flutter haben das versprochen. Doch oft scheitert es an Frameworks. Was, wenn die Lösung in der Sprache selbst liegt?

Gleam macht das möglich. Diese statisch typisierte Sprache kompiliert auf Erlang für den Backend und JavaScript für den Frontend. So entsteht ein echter Full-Stack-Ansatz. Wir schauen uns das an einem Praxisbeispiel an: einem einfachen Task-Manager namens Doable.

Das Konzept: Ein Code, viele Ziele

Viele Tools werben mit "write once, run anywhere". Meist meinen sie nur eine Plattform. Gleam geht weiter. Derselbe Quellcode wird für verschiedene Laufzeiten kompiliert.

Doable erledigt die Basics: Tasks anlegen, lesen, ändern und löschen. Dahinter steckt eine komplette Architektur:

• JSON-API auf Erlang mit PostgreSQL
• Web-Frontend im Browser mit reaktiver State-Verwaltung
• Desktop-Apps für Windows, macOS und Linux über Tauri
• Mobile-Apps für iOS und Android, ebenfalls mit Tauri

Alles aus einer Sprache. Ein Type-System. Gleiche Logik überall.

Architektur: Dev und Prod im Griff

So arbeiten Entwickler

Im Dev brauchst du schnelle Feedback-Loops. Docker für DB und Server. Hot-Reload für alle Frontends. Tests ohne ständiges Neubauen.

Die Setup löst das sauber:

• PostgreSQL in Docker, separate DBs für Dev und Test
• Gleam-API lokal oder in Docker
• Lustre-Dev-Server mit Hot-Reload für Web, Desktop und Mobile
• API-Proxying killt CORS-Probleme – ein Einstiegspunkt
• Integrationstests direkt am Router mit Test-DB

Das spart Zeit. 30 Sekunden Wartezeit pro Änderung? Vergiss es.

So läuft Production

Im Prod wird's einfach. Alles in Docker. Caddy als zentrale Tür: proxyed zur Gleam-API und serviert Frontend-Dateien.

Browser laden Frontend über Caddy und rufen API auf. Tauri-Apps bündeln das Frontend lokal, greifen aber über HTTP-Plugin auf die API zu. Optimiert pro Plattform, einheitlicher Code.

Der Tech-Stack im Detail

Backend: Erlangs Stärke

Die API kompiliert auf Erlang mit Wisp und Mist. Du bekommst nicht nur ein Framework, sondern Erlangs Konkurrenzfähigkeit: Concurrency, Fault Tolerance, Distribution. Telekom-Qualität seit Jahrzehnten.

PostgreSQL sorgt für solide Datenpersistenz.

Shared Code: Der Hammer

Gleams Trick: Ein shared-Projekt als Multi-Target-Library. Kompiliert für Erlang und JavaScript. Types, Validierung, Serialisierung – alles geteilt. Änderst du eine Task-Struktur? Der Compiler passt überall an.

Keine Typ-Fehler zwischen Backend und Frontend. Keine Runtime-Überraschungen.

Frontend: Elm-Style mit Lustre

Das Web-Frontend nutzt Lustre und die Elm Architecture. State-Management, das vorhersehbar und testbar ist. Bekannt aus Elm, Goldstandard für UIs.

Desktop und Mobile folgen demselben Muster, nur andere Targets.

Warum das für dein Projekt zählt

Type-Safety über den Stack hinweg spart Nerven bei komplexen Apps:

Refactoring ohne Angst. Schema ändern? Shared-Types updaten. Compiler zeigt alle 47 Stellen.

Konsistenz gratis. Validierung nicht in TS, Swift und Kotlin kopieren. Einmal in Gleam, überall kompiliert.

Onboarding boost. Team lernt eine Sprache, nicht drei Welten.

Ops einfacher. Weniger Dependencies, Strategien, Ausfälle.

Die Realität

Wird Gleam alles übernehmen? Wahrscheinlich nicht. Der Eco ist klein, Libraries und Hiring schwieriger als bei TS oder Python.

Aber für neue Full-Stack-Projekte mit Fokus auf Types? Eliminiert Bug-Klassen im Vorfeld.

Doable ist bewusst simpel. Zeigt: Die Basis funktioniert. Komplexität kommt später, Prinzip bleibt.

Loslegen

Lernkurve? Da ist was dran, aber machbar. Syntax wie JS, Python, Rust. Types stark, aber nicht brutal.

Fang mit Erlang-Backend an. API bauen. Dann Lustre-Frontend. Shared-Types killen Bugs. Einmal erlebt, willst du nicht zurück zu getrennten Welten.

Full-Stack könnte um die Sprache drehen, nicht um Tools.

Gleam ausprobieren? Schau in die Docs und denk über dein nächstes Projekt nach. Type-sichere Kompilation überall – das rockt.