Skip to content

tiff-k/claude-code-course

Repository files navigation

Flow Club Build Challenge

Build and deploy your own website using Claude Code. No coding experience required.

What Is This?

This is a guided challenge where you'll build a real website from scratch and put it live on the internet. You choose what to build — a landing page, portfolio, web app, blog, or whatever you can imagine.

Claude Code is your build partner. It handles the technical heavy lifting. You make the creative decisions.

What You'll Build

By the end of this challenge, you'll have:

  • A live website with a real URL anyone can visit
  • Pages with your own content and design
  • A database to store and manage data
  • The satisfaction of having built something from nothing

Prerequisites

Before you start, you'll need:

  1. Node.js (version 18 or higher) — Download here
  2. Claude CodeInstall here
  3. A GitHub accountSign up free
  4. A Vercel accountSign up free (you can use your GitHub account)
  5. A Supabase accountSign up free (you can use your GitHub account)

Don't worry if you haven't used any of these before — Claude will walk you through everything.

Quick Start

1. Clone this project

git clone https://github.com/techtiffai/flow-club-build-challenge.git
cd flow-club-build-challenge

2. Install dependencies

npm install

3. Start the dev server

npm run dev

Visit http://localhost:3000 to see the welcome page.

4. Open Claude Code

In a new terminal, navigate to the project folder and start Claude Code:

cd flow-club-build-challenge
claude

5. Start the challenge

Type this in Claude Code:

/kickoff

Claude will ask you what you want to build and create a personalized plan for your project.

The Milestones

The challenge is broken into 8 milestones. Work through them at your own pace.

# Milestone What You'll Do
1 Setup Install tools and get the project running locally
2 Plan Your Project Choose what to build and map out your pages
3 Build Your Pages Create your site's pages with real content
4 Connect Supabase Set up a database to store data
5 Add Features Build the interactive parts of your site
6 Style It Make it look great with colors, spacing, and responsive design
7 Deploy Put your site live on the internet
8 Share Show off what you built in Flow Club!

Useful Commands

Type these in Claude Code at any time:

Command What It Does
/kickoff Start the challenge and choose your project
/next Get one clear step to work on right now
/status See your progress through the milestones
/checkpoint Save your progress and celebrate
/deploy Deploy your site to Vercel
/stuck Get help when something isn't working

How Progress Works

Your progress is saved in the context/ folder:

  • context/progress.md — Which milestones you've completed
  • context/project.md — Your project plan
  • context/decisions.md — Technical decisions you've made

These files persist between sessions, so you can close Claude Code and come back later without losing your place.

Tech Stack

  • Next.js — The framework that powers your website
  • Tailwind CSS — Makes styling fast and easy
  • Supabase — Your database and user authentication
  • Vercel — Hosts your site and gives you a live URL

FAQ

Do I need to know how to code? Nope. That's the whole point. Claude handles the code — you make the decisions about what to build and how it should look.

How long does the challenge take? It depends on what you build. A simple landing page might take 2-3 sessions. A full app with authentication could take 5-10 sessions. Go at your own pace.

What if I get stuck? Type /stuck in Claude Code. It'll help you debug whatever's going wrong. You can also ask for help in the Flow Club community.

Can I build something that's not on the suggested list? Absolutely. The project types are suggestions, not requirements. Build whatever excites you.

Is this free? The tools and hosting are free for the scale of this project. Claude Code requires a Claude subscription.

Community

This challenge is part of Flow Club. Share your progress, ask questions, and celebrate wins with other builders.


Built with Claude Code. Happy building!

About

The Claude Code Course — learn to build and deploy web apps with Claude Code

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages