Lesson 02: Build and Ship Your First App

In this lesson, you're going to build a real app from scratch using vibecoding and deploy it to the internet. By the end, you'll have a live URL that anyone in the world can visit.

If you run into errors at any point in this lesson, copy the entire error message and paste it into your coding agent. You'll most likely have your problem fixed in seconds.

---

This is the lesson where you stop reading and start building. Everything you learned in the Introduction to Vibecoding lesson (the loop, prompting, working with an AI agent) you're about to put into practice.

By the end of this lesson, you will have:

1. Set up your computer for vibecoding
2. Built a working app on your computer
3. Put it on the internet with a live URL
4. Shared it with anyone you want

Let's go.

---

Part 1: Set Up

Before you can build anything, you need to pick where you're going to run your AI agent. We recommend Replit. It runs in the cloud and takes no installation. If you'd rather run everything on your own machine, switch to the Local tab.

---

Windows Setup Troubleshooting

If something goes wrong during setup, don't panic. Here are the most common fixes (Windows only — skip this section on Mac or Linux, or if you picked Replit).

"is not recognized as the name of a cmdlet"

This usually means you need to close PowerShell completely and reopen it (as administrator) after installing something. Windows needs to refresh to find new commands. If that doesn't work, try restarting your computer.

"permission denied" / "access denied"

Make sure you opened PowerShell as administrator. Close it, right-click the PowerShell icon, and select "Run as administrator". You should see "Administrator" in the window title.

"scripts disabled" / "execution policy"

Windows sometimes blocks scripts from running by default. Paste this into PowerShell and try again:

Set-ExecutionPolicy -Scope CurrentUser RemoteSigned

"npm is not recognized"

This means Node.js didn't install correctly. Go back to Step 2 and try again. Make sure to close and reopen PowerShell after installing Node. If it still doesn't work, try the installer option from nodejs.org instead.

Still stuck?

Take a screenshot of the error and ask in our Discord — someone will help you out.

---

Part 2: Build It

Step 1: Start Your AI Agent

Step 2: Pick an Idea

Don't overthink this. Your first app doesn't need to be original or complex. It needs to be done. Pick something small that you can describe clearly. Here are some ideas:

• A personal website with your name, bio, and links to your socials
• A countdown timer to an event you're excited about
• A quiz app about a topic you love
• A to-do list app
• A tip calculator
• A mood tracker
• A random quote generator

Pick one. Or come up with your own. The only rule is: keep it simple enough to describe in a few sentences.

Step 3: Describe It

Type your prompt. Be specific. Here's an example:

> Build me a personal website with my name "Kacie", a short bio 
  that says "building things with AI", and links to my Twitter 
  and GitHub. Dark theme with a purple accent color. Clean, 
  minimal design. Make it responsive for mobile.

Hit enter and watch. The agent will start creating files and writing code. Let it work. This usually takes 30 seconds to a few minutes.

Step 4: See It

Step 5: Iterate

Look at your app. What do you want to change? Go back to your terminal and tell the agent:

> Make the font bigger
> Change the background to a darker shade
> Add a section for my projects
> The button doesn't work, fix it
> Make it look better on mobile

After each change, refresh your browser to see the update. Keep going until you're happy with it.

This is the loop: describe > build > review > feedback > repeat. There's no wrong way to do it. The more specific you are, the better the results.

---

Common Issues (Local Windows only)

If you're on Replit, skip this section. These issues only affect local Windows setups.

"Connection refused" on localhost

This is a common Windows issue. On Windows, localhost sometimes points to IPv6 (::1) instead of IPv4 (127.0.0.1), and the server might only be listening on one of them.

Quick test: if localhost:3000 doesn't work, try 127.0.0.1:3000 instead. If that works, it's an IPv6 mismatch.

To fix it, paste this into the AI:

I'm on Windows. Fix my localhost setup end-to-end with no back-and-forth.

Goals:
1) Make both http://localhost and http://127.0.0.1 work reliably on the same port
2) Prevent terminal auto-close issues
3) If the port is busy, automatically use another port and print the URL

Do all of this automatically:
- Check Node is installed and on PATH. If missing, tell me exactly what to install and stop.
- Create/fix a static server script (server.js) that serves files from the project root
- Bind host to :: (IPv6-compatible) so localhost works on Windows
- Create/fix a start-localhost.cmd that stays open, runs node server.js directly (not npm), prints clear errors, and pauses on failure/exit
- Add package.json with "start": "node server.js" if missing
- Start the server and verify with HTTP checks to both localhost and 127.0.0.1
- If the port fails due to a conflict, retry with the next port and verify again
- At the end, print what files were changed, the exact URL to open, the exact command to run next time, and your top 3 troubleshooting tips

Do not ask me questions unless absolutely blocked.

Page loads then dies

If the page loads for a second then disappears, your terminal is closing and killing the server with it. Don't double-click scripts to run them. Open Command Prompt or PowerShell first, cd into your project folder, and run node server.js from there. The window needs to stay open for the server to keep running.

"Scripts disabled" / "Execution policy"

Same fix as in the Windows Setup Troubleshooting section above: run Set-ExecutionPolicy -Scope CurrentUser RemoteSigned in PowerShell and try again.

---

Part 3: Ship It

Your app works. Now let's put it on the internet so anyone can see it.

You've got two paths. If you're on Replit, the easiest way to ship is Replit's one-click publish. If you want more control (or you built locally), push your code to GitHub and host it with Vercel or GitHub Pages. Both are free.

---

Part 4: Share It

Open your live URL on your phone. Text it to a friend. Post it on social media. You built this. From scratch. With an AI agent.

Making updates:

---

What You Just Did

Take a second to appreciate this. You:

1. Set up your computer for vibecoding
2. Described an app in plain English
3. Had an AI agent build it for you
4. Ran it on your computer
5. Iterated on it until you liked it
6. Uploaded the code to GitHub
7. Deployed it to the internet with Vercel
8. Got a live URL that anyone in the world can visit

That is the full cycle of building and shipping software in 2026. No CS degree. No bootcamp. No years of experience. Just you, an idea, and an agent.

---

What's Next

You have a live app on the internet. That's a huge milestone. But right now, your app is just a static page. It can't remember anything. It can't handle users. It can't process payments. In the next lesson, we'll explore what happens when you try to add real functionality, and why you'll hit a ceiling that only blockchain can solve.