Setting Up a Free GPT-4 Webhook API with Retool

Setting Up a Free GPT-4 Webhook API with Retool

·

3 min read

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

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

Example 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."
}

Example markdown preview :

Here is a simple Javascript function:

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

Happy coding, and may your conversations with GPT-4 be both insightful and economical!

If you found this tutorial helpful, consider buying the author a coffee: Buy Me A Coffee

Did you find this article valuable?

Support Ben ✨ by becoming a sponsor. Any amount is appreciated!