Lauf-Tracker-App

Eine Lauf-Tracker-App ist eine mobile App, die Distanz, Zeit, Pace und Route jedes Laufs direkt auf dem Handy festhält und jeder angemeldeten Person nur ihre eigenen Aufzeichnungen zeigt. Sobald ein Lauf beendet ist, wird die heutige Aufzeichnung der Liste hinzugefügt, und die Aufzeichnungen anderer Personen sind untereinander nicht sichtbar.

Dieses Beispiel zeigt eine Sache. Eine mobile App nutzt genau dasselbe Backend, das Sie auch für einen Webdienst verwenden würden. Aufzeichnungen speichern, Mitglieder aufnehmen und jeder Person nur ihre eigenen Aufzeichnungen zeigen: Für das Web ist das nicht anders als für eine App. Deshalb führt auch dieses Beispiel von Anfang bis Ende durch den gesamten Aufbau dieses Backends (die Daten, die die Aufzeichnungen speichern, die Mitgliederanmeldung und die Berechtigung, nur die eigenen Aufzeichnungen zu sehen). Und es weist gesondert auf die beiden Dinge hin, die sich unterscheiden, weil es mobil ist: die Bereitstellung und die Verbindung, die das Anmeldeergebnis zurück in die App bringt.

Was wir bauen

Statt eines Bekleidungsgeschäfts oder eines Blogs ist dieses Beispiel eine persönliche Lauf-Tracker-App. Es gibt drei Bildschirme.

• Anmeldebildschirm: Sie melden sich mit Google an.
• Aufzeichnungsliste: Eine angemeldete Person sieht die Laufaufzeichnungen, die sie bisher erfasst hat, die neuesten zuerst.
• Aufzeichnung hinzufügen: Sie erfassen Distanz, Zeit, Pace, Route und Datum eines Laufs.

Der Kern ist: "Jede Person sieht nur ihre eigenen Aufzeichnungen." Einer angemeldeten Person werden nur die Aufzeichnungen zugestellt, die sie selbst erfasst hat, und die Aufzeichnungen anderer sind nicht sichtbar. Diese Bedingung macht später sowohl die Mitgliederanmeldung als auch die Berechtigungen nötig.

Zuerst die Bildschirme bauen, dann anbinden

Diese App selbst zu bauen, geht in zwei Schritten. Erstellen Sie zuerst die App-Bildschirme und übergeben Sie dann WEEGLOO die Arbeit hinter diesen Bildschirmen.

1. Die Bildschirmdesigns erstellen. Die Bildschirme oben sind entstanden, indem einem LLM ein Prompt wie der folgende gegeben wurde. Sie geben eine Zeile dazu an, welche Art von App Sie erstellen, die Liste der Bildschirme und was jeder Bildschirm enthält, sowie eine Designrichtung.

Entwirf die Bildschirme für eine Lauf-Tracker-App. Es ist eine vertikale mobile App.

Bildschirme:

• Anmeldung: eine Zeile, die die App vorstellt, und eine Schaltfläche "Continue with Google".
• Aufzeichnungsliste (Startseite): eine Zusammenfassung von Gesamtdistanz und Anzahl der Läufe, eine Liste mit Karten der Laufaufzeichnungen (Datum, Distanz, Zeit, Pace, Routen-Vorschaubild) und eine Schaltfläche zum Hinzufügen einer Aufzeichnung.
• Aufzeichnung hinzufügen: Eingaben für Datum, Distanz, Zeit, Pace, Notizen und ein Routenfoto sowie Speichern.

Halte es sauber und aktiv, sodass Werte wie Distanz und Pace auf einen Blick lesbar sind. Folge den Konventionen für mobile UI.

Die drei Bildschirme aus "Was wir bauen" oben sind das Ergebnis dieses Prompts. Zu diesem Zeitpunkt gibt es noch keine Daten und keine Anmeldung: Es sind nur die Bildschirme.

2. An WEEGLOO anbinden. Verbinden Sie den Agenten mit WEEGLOO (Verbinden) und sagen Sie dies.

