Dynamic Data
Dynamic data is at the core of the Infinable platform which allows to create rich web applications instead of static websites
Leveraging dynamic data is at the core of a rich web application and it is handled through variables.
Variables allow you to capture and store information to be used in your application. They will be used in the configuration of interface elements of your pages and in the configuration of nodes in workflows.
There are different types of variables in Infinable - page and global variables. We'll get into those later in this section.
A variable can contain information of different types:
- Text
- Number
- Boolean (true/false)
- Date/Time
- Geographic Address
- File
- Image
- List
- Data Record
- Data Records Collection
Global Variables
Global variables are active throughout your entire application. This means that they can be accessed within any interface elements and workflows on any page. These variables are best used for data that is found throughout the application. An example would be logged user information: you might need the information about the user who logged in
Page Variables
Page variables are found & active only within the page you are currently in. If you are in a page and you move to another page, then the page variables will be different. Page variables are useful to handle dynamic data that will only be used on one page. An example would be the page of a place for an AirBnB clone: on this page, you will need a variable with place information but you don't need this information on other pages so you will use a page variable.
Access the list of variables
In this example, you can see all of the global and page variables currently available in this application and on this page (Home Page):
- Logged In User: this variable is of type "Data Record" and contains information about the logged in user. This is a global variable which is updated when the user logs in or signs up to the application
- Is Logged In: this variable is just a yes/no information (Boolean type) telling if the user is logged in or not. It can be used for example to determine if the Login/Signup links should be visible or if a profile picture with account links in a dropdown should be visible instead
- Cities: this variable is of type "Data Records Collection" and contains the list of recommended cities. This variable is user to display a list of images of cities under the "Explore the World" title and allows a quick link to a detailed search of places for each city by clicking on the image of the city.
You can create a new Global/Page variable by clicking on the "Plus" icon.
You need to provide a unique name for the variable and a type based on what you want to store inside.
...
You can also edit the properties of a given variable by clicking on the "Pencil" icon.
When you create a variable, you have the possibility to provide a default value for the variable (otherwise, its value will be null by default).
To update the value of a variable, you need to use workflows. As we will see in the next section, a workflow is composed of a trigger and a series of action (nodes) connected together. One of the possible action in a workflow can be to update the value of a given variable.
Updating value of variable "Cities" with the output of the node "Get City Collection"
In the example above, we are on the Home Page of the AirBnB clone. On this page, we want to display the list of recommended cities (we want to display a list of images):
List of recommended cities displayed in the Home Page of AirBnB clone
This list of cities is a dynamic information as it is retrieved from the data model of the application. We create a variable named "Cities" that will store the list of recommended cities. This variable is then used by the interface elements (view Repeating Elements section to understand how to repeat interface elements based on dynamic data) to obtain the list of images of the cities. To initialize the value of this variable, we use a workflow (view workflow above) were the trigger is "On Page Load" (meaning when you arrive on the page, trigger the next actions). We use a data action (Data Action Nodes) to retrieve the collection of cities from the data model and we store the output value of this data action (the list of data records) in our "Cities" variable using a node of type "Update Variable". To select which value we want to store in the "Cities" variable, we use the variable browser popup (view example above) and we select the output value "Data Records" of the parent node "Get City Collection". To learn more about the variable browser popup and the data mapping capabilities, view Data Mapping Tool.
Name your variables something descriptive of what information you are storing - such as 'Email Input' if you are storing the value of an input element where the user enters its email, or 'Places' if you are storing a list of places to display in a page retrieved from the data model (e.g. AirBnB clone). Do not duplicate variable names, names should be unique.
You can delete variables in the variable menu by clicking on the "Trash" icon. If you delete a variable and the variable is used throughout your application, you will need to change the places the variable is used (workflow nodes updating the variable + interface elements and other workflow nodes using the variable value).
Last modified 3yr ago