ZELYRA CRUD / BEISPIEL

Eine Adressenverwaltung bauen.
Ohne Umwege.

Ein Schema, eine CRUD-Deklaration und ein kompletter Ausgangspunkt für eine echte Business-Anwendung. Diese Seite zeigt den Weg — und wo dein eigenes Design beginnt.

01 / DAS MODELL

Beginne mit den
Informationen.

Eine Adresse ist mehr als eine Tabellenzeile. Definiere zuerst Felder, Typen und Regeln. Zelyra kann dieses Wissen danach für Validierung, Formulare und die CRUD-Ressource nutzen.

table addresses {
    id: Id primary auto
    first_name: String(80) required
    last_name: String(80) required
    street: String(160) required
    city: String(100) required
    email: Email?
    active: Bool default true
}

02 / DIE CRUD-RESSOURCE

Eine Deklaration.
Viele Ansichten.

Die kurze Version

Das reicht für den ersten Start einer nützlichen, schemaabhängigen CRUD-Ressource.

crud Address -> addresses

Listen- und Detailansicht
Create- und Edit-Formulare
Suche, Filter und Sortierung
Pagination und CSRF-geschütztes Löschen

Die Erfahrung konfigurieren

Mache wichtige Spalten und Einstiegspunkte explizit. Das Schema bleibt die Quelle der Wahrheit.

crud Address -> addresses {
    title: "Addresses"
    list { first_name last_name city email active }
    search { first_name last_name city }
    filter { city active }
}

Adressen

Filter +

Name	Ort	E-Mail	Status
Anna Weber	Berlin	anna@example.test	● Aktiv	⋯
Jonas Klein	Hamburg	jonas@example.test	● Aktiv	⋯
Lea Hoffmann	Staufenberg	lea@example.test	○ Inaktiv	⋯

03 / DEIN DESIGN

Der Generator startet.
Du gestaltest.

Zelyra liefert ein sicheres, funktionierendes Fundament. Dein Design entsteht in der View-Schicht: Hierarchie, Abstände, Farben, Interaktion und responsive Verhalten.

01 / HIERARCHY

Mit Priorität beginnen.

Suche, Hauptaktion und Tabelle kommen zuerst. Sekundäre Aktionen dürfen ruhig bleiben.

.crud-preview-head

02 / VISUAL SYSTEM

Deine Tokens nutzen.

Ändere wenige CSS-Variablen statt jeden Button einzeln zu gestalten.

--purple / --acid

03 / COMPONENTS

Verhalten stabil halten.

Gestalte Wrapper, Tabelle und Formularfelder neu — Validierung und Berechtigungen bleiben serverseitig.

view + schema

04 / DESIGN-WORKFLOW

Eine sinnvolle
Reihenfolge.

01Daten definierenFelder, Typen, Beziehungen und Regeln.

02Erzeugen & prüfenzelyra check before changing the database.

03View gestaltenLayout, Typografie, Zustände, leere und fehlerhafte Ansichten.

04Ränder prüfenSuche, Rechte, CSRF, Mobile und destruktive Aktionen testen.

# inspect the plan before applying changes
zelyra db plan addresses.zyl
zelyra check addresses.zyl
zelyra serve addresses.zyl

05 / VOM BEISPIEL ZUR ANWENDUNG

Was hinter den
Ansichten passiert.

Anlegen

Das Formular nimmt die Adressdaten entgegen. Zelyra prüft Pflichtfelder und E-Mail-Formate, bevor der Datensatz in die Datenbank geschrieben wird.

Anzeigen

Die Liste liest Datensätze über die Ressourcendefinition. Suche, Filter und Pagination halten die Ansicht auch bei einem wachsenden Adressbuch übersichtlich.

Bearbeiten

Die Bearbeitung lädt einen Datensatz in dieselbe Feldstruktur. Änderungen durchlaufen dieselben Validierungsregeln wie beim Anlegen.

Sicher löschen