Bitte binde das an WEEGLOO an.

Ohne ausführlich zu erklären, was Sie erstellen, betrachtet der Agent diese Bildschirme und richtet ein, was dahinter nötig ist. Dieser Ablauf, bei dem Sie alles übergeben, ist derselbe wie in In einem Satz anbinden.

Was WEEGLOO hinter den Bildschirmen einrichtet

Mit der einzigen Anweisung "binde das an" betrachtet der Agent die Bildschirme und richtet diese vier Dinge ein. Das ist das Backend, das WEEGLOO hinter den Bildschirmen übernimmt.

1. Eine Datenstruktur, die Laufaufzeichnungen aufnimmt (Content Type). Sie nimmt Angaben wie Distanz, Zeit, Pace, Route und Datum auf.
2. Google-Anmeldung (ServiceLogin). Sie lässt App-Nutzer sich selbst registrieren und anmelden.
3. Die Berechtigung "nur eigene Aufzeichnungen". Sie lässt eine angemeldete Person nur die Aufzeichnungen lesen, schreiben und löschen, die sie selbst erfasst hat.
4. Zustellung der eigenen Aufzeichnungen. Sie sendet jeder angemeldeten Person nur ihre eigenen Aufzeichnungen als Liste.

Diese vier sind genau das, was Sie brauchen, wenn Sie denselben Dienst für das Web bauen. Wie man jeden Baustein für sich handhabt, wird jeweils einzeln in Registrierung und Anmeldung anbinden, Berechtigungen aufteilen und Daten speichern und abrufen behandelt. Wenn Sie zusätzlich ein Bild einer Routenkarte oder ein Foto festhalten möchten, können Sie auch eine Datei (Media) anhängen.

Was tatsächlich erstellt wurde

Unten sehen Sie die Ressourcen, die im Stride-Space dieses Beispiels tatsächlich erstellt wurden. Dies ist keine Anleitung zum einzelnen Einrichten, sondern ein Blick darauf, was in dieser App als Ergebnis von "binde das an" entstanden ist.

Die Struktur, die Laufaufzeichnungen aufnimmt

Das Erste ist die Struktur, die Laufaufzeichnungen aufnimmt (Content Type), "Run". Die Werte, die in einen einzelnen Lauf einfließen, sind in Felder je Angabe aufgeteilt.

Es gibt kein eigenes Feld, das die durchschnittliche Pace speichert. Sie ist ein Wert, der sich allein aus Distanz und Zeit ergibt, deshalb berechnet und zeigt die App sie direkt an (das "auto-calculated" auf dem Bildschirm zum Hinzufügen einer Aufzeichnung).

Google-Anmeldung

Das Zweite ist der Kanal, über den Mitglieder sich mit Google anmelden (ServiceLogin). In diesem Beispiel ist der Name auf "Stride" gesetzt, und Google ist die einzige aktivierte Anmeldemethode. Eine neu angemeldete Person erhält standardmäßig die unten stehende Berechtigung "Runner". Sobald die Anmeldung abgeschlossen ist, kommt das Ergebnis über die Brückenseite als Zwischenschritt in die App zurück, die in Das Anmeldeergebnis zurück in die App bringen beschrieben ist.

Die Berechtigung "nur eigene Aufzeichnungen"

Das Dritte ist die Berechtigung, die Mitglieder erhalten (ServiceUserRole), "Runner". Die Regeln sind wie folgt.

Weil "Lesen" an "nur die selbst erstellten" gebunden ist, zeigt die Liste jeder Person nur ihre eigenen Aufzeichnungen. Von den vier zuvor genannten Dingen ergeben sich Nummer 3 (Berechtigung) und Nummer 4 (Zustellung) tatsächlich zusammen aus dieser einen Regel. Da die Aufzeichnungen, die jedes Mitglied lesen kann, nur die eigenen sind, ist genau das die Liste, die dieser Person zugestellt wird.

Aufzeichnungen und Fotos

