🤖 AI Mastery — Claude vs ChatGPT vs Gemini

The definitive AI comparison guide. Task routing cheatsheet, AI mistake fixes, and the Claude Mastery Guide with 2,000+ prompts.

→ View Live Site

---

🚀 Launch in 5 Minutes (GitHub Pages — Free)

Step 1 — Create a GitHub Repository

1. Go to github.com and sign in
2. Click the + icon → New repository
3. Name it: ai-mastery (or anything you like)
4. Set to Public
5. Click Create repository

---

Step 2 — Upload the Files

Option A — Drag & Drop (easiest):

1. Open your new repository
2. Click uploading an existing file
3. Drag ALL files from this folder into the browser
4. Write commit message: Initial launch
5. Click Commit changes

Option B — Git (faster for updates):

git init
git add .
git commit -m "Initial launch"
git branch -M main
git remote add origin https://github.com/YOUR-USERNAME/YOUR-REPO-NAME.git
git push -u origin main

---

Step 3 — Enable GitHub Pages

1. Go to your repo → Settings tab
2. Scroll to Pages in the left sidebar
3. Under Source, select GitHub Actions
4. The workflow auto-runs — wait ~60 seconds
5. Your site is live at: https://YOUR-USERNAME.github.io/YOUR-REPO-NAME/

---

Step 4 — (Optional) Custom Domain

1. Buy a domain (Namecheap, Google Domains, etc.)
2. In repo Settings → Pages → Custom domain, enter your domain
3. At your domain registrar, add a CNAME record:
   • Name: www
   • Value: YOUR-USERNAME.github.io
4. Check Enforce HTTPS

---

📁 File Structure

/
├── index.html          ← Main website (all 4 sections)
├── 404.html            ← Custom 404 page
├── robots.txt          ← SEO crawler instructions
├── README.md           ← This file
└── .github/
    └── workflows/
        └── deploy.yml  ← Auto-deploy on every push

---

✏️ Quick Customizations

Change the CTA email / link

In index.html, search for submitForm and update the success logic or connect to a real email service (Mailchimp, ConvertKit, etc.).

Connect a real email capture (Mailchimp example)

Replace the submitForm() function with:

async function submitForm() {
  const email = document.getElementById('modal-email').value;
  // POST to your Mailchimp/ConvertKit endpoint
  await fetch('YOUR_FORM_ENDPOINT', {
    method: 'POST',
    body: JSON.stringify({ email }),
    headers: { 'Content-Type': 'application/json' }
  });
  // Show success
}

Update social links in footer

Search for footer-links in index.html and add your Instagram, LinkedIn, etc.

---

🎨 Sections Included

Section	Content
Hero	Animated particle hero with all 3 AI brands
Section 1	Claude vs ChatGPT — full feature comparison
Section 2	Task Routing Cheatsheet (10 tasks, 3 AIs, score bars)
Section 3	Claude vs Gemini — table comparison + pick guide
Section 4	6 AI Mistakes — interactive accordion with fixes
Section 5	Claude Mastery Guide — book mockup, chapters, testimonials

---

🔧 Tech Stack

• Pure HTML/CSS/JS — zero dependencies, zero build step
• GitHub Actions for auto-deploy
• Particle canvas animation
• Scroll-reveal + 3D tilt effects
• Responsive (mobile + desktop)

---

Built with ❤️ — Different AI. Different approach. Way better results.