Develop your first app

Here is a guide for how to create a simple app.

The app will allow the end-user to create an issue report that will be saved to a database.

As a Flow designer you will get to know how to:

Create a new workflow
Create a user step where the user can enter data
Fetch and use data from a database
Insert data to a database
Publish an app

You will need an SQL server database to complete this app, download the database here.

🌊 Create a workflow

Click on File and choose New.

👣 First step

Create the first step by right-clicking on the green start step and choose Add sequence arrow.
Right-click again and select Create user step.
Enter a suitable name for the user step label.
Double-click on the user step to enter the user step editor.

Drag a Header object into the center of the user step editor.
Enter a text in the header, e.g. Welcome.
Drag in a Text input field.
Enter a prompt text, e.g. Enter name.
Enter a target variable, e.g. Name.
Drag in another Text input field and enter a prompt and a target value for the email address.
Click OK to save your changes.

Tips: Use the test bench to verify what you have done.

Start the test bench by clicking on the play button in the right corner or use the keyboard shortcut Ctrl+Enter.

📡 Get data

Right-click and choose Create machine step.
Right-click on the machine step and select Add data arrow, connect the data arrow with the User step.
Double-click on the machine step to open the machine step editor.
Select connector in the drop-down list.
Select database call type and enter the query.
Enter a variable name, e.g. DS_issueTypes.
Click OK to save your changes.

Tip: Use the magic wand to beautify the SQL script in the machine step.🧙‍♂️

Code to use:

SELECT [TYPE] "TYPE"
FROM   [dbo].[IssueType]

Open the User step and configure a list to show the issue types.

Drag in a Menu selection input.
Enter a target variable for the output, e.g. issueType.
Select table variable DS_issueTypes as the data source.
Enter a prompt, e.g. Select issue type.
Enter row text, type a { to get a list of available variables, choose the TYPE variable.
Choose TYPE as Field to select, and select Show empty option.
Drag in a Text input field.
Enter a prompt text, e.g. Enter issue description.
Enter a target variable, e.g. issueDesc.
Select multiline.
Click OK to save your changes.

Tips: Use the test bench to verify what you have done.

Start the test bench by clicking on the play button in the right corner or use the keyboard shortcut Ctrl+Enter.

🌱 Use variables

Add another machine step, you can drag and drop a machine step from the Workflow elements area or right-click in the workflow area and select Create machine step.
Use a sequence arrow and connect the first user step with the machine step you just added.
Double-click on the machine step to enter the machine step editor.
Select connector in the drop-down list. The database call type should be set to script.
Enter your SQL script, enter a { to get a list of available variables, choose the name variable, do the same for the other variables.
Click OK to save your changes.

Tip: Write @out_ to create an output variable for scripts. You can add several @out_ to add more values to the output record.

Code to use:

INSERT INTO [WorkOrder]
           ([NAME]
           ,[EMAIL]
           ,[ISSUE_TYPE]
           ,[ISSUE_DESC]
           ,[REPORT_DATE]
           ,[STATUS])
     VALUES
           (@name
	   ,@email
           ,@issueType
           ,@issueDesc
           ,GETDATE()
           ,'New')


SET @out_issueNumber = SCOPE_IDENTITY()

Add another user step, add one Header and one Static text field with information about the issue number. Enter a { to get a list of available variables, choose the issueNumber variable.

Tip: Click on the wrench icon🔧(Route 1) to change the button name to a more suitable name so the user understands what will happen when clicking on the button.

🤝 Commit and publish

An app must be published to be available in the Flow clients.

Commit the app by clicking on the check mark in the top left corner of the workflow area.
Leave a comment that describes the change that was made, and click on Commit.
Finally, publish the workflow by clicking on the (space ship) Publish button.

For each commit a version will be created, all versions will be listed in the Version history panel. Open an old version by double-clicking on a version in the Version history panel.

Create a menu, right-click in the server content area and choose New -> Menu.
Enter a Title for the menu.
Click on the + and choose Workflow item, select your workflow.
Click on Edit roles in the bottom corner of the menu and check the roles that should have permission to the menu. Learn how to set up a role here.

The app is now ready to run in any Flow client.

🎠 Run the app

You can run all apps in the Flow clients on iOS, Android, Windows 10, and Web. You can download the Flow client app from Google store, App Store and Microsoft store.

Open the Flow client app, connect to your Flow server and enter your username and password.
When you are logged in, you will see the app under the menu tab, click on the app to start.
Fill in the fields and click OK, cancel the execution by clicking the Quit button.