MENU
    How to Inspect App Logic (Beta)
    • 19 Feb 2025
    • 3 읽을 분
    • 기여자

    How to Inspect App Logic (Beta)


    The content is currently unavailable in Korean. You are viewing the default English version.
    기사 요약

    This is an experimental beta feature.

    Overview

    Tulip apps can be complicated to explain to a teammate, making it difficult to understand the entire logic of an app.

    This feature allows you to view an app's functionality in free products outside of Tulip. You and your teammates can inspect app logic to explain or learn about what is happening within an app.

    All recommended external tools preserve the privacy of your data – they do not save anything.

    Export App Logic

    From the App summary view, click the three-dot-menu and select Inspect App.

    image.png

    You can choose to either view a diagram of an app or see all the Trigger logic in one place.

    image.png

    App Diagrams

    To view a diagram of high level app functionality, choose App Diagram. This will show you the relationship between:

    • Steps
    • Transitions
    • Table Record Updates
    • Connector Function Calls

    You can use this diagram to:

    • Explain to a teammate what is happening within an app
    • View the order of data updates and operator actions
    • Create documentation for each version of an app

    View an App Diagram

    1. Click Export to download a text file of the app diagram. This text file is in Mermaid syntax.

    2. Copy the content in the file.

    3. Go to mermaid.live, and paste the copied text directly into the text box on the left side of the screen.

    The text will look like this:
    image.png

    App diagrams vary depending on how complex your app is.
    Example:
    image.png

    The syntax should closely resemble process flow diagramming language:

    • Purple circle: Either the "App Start" or an app completion, with the destination app and step filled in
    • Green box: A step in the app, with the step name within the box
    • Solid line: A transition between steps, with the name of the trigger that causes the transition included on the line.
    • Blue database symbols: Either all of the table record updates to a specific placeholder on a specific step, or a connector function call that happens on that step. It just lists the fields that are used for both, the values that map to those fields are not listed.

    You may also noticed that certain steps are broken out from the diagram. These are steps that have many transitions going into them, and therefore would contort the diagram and cause many lines to be drawn. So, we chose to break them out separately, and usually the name of the step is a good indication that it is a "utility step" that is referenced in many places.


    Trigger Tree

    A trigger tree is a tree-like view of an app in JSON that shows the following nested concepts in an app:

    • Step
      • Trigger
        • Conditions
          • Trigger actions

    This requires technical ability to read JSON, but you will be able to:

    • More easily debug apps by seeing all triggers in an app in one place
    • Build a custom internal app for viewing app behavior
    • Use AI to better understand the functionality of an app

    View a Trigger Tree

    1. Choose Trigger Tree, then select all the trigger actions you would like to visualize.

    2. Click Export, and then you will see a JSON file.

    3. Copy the content in the file.

    4. Paste the content into a JSON viewer, like JSONSea.

    Trigger trees vary depending on how complex your logic is.
    Example:
    image.png


    이 문서가 도움이 되었습니까?