# Syncloop - GraphQL Use Case

This documentation provides a guide on how to use Syncloop's GraphQL interface to interact with the Syncloop platform. 

To create an API, follow these steps:

1. Right-click on the "**Packages**" directory ↦ **New** ↦ **Packages**.
    
2. Create a new folder under Packages and name it **GraphQL**.
    
3. Within the **GraphQL** folder, select **Services** ↦ **API**.
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685126989620/b8e93b61-de2c-499f-8aff-9b11b28c5677.gif align="center")

##   
**Creating a MAP**

To create a MAP, follow these steps:

* Navigate to the Workspace ↦ Right-click within the Workspace.
    

From the context menu that appears, select the option labeled **Map**.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685127614972/c83017ee-1aa8-4f40-9ffc-41e597e07420.gif align="center")

### **Output Schema**

To define the output schema, we need to create two string values: URL and method.

**URL:** The URL should be set to the external API URL from which we intend to retrieve data. As an example for this tutorial, we will use "[**https://restcountries.com/v3.1/name/india**](https://restcountries.com/v3.1/name/india)" as the URL.

**Method:** The method value should be set to "GET" to specify the type of request we will be making to the API.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685127984596/cc76b211-8de3-492a-86a2-a1fde71143d2.gif align="center")

## **Creating an HTTP Request Service**

To create a new HTTP Request Service, follow these steps:

1. Right-click in the workspace and select **Service** from the context menu.
    
2. Navigate to the Packages section and search "**request**" and select it.
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685128331429/581d0a15-b811-485c-b290-e546b8906a02.gif align="center")

### Mapping the Request Service

1. Map the URL to the `url` field and the method to the `method` field.
    
2. In the output schema, create a `respPayload` (response) field. Please ensure that you map the desired response payload to this existing `respPayload` field.
    

By following these guidelines, you can accurately define the URL and method in the API request, as well as map the desired response payload to the existing `respPayload` the field in the output schema.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685128891465/d6b9abe6-dcc0-45dd-83f2-324d2b9ff279.gif align="center")

## **Creating a fromJson Service**

To create a new **fromJson** Service, follow these steps:

* Right-click in the workspace and select **Service** from the context menu.
    
* Navigate to the Packages section and search "**fromJson**" and select it.
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685129302891/41a3d926-c3df-4700-b7d2-33d48cef6380.gif align="center")

###   
Mapping the fromJson Service

* Map the **respPayload** (Response Payload )to the `jsonString` field.
    
* Under the `output` section, create a new document called `jsonDoc`. Additionally, create another document under the `OUTPUT SCHEMA` section called `countries`.
    
* Map the content of `jsonDoc` to the `countries` document.
    
    **Document Types**
    
    Both `jsonDoc` and `countries` should be of type `Array`.
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685130663280/b53e26e7-8aa2-48d9-a654-b833c257430f.gif align="center")

## Creating a JSON Form

To create a JSON Form, follow these steps:

1. Navigate to the Output Parameters section on the left side of the Workspace.
    
2. Right-click in the Output Parameters section and select **FORM** from the context menu, then choose **JSON**.
    
3. Copy the desired payload into the form. For example, you can use the payload from the following API endpoint: [**https://restcountries.com/v3.1/name/india**](https://restcountries.com/v3.1/name/india)
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685131082517/f8fc104f-2b8e-452c-abed-f06d9fcbe22f.gif align="center")

## **Setting up the GraphQL**

**Enabling the GraphQL**

To enable GraphQL, navigate to the configuration settings and check the "Enable GraphQL" option.

**Service Endpoint and Bearer Token**

* Select Configuration  ↦ Service Endpoint.
    
* Copy the Service Endpoint.
    
* Click on API Token in the left navigation bar. ↦ Bearer Token
    
* Copy the Bearer Token
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685131485335/a468f42a-41d5-456a-9637-6ffdef4b55be.gif align="center")

Congratulations on successfully setting up the external API implementation of GraphQL in the Syncloop Platform!

Now, let's move on to using Postman to test our workflow.

## **Testing Workflow**

To Test the Workflow:

1. Paste the **Service Endpoint URL** and ensure that the HTTP method is set to **POST**.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685131993830/7e66e9fe-bea7-4c0f-a651-388796d5e3db.png align="center")
    
2. Navigate to the **AUTHORIZATION** section and locate the **BEARER TOKEN** field and paste the **TOKEN**.
    
3. Finally, click on the **SEND** button to initiate the request and observe the workflow execution.
    

You will be presented with the following output:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685132136608/a25ea890-0a2f-4968-a120-9d5ab87bea51.png align="center")

To test the GraphQL functionality, please follow the steps below:

1. Navigate to the "BODY" section of the API request.
    
2. Locate the "GRAPHQL" field and click on it.
    
3. Paste the GraphQL query into the designated area. (In this query, we will be searching for the **capital**)
    

```graphql
{
    countries {
        capital
    }
}
```

Now, click on the **SEND** button to initiate the request.

You will be presented with the following output:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1685132347545/c18dd4cd-8df0-40b4-95c7-762d7bd8594f.png align="center")

Congratulations! You have successfully tested GraphQL by implementing an external API.

We hope you find this documentation helpful and user-friendly.
