Build & Deploy AI Apps from Zero

Two learning paths. One for managing simple websites. One for building full-stack apps with databases and frontends. Pick your track.

🌐

Basic Track

Build and manage websites. HTML, CSS, content updates, domains, hosting. Perfect for managing client sites or your own business.

For: Business owners, freelancers, beginners
🚀

Advanced Track

Full-stack applications with React frontend, Supabase database, auth, APIs, real-time features, and production deployment.

For: Developers, SaaS builders, agencies

Basic Track — Website Builder

Go from nothing to a live website you can manage yourself. No coding experience needed.

B1 Setup — Domain, Hosting, SSL
FREE45 min▸
B1.1
Install Claude Code FREE
Install Node.js and Claude Code in 5 minutes. Your AI assistant that builds everything for you.
▶ Video coming soon — 5 min
▸ Show steps
1. Download Node.js from nodejs.org (LTS version)
2. Install it — click Next through everything
3. Open Command Prompt: npm install -g @anthropic-ai/claude-code
4. Type claude — browser opens to sign in
5. Sign in with Anthropic account — done!
B1.2
Buy a Domain on GoDaddy FREE
Get your .com for $12/year. We'll register it and set it up properly.
▶ Video coming soon — 5 min
▸ Show steps
1. Go to godaddy.com and search for your domain
2. Pick a .com ($12/yr) — uncheck all upsells
3. Complete purchase — you own a domain!
B1.3
Get a VPS on Contabo FREE
Your own server for $6.99/month — 4 CPU, 8GB RAM, 50GB SSD. Way more power than you need.
▶ Video coming soon — 8 min
▸ Show steps
1. Go to contabo.com → VPS → Cloud VPS 1 ($6.99/mo)
2. Region: United States (East)
3. Image: Ubuntu 24.04
4. Set a strong root password
5. Complete order — email with your IP address arrives in minutes
6. Connect: ssh root@YOUR_IP
B1.4
Setup Cloudflare — Free SSL + CDN FREE
HTTPS, DDoS protection, and global CDN — all free. Your site is secure and fast worldwide.
▶ Video coming soon — 10 min
▸ Show steps
1. Create account at cloudflare.com (free)
2. Add your domain
3. Add A record: @ → your VPS IP (proxied ON)
4. Add A record: www → your VPS IP (proxied ON)
5. Copy the 2 nameservers Cloudflare gives you
6. Go to GoDaddy → DNS → Nameservers → Change to Custom → paste both
7. Wait 5-30 min → SSL/TLS → Full (strict)
8. Done — HTTPS + CDN + DDoS protection, all free!
B1.5
GitHub + Auto-Deploy Pipeline FREE
Push code to GitHub, it automatically goes live. Set it up once, never manually deploy again.
▶ Video coming soon — 12 min
▸ Show steps
1. Create GitHub account at github.com
2. Create a new repository
3. git init && git remote add origin YOUR_REPO_URL
4. Create .github/workflows/deploy.yml — the auto-deploy file
5. Add secrets: Settings → Secrets → SERVER_IP, SERVER_USER, SERVER_PASSWORD
6. git push → Actions tab → your code deploys automatically!
B2 Build Your Website with AI
FREE40 min▸
B2.1
Build a Multi-Page Website in 10 Minutes FREE
Tell Claude Code what you want. It generates a complete website with navigation, styling, and content. No templates — custom every time.
▶ Video coming soon — 10 min
B2.2
Add a Contact Form That Emails You FREE
Visitors fill out a form, you get an email. No backend needed — uses Formspree or direct SMTP.
▶ Video coming soon — 8 min
B2.3
Add Google Maps, Reviews, and Social Links FREE
Embed your Google Maps location, show your best Google reviews, link to all social media. The basics every business site needs.
▶ Video coming soon — 8 min
B2.4
Deploy Your Website — Go Live FREE
Push to GitHub, auto-deploys to your VPS. Visit your domain — your site is live with HTTPS!
▶ Video coming soon — 8 min
B3 Manage & Update Your Website
FREE30 min▸
B3.1
Update Content with Claude Code FREE
"Change the phone number to 555-1234" or "Add a new menu item called BBQ Chicken for $14.99" — Claude edits the file, you push, it's live.
▶ Video coming soon — 8 min
B3.2
Add New Pages and Blog Posts FREE
Tell Claude to create a new page. It generates the HTML, links it in navigation, matches the style. Add blog posts the same way.
▶ Video coming soon — 8 min
B3.3
Basic SEO — Get Found on Google FREE
Meta tags, page titles, sitemap, Google Search Console setup. The 20% of SEO that gets 80% of results.
▶ Video coming soon — 10 min
B4 Add Smart Features
PRO45 min▸
B4.1
Add an AI Chatbot to Your Site
Widget that answers customer questions 24/7 using your business info. Uses OpenRouter — costs about $2/month.
🔒 Enroll to unlock — 12 min
B4.2
Add Online Booking / Appointments
Customers pick a date and time, you get notified. SMS reminders reduce no-shows. Like Calendly but on your own site.
🔒 Enroll to unlock — 15 min
B4.3
Accept Payments with Stripe
Sell products, accept deposits, or collect payments. Stripe checkout in 15 minutes. No monthly fees — just 2.9% per transaction.
🔒 Enroll to unlock — 12 min
B4.4
AI Blog Post Generator
Enter a topic, get a full SEO-optimized blog post. Schedule weekly auto-publishing. Your content marketing runs itself.
🔒 Enroll to unlock — 10 min

