How to build your own ChatGPT

Build your own AI chatbot in 15 mins

Hey, I’m Colin! I help PMs and business leaders improve their technical skills through real-world case studies. For more, check out my live courses, Technical Foundations and AI Prototyping.

---

Building your own software has never been easier. Today, I’ll walk you through how to build your own ChatGPT from scratch in less than 15 minutes.

How does ChatGPT work?

This post is not about training Large Language Models or fine-tuning to improve performance. For most of us, providers like OpenAI and Anthropic provide good enough models to use out of the box. We access these models through APIs.

From this perspective, ChatGPT’s base functionality is actually very simple. You enter a message in a text box, it gets sent to the AI model via API, and a response is returned. When you ask a new question, the context of the prior conversation is maintained.

Our setup will look slightly different from this. We’ll integrate with OpenAI from our own server so that we can keep our API connection secure.

Implementing your server

Let’s implement our server using ActivePieces, a drag-and-drop automation tool.

We’ll need:

1. A server to send requests to with our message

2. An AI action to respond to the message

3. A response from the server with the AI message

Here’s what our flow should look like:

ActivePieces configuration

The URL provided by catch webhook is where we’ll send our requests. Make sure to add /sync at the end if you’re following along!

Building your frontend

Next, we’ll build our frontend application. You can do this with v0, bolt, or replit.
I chose v0 to take advantage of their default styling.

Here’s my prompt:

Build me a chatbot like ChatGPT. My server is hosted at https://cloud.activepieces.com/api/v1/webhooks/[mypath]/sync.

It is expecting a post request containing a key-value pair. The key is 'message', and the value is the user's input.

It will return a JSON key-value pair. The key is response and the value is the AI response.

Let’s break this down:

• I don’t have specific requirements for the chatbot, so I didn’t give explicit instructions on styling or technology

• I am providing the URL the chatbot should send requests to, with the structure of the data being sent and received. This should match your steps (review the GIF above carefully!)

• I am expecting v0 to use shadcn/ui, a UI library with great default styling, and Vercel’s AI SDK, a library to quickly build AI chat experiences

Here’s our result:

Custom AI chat

Extending your app

There’s a few ways you could extend your app:

1. Include the full conversation history in each request, so the AI keeps context over time

2. Swap providers to another LLM, like Anthropic for Claude Sonnet 3.5

3. Improve the UI, like using markdown for responses instead of plain text

For fun, I decided to make mine a functional AI code editor.

Basic AI code editor

Putting it all together

For most of us, building basic AI experiences is much easier than it seems.

1. Build a client with Bolt, v0, or Replit

2. Build a server with ActivePieces

3. Integrate with AI providers like OpenAI or Anthropic

Give it a try today!