Destruktive Aktionen sollten eindeutig, gegen CSRF geschützt und über Berechtigungen eingeschränkt sein. Für den Produktivbetrieb sind Soft Deletes und ein Änderungsprotokoll sinnvoll.

Das wichtigste Prinzip

Das Schema beschreibt die Daten, die CRUD-Ressource den Arbeitsablauf und die View das Nutzungserlebnis. Wenn diese Aufgaben getrennt bleiben, lässt sich die Anwendung leicht erweitern.

06 / SCHRITT FÜR SCHRITT

Die Adressverwaltung
in sechs Schritten.

Arbeite diese Reihenfolge in einem neuen Zelyra-Projekt durch. Prüfe jeden Schritt, bevor du mit dem nächsten weitermachst.

Projekt anlegen

Starte mit dem offiziellen Repository und wechsle in das Projektverzeichnis. Damit stehen CLI, Beispiele und die grundlegende Laufzeit bereit.

git clone https://github.com/sf1976/zelyra.git
cd zelyra
	./install.sh

Windows mit PowerShell und Docker Desktop
Installiere zuerst Git for Windows und Docker Desktop. Öffne danach PowerShell und führe die folgenden Befehle aus. Das Installationsskript läuft im Linux-Container, daher brauchst du unter Windows keine separate Linux-Installation.

git clone https://github.com/sf1976/zelyra.git
cd zelyra
docker compose -f docker-compose.mariadb.yml up -d --build
docker compose exec app ./install.sh

Adressdaten beschreiben

Lege ein Schema für addresses an. Entscheide, welche Felder Pflichtfelder sind, welchen Typ sie haben und welche Werte leer bleiben dürfen. Dieses Schema ist die Grundlage für Datenbank und Formulare.

table addresses {
    first_name: String(80) required
    last_name: String(80) required
    email: Email?
    city: String(100) required
}

Vor der Datenbankänderung prüfen

Lass Zelyra das Schema prüfen und die geplante Änderung anzeigen. Lies den Plan sorgfältig, besonders wenn das Projekt bereits Daten enthält.

zelyra check addresses.zyl
zelyra db plan addresses.zyl

CRUD-Ressource deklarieren

Verbinde die Ressource mit der Tabelle addresses. Definiere Titel, sichtbare Spalten, Suchfelder und sinnvolle Filter.

crud Address -> addresses {
    list { first_name last_name city email }
    search { first_name last_name city }
    filter { city }
}

Anwendung starten und testen

Starte den lokalen Server und prüfe den gesamten Weg: Liste, Suche, Anlegen, Bearbeiten und Löschen. Teste außerdem leere Ergebnisse, ungültige E-Mail-Adressen und die mobile Darstellung.

zelyra serve addresses.zyl

Design anpassen

Erst wenn das Verhalten funktioniert, passt du die View-Schicht an. Ändere Abstände, Typografie, Farben und Tabellenaktionen, während Validierung und Berechtigungen erhalten bleiben.

resources/views/addresses/index.blade.php
resources/css/addresses.css

Ein zuverlässiger Arbeitsrhythmus

Erst das Modell, dann den Plan prüfen, die Ressource erzeugen, den Ablauf testen und zuletzt gestalten. So lassen sich Fehler leicht finden und die Adressverwaltung bleibt wartbar.

07 / PROBIERE DEN ABLAUF

Eine CRUD-Ressource
zum Ausprobieren.

Diese kleine Frontend-Demo läuft vollständig im Browser. Suche, filtere, lege Datensätze an und lösche sie, um den Ablauf einer erzeugten Ressource zu erleben.

Name	Ort	E-Mail	Status
Anna Weber	Berlin	anna@example.test	Aktiv
Jonas Klein	Hamburg	jonas@example.test	Aktiv
Lea Hoffmann	Staufenberg	lea@example.test	Inaktiv

Keine passenden Adressen gefunden.

Eine Adressenverwaltung bauen.Ohne Umwege.

Beginne mit denInformationen.

Eine Deklaration.Viele Ansichten.