Free GPT 4 Webhook in 3 Easy Steps with Retool.com ! ✨
Tags: automation, javascript, gpt4, tutorial
Published: 2023-11-23 07:00:00

[![Substack Newsletter](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qbg4qlzlytxbzbvj97ia.png)](https://benoitpetit.substack.com/subscribe)

Hey there 👋 we're back for the setup of a webhook accessible via API with GPT-4 for free, up to 500 requests per month. Cool, right? 😃

## 1. Prerequisites:

- An account on retool.com, it's free: https://login.retool.com/auth/login
- Knowledge of: HTTP, API, JavaScript
- An IDE

## 2. Setting up the webhook
To set up the webhook, head over to your [retool.com](retool.com) account under the workflow category, right here: [https://retool.com/products/workflows](https://retool.com/products/workflows)

### a. Create the webhook on retool.com workflow
Create a new workflow and click on From JSON.

![retool workflow add JSON file](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/809rmt3vufxykzueswa6.png)

Download and import JSON file workflow : 
👉️ [workflow-gpt4-api.json](https://gist.github.com/benoitpetit/461c62cb19e6c9d3113141be11e5a716)

Download file
```bash
wget https://gist.githubusercontent.com/benoitpetit/461c62cb19e6c9d3113141be11e5a716/raw/059ea236c61e57baaf04804154ae3bb13d763d1d/retool_workflow_gpt-4_api.json
```

> it contains the setup parameters for the retool workflow.

![workflow retool](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9pxwhjll7h5dxy1rd1lq.png)


You should end up with this 😉 feel free to explore, retool workflow is genuinely interesting for setting up automations easily!

A closer look shows the parameters applied to the retool ai module and the usable data models
![retool ai details](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dozj71rvhv3stk5itl1w.png)

### b. Configure the retool webhook and retrieve the URL
Once the workflow is set up, retrieve and activate the webhook URL here:

> Be careful not to share this URL, as it also contains the token to ensure the security access to your retool.com workflow.

![Webhook URL retool](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tei54yxl6cue31mranzq.png)

### c. Deploy the retool workflow
Once this is done, we can deploy our workflow by clicking on the deploy button and deploy button:

![workflow retool deploy](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1wax6mlve13gwyw58vnc.png)

## 3. Connect to the API with Node.js :
Here's an example of using the retool.com GPT4 workflow API 🤖 `remember to read the comments`

```typescript
import fetch from 'node-fetch';

// Here we create a function createParams, which takes the body as a parameter
function createParams(body: string) {
  return {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      // Set check to true
      check: true,
      // And the body
      body: body
    })
  };
}

// We create a function that takes the body as a parameter
function fetchData(body: string) {
  // here I use an .env file which contains the URL of my webhook, but you can enter it directly here.
  // however this is not very recommended :)
  const url = process.env.RETOOL_WEBOOK_URL;
  const params = createParams(body);

  // And here is the request to our retool workflow
  fetch(url!, params)
    .then(res => {
      if (!res.ok) {
        throw new Error(res.statusText);
      }
      // If it's good, it returns the response
      return res.json();
    })
    .then(data => console.log(data))
    .catch(err => console.error(err));
}

// Call the function with the message for GPT4 as a parameter
fetchData('show me a simple function in JavaScript');

```
## Exemple JSON response :
I asked GPT to reply in Markdown
```json
{
  status: true,
  response: "Here is a simple Javascript function:\n\n```javascript\nfunction greeting({\nconsole.log(\"Hello, World!\");\n}\n```\n\nYou can call this function using `greeting();` and it will print `Hello, World!` in the JavaScript console."
}
```
## Example markdown preview :
Here is a simple Javascript function:
```javascript 
function greeting() {
 console.log(\"Hello, World!\");
}
```

You can call this function using `greeting();` and it will print `Hello, World!` in the JavaScript console.

---

And there you have it, a simple way to set up a retool.com workflow for use in our code to converse with GPT4 for free.

> 📢 However, keep in mind that it's unfortunately not unlimited, and we are limited to 500 requests per month on retool.com workflows.


![retool free limit](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jdvgq17wm0umb44fop67.png)


See you later! Beπ ✨

---

> 🫶 If you appreciate my posts and would like to support my work, feel free to make a donation by clicking on the Stripe Sponsor link below or by scanning the QR code. [Stripe Link Sponsor](https://donate.stripe.com/00g6pJ6R19MJ15S7ss)

---

[![Stripe Sponsor](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ohkf7lrymedkort4w9iz.png)](https://donate.stripe.com/00g6pJ6R19MJ15S7ss)

--- 

👀 See me here : 

- [Substack](https://benoitpetit.substack.com/subscribe)
- [Mastodon](https://piaille.fr/@codingben) 
- [(X) Twitter](https://twitter.com/codingben_)
- [Github](https://github.com/benoitpetit)
- [NPM Packages](https://www.npmjs.com/~codingben)
- [benoitpetit.dev](https://benoitpetit.dev)
- [Dev.to](https://dev.to/benoitpetit)