TaskBuild the AI demo landing. <head>: title 'AI Python tutor — try it free | CodeMentor', description, canonical 'https://learnpython.academy/demo', OG 5-tag set (og:title, og:description, og:image='https://learnpython.academy/og/demo.png', og:url, og:type='website'), twitter:card='summary_large_image'. <body>: <main><h1>AI tutor — ask any Python question</h1><p>30,000+ developers learning by asking.</p><form id='ask' action='/api/ask' method='post'><label for='q'>Your question</label><input id='q' name='q' required placeholder='Why is `is` not `==` ?'><button>Ask</button></form><pre id='answer' aria-live='polite'></pre></main>.
Capstone 2: AI demo landing page
250 XP18 min
Theory
What we're building
Public-facing landing for your AI demo (the FastAPI /api/ask endpoint from the AI Engineering track). Goal: a stranger can find it via Google, share it on Twitter, and try it — all in 30 seconds.
Components:
- Hero: h1 + 1-sentence value prop + CTA.
- The demo: form with a prompt input + button + answer display area.
- Full SEO+OG block: title, description, canonical, OG 5-tag set, Twitter card.
- JSON-LD WebApplication for rich-result eligibility.
This is the page every AI demo on Product Hunt should look like.
🔒
Sign up to start coding
Theory is open to everyone. The interactive editor, live preview, and check are unlocked with a 7-day free trial — card required, cancel anytime.
Sign up — free trial →First 10 lessons in each track are free. No card needed for those.