Inspektion der Anwendungslogik (experimentell)

Prev Next

:::(Warning)This is an experimental feature. It requires more user feedback before determining whether it will exist in the product long-term.
:::

Übersicht

Tulip-Apps können kompliziert sein, wenn man sie einem Teamkollegen erklären muss, was es schwierig macht, die gesamte Logik einer App zu verstehen.

Diese Funktion ermöglicht es Ihnen, die Funktionalität einer Anwendung in kostenlosen Produkten außerhalb von Tulip zu betrachten. Sie und Ihre Teammitglieder können die Logik einer Anwendung untersuchen, um zu erklären oder zu erfahren, was in einer Anwendung passiert.

Alle empfohlenen externen Tools bewahren die Privatsphäre Ihrer Daten - sie speichern nichts.

App-Logik exportieren

Klicken Sie in der App-Übersicht auf das Drei-Punkte-Menü und wählen Sie App inspizieren.

image.png

Sie können wählen, ob Sie ein Diagramm einer App oder die gesamte Triggerlogik an einem Ort sehen möchten.

image.png

App-Diagramme

Wählen Sie App-Diagramm, um ein Diagramm der App-Funktionalität auf hoher Ebene anzuzeigen. Dies zeigt Ihnen die Beziehung zwischen:* Schritten* Übergängen* Aktualisierungen von Tabellendatensätzen* Aufrufen von Verbindungsfunktionen

Sie können dieses Diagramm verwenden, um:* einem Teammitglied zu erklären, was in einer Anwendung geschieht* die Reihenfolge von Datenaktualisierungen und Bedieneraktionen anzuzeigen* eine Dokumentation für jede Version einer Anwendung zu erstellen

Ein App-Diagramm anzeigen

  1. Klicken Sie auf Exportieren, um eine Textdatei mit dem App-Diagramm herunterzuladen. Diese Textdatei liegt in der Mermaid-Syntax vor.
  2. Kopieren Sie den Inhalt der Datei.
  3. Gehen Sie zu mermaid.live{target=_blank}, und fügen Sie den kopierten Text direkt in das Textfeld auf der linken Seite des Bildschirms ein.

Der Text sieht dann so aus:image.png

App-Diagramme variieren je nachdem, wie komplex Ihre App ist**. Beispiel:**image.png

Die Syntax sollte der Sprache für Prozessflussdiagramme sehr ähnlich sein:* Lila Kreis: Entweder der "App-Start" oder ein App-Abschluss, wobei die Ziel-App und der Schritt ausgefüllt werden* Grüner Kasten: Ein Schritt in der App, mit dem Schrittnamen innerhalb des Kastens* Durchgehende Linie: Ein Übergang zwischen Schritten, wobei der Name des Auslösers, der den Übergang verursacht, in der Linie enthalten ist* Blaue Datenbanksymbole: Entweder alle Aktualisierungen von Tabellendatensätzen für einen bestimmten Platzhalter in einem bestimmten Schritt oder ein Aufruf einer Konnektorfunktion, der in diesem Schritt erfolgt. Es werden nur die Felder aufgeführt, die für beides verwendet werden, die Werte, die diesen Feldern zugeordnet sind, werden nicht aufgeführt.

Sie haben vielleicht auch bemerkt, dass bestimmte Schritte aus dem Diagramm herausgebrochen sind. Es handelt sich dabei um Schritte, die viele Übergänge beinhalten und daher das Diagramm verzerren und viele Linien verursachen würden. Wir haben uns daher entschlossen, sie separat aufzuführen, und normalerweise ist der Name des Schritts ein guter Hinweis darauf, dass es sich um einen "Hilfsschritt" handelt, auf den an vielen Stellen verwiesen wird.


Auslöser-Baum

Ein Triggerbaum ist eine baumartige Ansicht einer Anwendung in JSON, die die folgenden verschachtelten Konzepte in einer Anwendung zeigt:* Schritt * Trigger * Bedingungen * Triggeraktionen

Dies erfordert technische Fähigkeiten zum Lesen von JSON, aber Sie werden in der Lage sein:* Apps einfacher zu debuggen, indem Sie alle Trigger in einer App an einem Ort sehen* eine benutzerdefinierte interne App zu erstellen, um das App-Verhalten zu sehen* KI zu verwenden, um die Funktionalität einer App besser zu verstehen

Einen Triggerbaum anzeigen

  1. Wählen Sie Triggerbaum und wählen Sie dann alle Triggeraktionen aus, die Sie visualisieren möchten.
  2. Klicken Sie auf Exportieren, dann wird eine JSON-Datei angezeigt.
  3. Kopieren Sie den Inhalt der Datei.
  4. Fügen Sie den Inhalt in einen JSON-Viewer ein, wie JSONSea{target=_blank}.

Die Auslöserbäume hängen davon ab, wie komplex Ihre Logik ist. Beispiel:image.png