DEV Community

Cover image for Free GPT 4 Webhook in 3 Easy Steps with Retool.com ! ✨
Beπ ✨
Beπ ✨

Posted on • Updated on • Originally published at benoitpetit.dev

Free GPT 4 Webhook in 3 Easy Steps with Retool.com ! ✨

Substack Newsletter

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:

2. Setting up the webhook

To set up the webhook, head over to your retool.com account under the workflow category, right here: 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

Download and import JSON file workflow :
👉️ workflow-gpt4-api.json

Download file

wget https://gist.githubusercontent.com/benoitpetit/461c62cb19e6c9d3113141be11e5a716/raw/059ea236c61e57baaf04804154ae3bb13d763d1d/retool_workflow_gpt-4_api.json
Enter fullscreen mode Exit fullscreen mode

it contains the setup parameters for the retool workflow.

workflow retool

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

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

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

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

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');

Enter fullscreen mode Exit fullscreen mode

Exemple JSON response :

I asked GPT to reply in Markdown

{
  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."
}
Enter fullscreen mode Exit fullscreen mode

Example markdown preview :

Here is a simple Javascript function:

function greeting() {
 console.log(\"Hello, World!\");
}
Enter fullscreen mode Exit fullscreen mode

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

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


Stripe Sponsor


👀 See me here :

Top comments (0)