How to add an AI Chatbot into your app using ChatGPT?

If you'd like your app to support a chat interface that allows users to ask questions and have responses, using ChatGPT, use this prompt. This prompt does not allow for your chat interface to only use your data. It uses the generic ChatGPT interface.

Add an OpenAI chatbot to my app.

Requirements:
– Frontend: A floating chat widget in bottom-right, styled minimal (grey + blue, Inter –6 spacing).
– Backend: `/api/chat` route that streams responses from OpenAI GPT-4o (or GPT-5 if available).
– Use function calling for context (e.g., system prompt to act as app support bot).
– Store API key in environment variables.
– Chat should support persistent conversation stored in Supabase `conversations` table.
– Add typing indicator + smooth fade-in for responses.
– Output: Complete widget + backend API, copy-paste ready.


Was this article helpful?