Application Workflows
In this section, you will define all the workflows of your application. Workflows allow you to express the logic of your application. A workflow can perform actions such as creating and updating objects, going to pages and making choices. It is a visual way of expressing what traditionally ends up in textual program code.
Example of workflow:
- 1.The user clicks on "Create Account" button
- 2.Create the user in the database
- 3.Send a welcome email to the user and a mail to confirm his email
- 4.Redirect to the home page of the app
Workflows are made of connected nodes that perform unique functions and can pass and receive information to and from other blocks. In the example below, three different blocks pass values to each other with connectors that are connected to their ports. In this workflow, the first node is a trigger which is executed when the "Home Page" is loaded, the second node is retrieving the list of cities from the data model of the app and the third node is storing the list of cities in a variable that can then be used in the interface to populate the list of suggested cities on the Home Page.
A simple workflow handling data retrieval from database
By default,
- Account: login the user, signup a new user, update credentials...
- Navigation: navigate to a different page, go back to previous page
- UI Elements: change the state of a UI element (e.g. change status of a button to loading)
- Data: create a new record in the data model, update/delete a record, download data as CSV...
- Email: send an email
If you double click on a node, you can edit its properties. In the example above, we can edit the properties of the "Get City Collection" node:
Editing properties if the "Get City Collection" node
We can update the configuration like which information from cities data source should be retrieved (in this case we retrieve city ID, locality and cover image fields), limit the number of data records returned, add pagination...
Ports allow blocks to receive information in and pass information back out. The ports on the left side of a node are inputs, and the ones on the right are outputs. Most of the time, a node has one input port and one output port but some nodes can have multiple output ports like the "IF" node that enables to split a workflow based on a condition check:
IF node in workflow with two output ports
Connectors pass information (values) from patch to patch via their ports. Think of values like water, and connectors as the pipes that move it from place to place. The values flow in one direction: left-to-right from an output to an input.
To create a connector, drag from an output port (on the right of a block) to an input port (on the left of a block). To disconnect a connector, drag the right end out of the Input port.
- Nodes let you quickly add logic to your app with triggers and actions
- A node can have inputs and outputs that let it communicate with other blocks using connectors.
- By default, a list of nodes is proposed in the workflow editor but this list can be extended with other nodes from plugins.
Last modified 3yr ago