Let's see if GPT-4 can build ChatGPT in 10 prompts or less:
Note: I'm going to do this live, I have no idea if this is going to work. Wish me luck 🫡
PROMPT 1:
We're asking it to build a React component for a chatbot:
Here's the response, it looks pretty good!
PROMPT 2:
Now we'll ask it to write the HTML file that includes the React component, and style it. I asked it for dark mode–let's see how it does 😅
Here's the response:
As you can see, it's asking me to include an index.js file...but it hasn't yet told me what that is. Let's use a prompt on that!
Here's its response:
It's recommending I use the create-react-app to start the project, which makes me a bit nervous but we'll give it a shot!
I'm creating the React app now:
AND WE HAVE A CHATBOT!
It's client-side only for now, but you can send messages and everything :)
PROMPT 3:
Okay now we're cooking! We need a Flask server to handle the chat requests from the client. When it gets a chat request it should send it to GPT-4 for a completion. I'm literally going to paste in the GPT-4 API docs for reference.
Let's see what it can do!
Here's the response. Looks good!
I'm going to implement this (with a few minor modifications) and see what happens...
Our server is up and running!!!
Okay, we ran into a minor problem. Our server and client are hosted at different addresses—so when I make POST requests I get a Cross Origin error:
PROMPT 4:
Let's ask GPT-4 to fix the CORS error!
Here's the response. Seems reasonable! I'll report back...
Okay I went back and forth a bit on the CORS issue until it finally found the right modification for my app.py file. Not counting that as a prompt...it's sort of a side quest conversation. But...it fixed it!
Now, when I type a message it hits my chat server!
But there's a problem...when I send the request to GPT-4 it returns an error.
It looks like for some reason we're not actually sending the chat transcript to GPT-4. Not sure why...I'm going to step through the code
Okay so it looks like for some reason the client side isn't actually sending the chat transcript to the server.
I wonder why that is...
OMFG IT WORKS
For some reason it works on the second message, but not the first.
Going to have to ask GPT-4 why that is, and see if it can fix it...
PROMPT 5:
I asked it why the first message doesn't arrive and it figured it out!
It worked! It worked! It worked!
This was shockingly, crazily, incredibly easy.
I actually also learned something...I never would've used the create-react stuff on my own. I would've rolled it myself.
But it's quite good!
Now...let's see if I can get my ChatGPT clone to create another ChatGPT clone in 10 prompts or less... 👿
Share this Scrolly Tale with your friends.
A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.