Advanced Track — Full Stack Applications

Build real applications with React, Supabase, APIs, auth, and production deployment. The complete developer stack.

A1 Infrastructure Setup
FREE45 min▸
A1.1
Claude Code + Node.js + Git FREE
Install the dev tools. Claude Code, Node.js (for React), Python (for backend), Git (for version control).
▶ Video coming soon — 8 min
A1.2
VPS + Domain + Cloudflare + Docker FREE
Same infra as Basic track: Contabo VPS ($6.99/mo), GoDaddy domain, Cloudflare SSL/CDN, Docker for deployment.
▶ Video coming soon — 15 min
A1.3
GitHub Actions CI/CD Pipeline FREE
Push to GitHub → auto-build → auto-deploy. Professional CI/CD that Fortune 500 companies use. Set up once, forget forever.
▶ Video coming soon — 12 min
A2 Frontend — React + Vite
FREE60 min▸
A2.1
Create a React App with Vite in 30 Seconds FREE
One command creates a full React project. Vite is the fastest build tool — hot reload in milliseconds. Claude Code writes React components for you.
▶ Video coming soon — 10 min
▸ Show steps
1. npm create vite@latest my-app -- --template react
2. cd my-app && npm install
3. npm run dev → opens at http://localhost:5173
4. Open claude in the project folder
5. Tell Claude: "Build me a dashboard with a sidebar, header, and main content area"
💡 Claude writes React components, JSX, CSS — you describe, it builds
A2.2
Components, Props, and State — The React Basics FREE
How React works: reusable components, passing data with props, managing state with useState. Claude writes it, you understand it.
▶ Video coming soon — 15 min
A2.3
Routing, Navigation, and Multi-Page Apps FREE
React Router for multiple pages: /dashboard, /settings, /profile. Sidebar navigation that highlights the current page.
▶ Video coming soon — 12 min
A2.4
Tailwind CSS — Beautiful UI Without Writing CSS FREE
Utility classes that make styling 10x faster. className="bg-blue-500 text-white p-4 rounded" — that's it. Claude loves Tailwind.
▶ Video coming soon — 10 min
A3 Backend — Supabase (Database + Auth + Storage)
PRO75 min▸
A3.1
Supabase Setup — Your Backend in 5 Minutes PRO
Create a Supabase project. Get a full PostgreSQL database, REST API, auth system, and file storage — free tier handles most apps.
🔒 Enroll to unlock — 10 min
▸ Show what you'll learn
• Create account at supabase.com
• Create a new project — choose region closest to your users
• Get your project URL and anon key
• Install client: npm install @supabase/supabase-js
• Connect from React — one import, two lines of config
💡 Free tier: 500MB database, 1GB storage, 50K monthly active users
A3.2
Database Tables — Create, Read, Update, Delete
Build tables in the Supabase dashboard or with SQL. CRUD operations from React. Real-time subscriptions — data updates instantly across all clients.
🔒 Enroll to unlock — 15 min
A3.3
Auth — Login, Signup, Password Reset, OAuth
Full auth system in 20 minutes. Email/password, Google login, magic links. Protected routes — only logged-in users see the dashboard. Supabase handles everything.
🔒 Enroll to unlock — 20 min
A3.4
File Storage — Upload Images, Documents, Avatars
Users upload profile photos, documents, attachments. Supabase Storage handles files with automatic CDN. Drag-and-drop uploader component included.
🔒 Enroll to unlock — 12 min
A3.5
Row-Level Security — Data Access Control
Users can only see their own data. Admins see everything. RLS policies make your app secure by default. No backend code needed.
🔒 Enroll to unlock — 10 min
A4 API Layer — FastAPI + Supabase
PRO60 min▸
A4.1
FastAPI Backend — When Supabase Isn't Enough
Supabase handles 80% of your backend. For the other 20% (AI processing, external APIs, complex logic), add a FastAPI layer.
🔒 Enroll to unlock — 15 min
A4.2
Connect FastAPI to Supabase
Server-side Supabase client with service role key. Bypass RLS for admin operations. Handle webhooks, background jobs, AI processing.
🔒 Enroll to unlock — 12 min
A4.3
Add AI Features — OpenRouter Integration
AI chatbot, content generation, image analysis, document processing. FastAPI handles the AI calls, Supabase stores the results. $2/month for most apps.
🔒 Enroll to unlock — 15 min
A4.4
Stripe Payments + Subscription Billing
Checkout pages, recurring subscriptions, usage-based billing. Stripe + Supabase webhooks keep user plans in sync automatically.
🔒 Enroll to unlock — 15 min
A5 Build Real Projects
PRO90 min▸
A5.1
Project: SaaS Dashboard with User Accounts
Full SaaS app: signup, login, dashboard with charts, settings page, admin panel. React + Supabase + Tailwind. Deploy to your VPS.
🔒 Enroll to unlock — 25 min
A5.2
Project: Real-Time Chat App
Multi-room chat with typing indicators, read receipts, and file sharing. Supabase Realtime makes this surprisingly simple.
🔒 Enroll to unlock — 20 min
A5.3
Project: Marketplace with Payments
Sellers list products. Buyers purchase with Stripe. Reviews, search, categories. A mini e-commerce platform.
🔒 Enroll to unlock — 25 min
A5.4
Project: AI-Powered Tool (Your First SaaS)
Pick one: resume reviewer, receipt scanner, content repurposer, code documenter. Build it, add Stripe billing, launch it. Your first revenue-generating product.
🔒 Enroll to unlock — 25 min
A6 Production Deploy + Turn It Into a Business
PREMIUM75 min▸
A6.1
Docker + nginx + SSL — Production Deployment
Multi-container Docker Compose. nginx reverse proxy for multiple apps on one server. SSL termination. The exact setup we use.
🔒 Enroll to unlock — 15 min
A6.2
Monitoring, Logging, and Error Tracking
Know when your app breaks before users tell you. Uptime monitoring, error alerts, log aggregation. All free tools.
🔒 Enroll to unlock — 12 min
A6.3
Selling AI Services to Local Businesses
The exact script, pricing, and approach. Walk into any business and walk out with a client. Tested in Allentown, PA.
🔒 Enroll to unlock — 15 min
A6.4
Pricing, Packaging, and Scaling to $10K/Month
Three pricing tiers. Monthly recurring revenue. Referral programs. The playbook from $0 to $10K/month.
🔒 Enroll to unlock — 15 min

Pricing

Start free. Upgrade when you're ready.

Free

$0
forever
  • Basic: B1-B3 (Setup + Build + Manage)
  • Advanced: A1-A2 (Infra + React Frontend)
  • 12 free video lessons
  • Detailed written steps
  • Smart features (chatbot, payments)
  • Supabase + FastAPI modules
  • Real-world projects

Pro

$49
one-time
  • Everything in Free
  • Basic: B4 (Chatbot, Booking, Payments)
  • Advanced: A3-A5 (Supabase, API, Projects)
  • All project source code
  • 25+ video lessons total
  • Business module

Premium

$97
one-time
  • Everything in Pro
  • Advanced: A6 (Production + Business)
  • All 30+ video lessons
  • Business plan templates
  • Client pitch deck
  • 30-min strategy call

Full Stack AI Tutorial © 2026 ConnectUs AI | Home | Ideas | Beginner Guide