Module 3: Vibe Coding3.1: Vibe Coding Setup

Module 3.1: Vibe Coding Setup

Reference Guide

  • Time to Complete: 10-15 minutes
  • Prerequisites: Modules 1 and 2 recommended, but this module is accessible to everyone — no PM experience required
  • Module 3 total time: about 1.5-2 hours across five lessons (no need to do it all at once)

Start this lesson interactively: Type /start 3 1 in the Codex app to set up your build project.

Overview

The earlier modules taught you to work with files — analyzing, synthesizing, extracting insights. Module 3 is about creating something from scratch: a real, working website with a real link you can send to friends. By the end of the module you’ll have built and deployed a “What’s Your Coffee Personality?” quiz — a drink-recommendation engine dressed up as a personality quiz.

Key takeaway: This module teaches a repeatable loop you can use to build almost anything — landing pages, tools, prototypes, simple apps.

The Mindset Shift: You’re the PM, Codex Is the Engineer

You describe what you want. Codex writes the code. You don’t need to understand the code — you just need to know what you want.

Your job is to:

  • Be clear about requirements
  • Agree on the plan
  • Review what gets built
  • Tell Codex what to change

This is exactly how non-technical people work effectively with developers — and you’re about to learn that skill.

The Build Loop

Everything in this module follows one loop:

StepWhat it means
PlanFigure out exactly what you’re building — the requirements
BuildCodex creates it while you watch
IterateTell Codex what to change until you love it
SaveBack it up to GitHub (like Google Drive for code)
DeployPut it on the internet so anyone can visit — “going live”

Plan → Build → Iterate → Save → Deploy. Master this loop and you can build anything.

About the Tech (You Don’t Need to Understand It)

Codex writes the project in JavaScript — the most popular language for websites — using Next.js, a popular framework that makes JavaScript sites easier to build and deploy. You don’t need to understand any of it; it’s mentioned only so the terms are familiar. Codex handles all the code.

What This Lesson Sets Up

You’ll create a single project folder — quiz-project — where all the code and files for your quiz will live. Just ask Codex to create it:

Create a new folder called quiz-project

Where This Applies Beyond the Course

  • Building a quick tool, prototype, or website
  • Testing whether an idea is even possible
  • Side projects, internal tools, landing pages, simple apps

What’s Next

Next up is Module 3.2: Plan — Codex interviews you about your quiz and writes a clear requirements document to build from.

Start it by typing /start 3 2 in the Codex app, or read the reference guide:

Go to Module 3.2: Plan →