Lead Finder Lite Workshop

3-Session Workshop

What to expect in the sessions

You'll build Lead Finder Lite — a real lead-tracking app — from scratch, using Claude Code as your coding partner. No prior coding experience required.

Start with Session 1

$ claude

> Build a lead tracker UI — a form to add a lead

  (company, contact, title, notes) and a table

  showing all leads with a status badge.

✓ Done. Preview running at localhost:5173

01

Setup + UI

Install tools, vibe-code your first screen.

02

API + Database

Connect Supabase, enrich leads with Clay.

03

Going live

Deploy to Vercel, Railway, your own domain.

Before you arrive

Prerequisites

Install these before Session 1 so class time goes to building, not downloading. Each one takes a couple of minutes.

1. Node.js (LTS)

JavaScript runtime needed to run Vite, npm, and the React dev server.

  1. Go to nodejs.org/en/download
  2. Download the LTS version for your OS (Windows/macOS/Linux)
  3. Run the installer, accepting the defaults
  4. Verify: open a terminal and run node -v — it should print a version number

2. VS Code

The code editor you'll work in for all 3 sessions.

  1. Go to code.visualstudio.com/download
  2. Download the version for your OS
  3. Run the installer, accepting the defaults
  4. Open VS Code once to confirm it launches

3. GitHub Desktop

A visual way to commit and push to GitHub — no git commands needed.

  1. Go to desktop.github.com/download
  2. Download and install for your OS
  3. Sign in with a GitHub account (create a free one first at github.com/signup if needed)

4. Claude Code CLI

Runs inside VS Code's terminal — this is your AI coding partner for the workshop.

  1. With Node.js installed, open a terminal and run npm install -g @anthropic-ai/claude-code
  2. Run claude and follow the sign-in prompt
  3. You'll need a Claude account — sign up free at claude.ai if you don't have one

5. Vercel account

Hosts your React frontend — no install needed, the deploy CLI runs on demand via npx.

  1. Go to vercel.com/signup
  2. Sign up free — signing in with GitHub is easiest

Good to know

Everything above is free-tier. Total setup time is about 10 minutes if you do it all in one sitting. Railway, Supabase, and Clay.com accounts are covered separately, right before Session 2.

Session 1 · 1 hr

Setup + your first screen

Install your tools, then build the app's UI by describing it to Claude Code in plain English.

You'll learn

  • How to install and use Claude Code inside VS Code
  • What Git/GitHub is, and why every project needs it
  • "Vibe coding" — describe, review, refine
  • Deploying a live website in seconds (Vercel)

You'll leave with

A working lead-tracker screen, live on the internet, with a link you can share.

Before Session 2

A few more accounts to set up

Session 2 connects your app to a real database and an enrichment API. Sign up for these ahead of time so class time goes to building.

1. Railway account

Hosts your FastAPI backend.

  1. Go to railway.app and sign up free
  2. Signing in with GitHub is easiest — it's used to connect your repo in Session 2

2. Supabase account

Your Postgres database.

  1. Go to supabase.com and sign up free
  2. No project setup needed yet — that happens live in Session 2

3. Clay.com account

Enriches a lead's company details automatically.

  1. Go to clay.com and sign up for the free tier

Session 2 · 1 hr

Making it real

Connect your screen to an actual database, and add a feature that auto-fills company details for you.

You'll learn

  • What an API is, and why frontend and backend are separate
  • How a database (Supabase) stores your data permanently
  • Auto-enriching a lead's details via the Clay.com API
  • Keeping secret keys safe using environment variables

You'll leave with

A full app — add a lead, and it's saved for real, with company info filled in automatically.

Session 3 · 1 hr

Going live

Move everything from "working on my laptop" to "live for anyone, on my own domain."

You'll learn

  • The difference between testing locally and deploying to production
  • Connecting a custom domain via Cloudflare
  • How frontend, backend, and database talk once deployed
  • Handing off a project cleanly with a README

You'll leave with

Your own live app, on your own domain, plus a repo and guide to reuse or extend anytime.

By the end of all 3 sessions, you will

Understand the core pieces of any modern app: frontend, backend, database, deployment

Know how to use Claude Code as a hands-on coding partner, not just a chatbot

Have shipped something real — not a tutorial, an actual working app

Have a repo and guide to keep building on your own

Lead Finder Lite Workshop — React · FastAPI · Supabase · Cloudflare