Skip to content

Integrations

Using Your Frontend with APIs and Other 3rd Party Integrations

Our third-party integrations are still a work in progress - so tread lightly for now.

We officially do not support third party integrations (yet), but with clever prompting you can use GPT Engineer to connect to these services to add full-stack capabilities to your app.

There are several reasons why you might want to make GPT Engineer aware of an backend or 3rd party integration. For example, you might already have a API with some data or authorization endpoints that you might want to connect your front-end to. This is especially relevant if you planning to use backend-as-a-service provider (e.g. Firebase, Supabase, Strapi) that offer out-of-the-box feature such as authentication (e.g. register, login, roles) and persistence (i.e.storing data in a database).

If you are looking to integrate a custom backend, check out our guide on how to integrate an OpenAPI Spec feature, which makes GPT Engineer aware of you customer backend.

Supabase

Supabase is an open-source platform that offers tools such as databases, authentication, and real-time APIs, to help developers build and scale web and mobile apps quickly.

Prerequisites
  • Create an free account at Supabase
  • Create a project
  • Make sure you have these two things at hand
    • The Supabase project Project URL
    • The Supabase public Anon Key

Authentication

In addition to the above prerequisites, please make sure you have created a test user in your Supabase project. You can do this by navigating Project -> Authentication -> Users -> Add users.

Once you have done that, you can run the following prompt as part of the initial prompt or as an improve prompt (please make sure to replace it with you own Project URL and ANON KEY): 

Add a login flow that forces users to authenticate before being redirected to the home page (make sure you send the user to the page after successfully logging in).  Use the Supabase REST API (DO NOT use the @supabase/supabase-js package) and assume I have a supabase project with following properties: 
- Project URL: https://merrefvnykbgyhbdzpleh.supabase.co
- ANON KEY: eyJhbGcjl4JIUzI1NiIsInR5cCI6IkpXVCJ9.j324l3

Make sure that: 
- You give the user an option to logout once logged in. 
- You make sure that login is persisted even after refreshing the page

Here is an example project demonstrating the output of such a prompt.

Persistence

In addition to the above prerequisites, please make sure you have created a table in your Supabase project that we will use to store the items. You can do this by navigating Project -> Database -> New Table. For testing purposes, it might be easier to turn off Row Level Security - which means that all requests to this table will be accepted and no auth policies will not be enforced.

Once you have done that, you can run the following prompt, but make you you adapt it to fit the name of the resource you created a table for in Supabase and replace it with you own Project URL and ANON KEY:

Start persisting notes in the "notes" table in Supabase.
Use their REST API (DO NOT use the @supabase/supabase-js package) and 
assume I have a supabase project with following properties: 
- Project URL: https://merrefvnykbgyhbdzpleh.supabase.co
- ANON KEY: eyJhbGcjl4JIUzI1NiIsInR5cCI6IkpXVCJ9.j324l3

Make sure that we sync all the following actions in Supabase:
- Creating notes
- Deleting notes

Here is an example project demonstrating the output of such a prompt.

Strapi

Prerequisites
  • Run a local instance of Strapi locally (follow instructions at: https://docs.strapi.io/dev-docs/quick-start)
  • Make sure you keep the Strapi URL handy (either local or deployed)

Authentication

In addition to the above prerequisites, please ensure you have also: - Create a test user by setting a user and password using the Strapi Admin

Once you have done that, you can run the following prompt (please make sure to replace it with the correct Strapi URL):

Add a login flow that accepts an email and password that forces users to authenticate 
before being redirected to the home page (make sure you send the user to the page after
 successfully logging in). Use the Strapi REST API and assume I have a Strapi api 
 running at http://localhost:1337/api.
Make sure that: 
- You give the user an option to logout once logged in. 
- You make sure that login is persisted even after refreshing the page

Here is an example project demonstrating the output of such a prompt.

Persistence

In addition to the above prerequisites, please ensure you have also done the following in the Strapi Admin: - Created a new Content-Type for the resource you plan to store (e.g. event) - Defined the attributes to the Content-Type (e.g. date, name, description) - Ensured anyone with role "Public" can create, edit and delete the Event resource

Once you have done that, you can run the following prompt, but make you you adapt it to fit the name of the resource you created a table for in Strapi and also update it with the correct Strapi URL:

Make an app for managing events. 
Assume there is a Strapi API running locally at http://localhost:1337/api/events you can connect to via REST calls. 
The event table has the following attributes: name, description and date (datetime)

As a user you should be able to:
- User should see a list of events
- User should be able to create events by specifying a name and description
- User should be able to edit events
- User should be able delete events

Here is an example project demonstrating the output of such a prompt.