Kursüberblick

In diesem Kurs lernst du die Konzepte, die du beim Bauen von Reflex-Apps jeden Tag brauchst: kurz und zum Selbstausprobieren. Unter jedem Beispiel findest du eine echte, funktionierende Vorschau. Du liest den Code und klickst direkt darauf, um das Ergebnis zu sehen.

Was du in diesem Kurs lernst

• Die Oberfläche per Klick verändern (State und Event-Handler)
• Je nach Bedingung unterschiedliche Inhalte anzeigen (rx.cond)
• Listen auf der Seite darstellen (rx.foreach)
• Warum du im UI-Code kein if, for oder len() verwenden kannst (Kompilierzeit und Laufzeit)
• Komponenten zusammensetzen und gestalten (Kinder, Props, Styles)
• Apps und Seiten anlegen

Warum diese Reihenfolge?

Die offizielle Reflex-Dokumentation beginnt bei Komponenten und Styles und arbeitet sich Schritt für Schritt vor. Dieser Kurs dreht die Reihenfolge um und startet damit, per Klick eine Zahl hochzuzählen. Wenn du zuerst siehst, wie die Oberfläche reagiert, ergeben sich die übrigen Konzepte ganz natürlich als „das brauche ich dafür“.

1. In Lektion 1 zählst du eine Zahl hoch, in Lektion 2 und 3 veränderst du die Oberfläche mit Bedingungen und Listen.
2. Lektion 4 klärt die Frage: „Aber warum kann ich nicht einfach if schreiben?“ Das ist die wichtigste Lektion des Kurses.
3. In Lektion 5 gestaltest du die Oberfläche, jetzt mit dem Wissen, wie alles funktioniert, und in Lektion 6 setzt du alles Gelernte zu einer kleinen App zusammen.

Voraussetzungen

• Python-Grundlagen (Funktionen, Klassen, Listen)
• Eine Entwicklungsumgebung mit installiertem Reflex. Falls du noch keine hast, arbeite zuerst Lektion 1 von Full-Stack-Webentwicklung mit Python und Reflex durch.

Die Beispiele auf dieser Seite kannst du ohne Installation ausprobieren. Wenn du sie selbst abtippen möchtest, füge die Beispielfunktion in die Hauptdatei eines Reflex-Projekts ein und registriere sie mit app.add_page(funktionsname).

Originaldokumentation

Dieser Kurs basiert auf der offiziellen Reflex-Dokumentation Getting Started › Basics. Reihenfolge und Erklärungen wurden für Einsteiger neu aufgebaut. Alle Codebeispiele wurden mit Reflex 0.10.0 ausgeführt und geprüft.