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: 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 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.
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.
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
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.
c. Deploy the retool workflow
Once this is done, we can deploy our workflow by clicking on the deploy button and deploy button:
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.
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