Datasource

Datasource binding and mapping in a no-code platform refers to the process of connecting a datasource to the platform, and then mapping the data within that datasource to specific elements or components within the platform.

In a no-code platform, datasource binding and mapping is a key feature that allows users to build applications without writing any code. The process typically works as follows:

1. Connecting a datasource: The user first connects a datasource to the no-code platform by specifying its location. This allows the platform to access the data within the datasource.

2. Mapping the data: Next, the user maps the data within the bound datasource to specific elements or components within the platform. This typically involves defining relationships between the data in the datasource and the elements or components within the platform. For example, a user might link a particular column in a spreadsheet to a specific field in a form.

3. Using data to build application: Once the data is mapped, the user can then use the data to build the application. This might involve creating forms, generating reports, or triggering automated actions based on the data. For example, a user might create a form that automatically populates with data from a spreadsheet, or create a report that shows data from a database in a specific format.

4. Updating the application: As the data in the datasource changes, the application automatically updates. For example, if a new row is added to the spreadsheet, it will automatically be reflected in the form.

By using datasource binding and mapping in a no-code platform, users can build applications quickly and easily, without needing to write any code. This makes it a powerful tool for automating tasks and creating custom business logic.

Webstudio provides several options for connecting and mapping datasources to elements, components, and other items within the platform. These include:

1. Static data binding
2. Binding from Data models
3. Binding from Object
4. External API data binding

Static data binding :

Static data binding: This method allows users to connect and map a datasource that contains static data, such as a spreadsheet or CSV file, to elements and components within the platform. This is useful for populating forms and generating reports with fixed data.

1. Data can be view/edit in JSON and Tabular format
2. Show Images with Tabular format
3. Show Images with JSON format
4. We have options to add a row of data and edit the data set in tabular format
5. It supports heirarchical data
6. To view the data in a proper manner, user can expand it using the -- icon on the top right corner(Show image here)
7. JSON data can be an array or object or a combination of both based on the elements requirment
8. For a better view it shows the data in proper color format(Show image)

Binding from Data models :

Binding from Data models: This method allows users to connect and map a datasource that contains dynamic data, such as a database, to elements and components within the platform. By using data models, users can build applications that automatically update as the data in the datasource changes.

1. User can create Data models using DMV project
2. All the Data models which were created inside DMV are available inside Webstudio to bind
3. Normally tables have column names which we have to bind with element properties
4. Data can be viewed by clicking on -- icon next to data model names
5. For configuring the data click on -- icon
6. provide link to Configure Data model inside workflow / Configuration panel (show Image)

Binding from Object :

Binding from Object: This method allows users to connect and map a datasource to elements and components within the platform using an object-oriented approach. This allows for more flexibility in how the data is used and displayed.

External API data binding :

External API data binding: This method allows users to connect to external APIs and map the data returned by the API to elements and components within the platform. This is useful for integrating external data and services into an application.

1. The External Data API binding and mapping allows you to creat sourceful interface to some or all of your application's data.
2. You can let yourself or your users read, modify, and delete individual data items, search for data using a flexible query params, and create and bulk uploads.
3. User can set API from Datasource right tool section, by clicking on Add Datasource will pop-ups the external API mapping window.
4. By applying required inputs or details to fetch the external API data on webstudio to for mapping with Element, section or artboard with respect to events.
5. Api setting and mapping to any option can be modify at any phase of work. Though due to realtime reflection on Artboard after just mapping to specific component it will start reflect on artboard without reaching to the preview.

By providing these different methods of datasource binding and mapping, Webstudio makes it easy for users to connect and work with data, regardless of its format or location, to build sophisticated and dynamic web applications.