Das Vierte ist jede einzelne Laufaufzeichnung (Content) und das Routenfoto (Media). Diese beiden werden nicht im Voraus erstellt; jede entsteht unter dem Namen eines Mitglieds, wenn es in der App einen Lauf erfasst. Unten sehen Sie eine Aufzeichnung, die tatsächlich erfasst wurde. Die Struktur "Run" oben ist mit Werten gefüllt, und ein Routenfoto ist daneben angehängt.

Die Distanz 42.195 ist ein voller Marathon. Die Zeit wird in Sekunden festgehalten (hier eine Aufzeichnung von 3 Stunden 53 Minuten) und in der App als 3:53:00 angezeigt. Das Routenfoto wird gesondert als Datei (Media) gespeichert, und die Aufzeichnung enthält nur einen Verweis, der auf diese Datei zeigt. Die Liste und die Karten aus "Was wir bauen" sind das, wie solche Aufzeichnungen aussehen, sobald sich mehrere davon angesammelt haben.

Zwei Dinge, die sich vom Web unterscheiden

Bis hierher ist alles wie beim Web. Eine mobile App nutzt dasselbe Backend, so wie es ist. Nur zwei Dinge unterscheiden sich, weil es mobil ist.

Bereitstellung: der App-Markt liegt außerhalb von WEEGLOO

Ein Webdienst kann ein fertiges Produkt mit Web Hosting ins Internet stellen (Eine Website ins Internet stellen), aber eine fertige mobile App in die Hände der Menschen zu bringen (sie in einem App-Markt einzustellen), geschieht außerhalb von WEEGLOO. Was WEEGLOO übernimmt, sind die Daten, Mitglieder und Berechtigungen hinter den App-Bildschirmen.

Das Anmeldeergebnis zurück in die App bringen

Die Anmeldefunktion selbst wird auf dieselbe Weise angebunden wie im Web. Was sich vom Web unterscheidet, ist die Verbindung, die das Ergebnis nach Abschluss der Anmeldung zurück in die App bringt. Das Anmeldeergebnis kann nur an eine Webadresse zurückkehren, deshalb ist ein zusätzlicher Schritt nötig: eine Seite, die als Zwischenbrücke dient und dieses Ergebnis in die App übergibt. Dieser technische Schritt wird in Auth API behandelt.

Prüfen, dass es wirklich nur die eigenen Aufzeichnungen sind

Die Kernbedingung dieser App, "jede Person sieht nur ihre eigenen Aufzeichnungen", hält tatsächlich. Unten sehen Sie die Startseiten derselben App, geöffnet mit zwei verschiedenen Konten. Es ist dieselbe App, aber die Gesamtdistanz, die Anzahl der Läufe und die in der Liste angezeigten Aufzeichnungen unterscheiden sich alle.

Ein Konto zeigt nur einen einzigen 5-km-Lauf, das andere nur zwei Läufe, einen Marathon und einen 3-km-Lauf. Ihre Aufzeichnungen sind füreinander nicht sichtbar. Stride enthält alle drei dieser Aufzeichnungen (siehe Was tatsächlich erstellt wurde), aber jedem Mitglied werden nur die Aufzeichnungen zugestellt, die es selbst erfasst hat. Das ist das Ergebnis davon, dass das Lesen oben in Die Berechtigung "nur eigene Aufzeichnungen" an "nur die selbst erstellten" gebunden wurde.

Was als Nächstes zu tun ist

• Registrierung und Anmeldung anbinden: behandelt, wie man eine Anmeldung, die eigene Mitglieder aufnimmt, gesondert anbindet.
• Auth API: behandelt den technischen Schritt, das Anmeldeergebnis zurück in die App zu bringen.
• Berechtigungen aufteilen: behandelt, wie man Berechtigungen so festlegt, dass Mitglieder nur ihre eigenen Dinge bearbeiten.
• Daten speichern und abrufen: behandelt, wie man eine Datenstruktur erstellt und mit Inhalten füllt.