Unqork’s Internal API: Create APIs

Most of Unqork's internal API (applications programming interface) calls use one of the create, read, update, and delete (CRUD) operations. In this article, you'll explore an example of a create API service in Unqork. Here you'll explore the Create Module Submission(s) API call.

What You'll Learn

In this article, you’ll learn about the Create Module Submission(s) API call, how it's configured, and how to test it.

Create Module Submission(s) API

A common API call you'll use in Unqork is the Create a Module Submission(s) API call. This API is a secure way to automatically create one or more module submissions. One way to configure the API is to have it trigger when an end-user clicks Save. For improved security, our proxy module setup requires you to create a submission using this API call.

This API auto-generates submission IDs, but you must provide a JSON object for the module submission data. To create multiple submissions, the Request Body must contain an array of the defined request body structure.

TIP  To learn more about the Create Module Submission(s) API's request body structure, view our Create Module Submission(s) documentation.

To help explain how the Create Module Submission(s) API works, we've configured a module and Plug-In component that uses this API call. The following sections explore the configuration and lets you test the API.

WARNING  Feel free to use the configuration created here for your own builds. But, please do not reconfigure the modules. If you want to use the configuration, make a copy of the module and paste it in your application.

Review the initNewSubmission Initializer Component

First, let's open the preconfigured module and look at the Initializer component configuration.

1. Open the preconfigured module in the Module Builder by clicking the following link: https://training.unqork.io/#/form/64cbeb70a3759b636156d703/edit.
2. Hover over the initNewSubmission Radio Button component icon Initializer component.

A 5-button toolbar displays above the component on hover-over.

3. Using the toolbar, click the (Settings) button.

You can see the Trigger Type is set to New Submission, firing the Initializer on page load. In the Outputs table, the component outputs values from a schema module and stores them in the moduleId iconHidden component.

A static image displaying the initNewSubmission Intializer component's configuration with the New Submission Trigger Type and outputs to the schema module.

Review the pluginCreateModuleSubmission Plug-In Component

Let's take a closer look at the necessary Plug-In component configuration and settings to make the API work.

1. Hover over the pluginCreateModuleSubmission Plug-In component.

A 5-button toolbar displays above the component on hover-over.

2. Using the toolbar, click the (Settings) button.

Internal Services

From the Internal Services drop-down, you'll see that the Create Module Submission(s) API is selected. Once selected, the Data Source URL auto-populates with /fbu/uapi/modules/{moduleId}/submissions. As you can see, the {moduleId} placeholder text in the URL was modified to {{data.moduleId}}. That way, you can write to the specific data fields stored in the moduleId iconHidden component. These fields are first name, last name, joke question, and joke answer.

TIP  To learn more about the Create Module Submission(s) API, click the Learn More button in the Plug-In component's configuration window.

A static image displaying the Create Module Submisson(s) Internal Service selection in the Plug-In component.

Request Type

The Request Type is also set to POST. The POST type is used to write data.

Inputs

Lastly, the Inputs table references the components that act as data fields in the new submission. The module contains four Text Field components with Property IDs of firstName, lastName, jokeAnswer, and jokeQuestion. To properly map the new submission, we use the {{data.propertyId}} syntax.

A static image displaying the Post Request Type and data field mapping of the Plug-In component.

Test the Create Module Submission(s) API

Now, let's preview the module and test the configuration.

1. Preview the preconfigured module in Express View.
2. In Express View, right-click anywhere on the page.
3. Click Inspect. The Inspect panel opens to the right of the page.
4. Click the Network tab.
5. In the First Name, Last Name, Joke Question, and Joke Answer fields, enter some sample data.
6. Click the Create Submission button. This button triggers the pluginCreateModuleSubmission Plug-In component.
7. If the submission was successfuly created, a 201 response displays in the Network tab.

A static image displaying the successfully created submission in the DevTools Console.

Resources