# Connections Builder

The Connections Builder is designed to be your gateway to the outside world, as well as the place where you can design complex data interactions. It's the Builder that makes it easy to use and modify data, both internal and external.

Like most Builders, the layout of the Connections Builder maps comfortably onto the general structure of the Studio: to the immediate right of the Builder Bar is the Tree, to the right of which is the Stage, to the right of which might be the Inspector:

![](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-393d6b65944fd45fcc25bc791bc7e803751d6bd5%2Fconnections-builder-v182-0.png?alt=media)

## Structure

### Tree

The Tree is where you'll find an expandable and collapsible breakdown of the connections you have built out as part of your app. Airkit automatically splits these connections up into three types: **Data Flows**, **Journey**, and **User Defined Functions**. If you want to create a new connection, click the '+' sign to the right of the type of connection you want to add.

![](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-1fee1e112b888bc86e4022ca6da9d78a8cd813bf%2Fconnections-builder-v182-1.png?alt=media)

If you want to delete a connection after it's been created, click on the trash icon that appears to the immediate right of the undesired connection when you run your curser over it.

### Stage

The Stage displays a visual representation of the connection you are accessing. Exactly what is displayed in the Stage varies depending on the type of connection you are building or editing. In the case of editing an Event under **Journey**, it will be left blank.

### Inspector

The Inspector is where you can examine and modify details associated with with the element being examined.

## Connection Types

### Data Flows

[Data Flows](../data-flows) are custom connections. Conceptually, Data Flows work like functions: they take in input, process it, and return the resulting output. Once a Data Flow has been built, it can be initiated as an [Action](../action-builder) within your application.

Data Flows are made up of component parts called [Data Operations](../../data-operations/data-operation-overview), which define how input is processed. Processing input might entail anything from [making HTTP requests](../../data-operations/http-request-data-operation) to [sending emails](../../data-operations/the-send-email-data-operation) to [running another Data Flow](../../data-operations/the-run-data-flow-data-operation). A single Data Flow might consist of any number of interconnected Data Operations, though these Data Operations do not appear nested underneath them in the Tree; building Data Flows out of Data Operations is done in the Stage.

#### Stage

When working with Data Flows, the Stage is where you'll see and build out the individual connections within. Upon creating a new, custom Data Flow, the Stage appears as follows. The top box, **Start**, keeps track of the input the Data Flow requires and the bottom box, **End**, is where you'll declare which of the internal variables the Data Flow will return. Note that, as this newly-created Data Flow is blank, no input is defined, and there are no return values to choose from. Also note that there is no way to add input values within the Stage; keeping track of the variables a Data Flow has access to – including the direct input – is the domain of the Inspector:

![organizing info](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-25b8ecc9d6a1185ef52f444f9e35dbcecd248c44%2Fconnections-builder-v182-2.png?alt=media)

The individual Data Operations that the Data Flow consists of go between the _Start_ box and the _End_ box. You can add a new Data Operation between connections by clicking on the '+' icon between them directly in the middle of the stage. Individual Data Operations can be deleted by clicking on the trash icon to their immediate right:

![organizing info](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-4d9ebbbf25b718115cc377afe707c93eb2de4ad5%2Fconnections-builder-v182-3.gif?alt=media)

Once a Data Operation has been added, its details can be edited directly within the Stage. There are many different types of Data Operations, and how each one appears and can be edited will differ according to functionality. For a closer look into the different types of Data Operations, check out the [reference documentation](../../data-operations/data-operation-overview).

In the process of creating and editing Data Operations within a Data Flow, it is a good idea to test how they run to ensure they work as intended. This can be done by clicking on the 'Run' button within a Data Operation. Often, however, a Data Operation requires access to other variables – most commonly, direct input – in order to run. To streamline the process of testing, dummy input can be defined directly in the Stage. Once the required input has been defined in the Inspector, example input of the correct [data type](../../variable-data-types/data-types-overview) is automatically generated. This dummy input can be both examined and edited in the **Start** box, and when individual Data Operations are run, they will use the dummy values in place of the input variables:

![organizing info](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-45fab26d3eb5beaa433302bec4b5441cc5fe9e89%2Fconnections-builder-v182-4.gif?alt=media)

When Data Operations are built out, relevant variables will be auto-generated to account for their output, which can be used as input in downstream Data Operations. The more complex a Data Flow, the more of these variables will be generated, making it important to designate precisely which one is the desired output of the Data Flow as a whole. Once a Data Flow has been fully built out, you can specify which internal variable it will return by selecting the desired output from a dropdown menu in the **End** box.

![organizing info](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-86a71fa65faa37d6e7928b8391f05aea4c190023%2Fconnections-builder-v182-5.gif?alt=media)

For more on how internal variables are generated and how dummy values are stored for the sake of testing, see the Inspector section.

#### Inspector

When examining Data Flows, the Inspector displays the relevant internal variables. These are separated into two expandable and collapsible sections: **Start**, and **Variables**.&#x20;

**Start**

The **Start** section in the Inspector is where you can define input that the Data Flow requires. This is done by clicking on the '+' icon to the right of 'Inputs' and selecting the desired [data type](../../variable-data-types/data-types-overview) of the additional input. Upon creation, you will be directed to name the input variable, after which a dummy value of the correct data type will be attributed to the variable for testing purposes. This dummy value will not be accessible outside of the Connections Builder; it will certainly not influence the behavior of the Data Flow when used as part of your app. It will only be used when a value for that variable is required in order to test Data Operations within the Web Flow within the Stage.

The following example shows how to add a number input, named `input_number`, to a Data Flow. Note that `input_number` is automatically set to the value '1' for testing purposes. This is not because the number one has any particular significance in the context of this Data Flow; it is only because 1 is an arbitrary [Number](../../variable-data-types/the-number-variable-data-type), and thus makes a passible dummy variable.

![organizing info](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-962a8c0c52066c4c1fe63ac3c00f5f099382d708%2Fconnections-builder-v182-6.gif?alt=media)

Upon their creation, dummy variables can be changed in the Stage, in the **Start** box.

**Variables**

The **Variables** section keeps track of all internal variables that are not required as input. (Remember: Data Flows might consist of any number of Data Operations, and Data Operations often produce their own output, which can be used as input for Data Operations downstream.) All variables automatically generated by Data Operations are found under **Variables**.

The following example shows what appears in the Inspector after a [Transform Data Operation](../../data-operations/the-transform-data-operation) has been added has been added but before it has been run. Note that the automatically-generated variable, called `transform`, is present but undefined:

![organizing info](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-7b334b1527f5e1533bee8aa9122f4c096264d703%2Fconnections-builder-v182-7.png?alt=media)

Once the Transform Data Operation has been defined – in this example, so that it outputs the sine of `input_number` – and run, the value of `transform` will change to reflect that:

![organizing info](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-9e2312fc147ca3bdba418e2d7f29f89100a10d3f%2Fconnections-builder-v182-8.png?alt=media)

When downstream Data Operations call upon the \`\`\`transform\`\` variable, they will, when run for testing purposes, use the value 0.8414709848078965 – at least until that value changes as a result of the Transform Data Operation being modified and run again to yield a different result.

### Journey

This branch of the Tree contains Events that pertain to the overall flow of a Journey, including [Starting Events](../events/starting-events) and [Session Events](../events/session-events). For more on what Events are and their significance within Airkit, see [Events](../events).

Out-of-the-box, there are four Events come nested under **Global**:

* **Session Started** - triggered when the Journey first begins
  * Note that this Event is the only one that comes with an associated Action Chain pre-built. This automates the process of initializing the Actor when Journeys begin with an incoming call or text. For more on Actor initialization, see [Conversations with Actors](../../concepts/actors/initializing-the-actor).
* **Session Ended** - triggered when the Journey ends
* **Web Page Viewed** - triggered when any Web Page is viewed
* **On Authentication Success** - triggered when an app is successfully authenticated

Also nested under **Journey** is the **Session Events** branch. Custom Session Events nest under this branch upon creation. To make a new Session Event, click on the '+' icon to the right of **Session Events** in the Tree.

When expecting any Events under **Journey**, the Stage will remain blank. There will, however, be a populated Inspector, in which the Actions Builder can be used to assign the Event an Action Chain.

#### Inspector

When examining an Event under **Journey**, the Inspector is where you can construct the Action Chain that will be triggered by the Event. This is done under the \*_Actions_ Tab. When examining Session Events, the Inspector is also where you can define variables that can be given to the Event as input. This is done under the **General** Tab when applicable.

Note that when examining the Event **Session Started** – the Starting Event – out of the box, it comes pre-populated with an Action Chain, which automates the process of initializing the Actor when Journeys begin with an incoming call or texts:

![](https://3088276961-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FC6qMwMGWBgxnN70QsDuH%2Fuploads%2Fgit-blob-620352bee04b835167241d0321db51af397e6a66%2Fconnections-builder-v182-9.png?alt=media)

For more on Actor initialization, see [Conversations with Actors](../../concepts/actors/initializing-the-actor).

### User Defined Functions

[User Defined Functions](https://github.com/airkit/airkit-docs/blob/master/docs/v18-2/user-defined-functions.md) are custom functions made out of and parsable by [Airscript](../../working-with-data/airscript-quick-start). They can be used as part of an application in the same way as out-of-the-box Airscript functions can. For more details on how to build your own User Defined Function, see [Creating Custom Functions](../../building-apps/advanced/creating-custom-functions).

#### Stage

When working with User Defined Functions, the Stage displays the **Function Body**, which dictates the behavior of the User Defined Function in terms of Airscript and the designated input.&#x20;

#### Inspector

When inspecting a User Defined Function, you'll find the means to edit the details of the function name as well as the input it expects and the output it will return.
