Developer Docs Landing Page (SEO + DX)
Design the developer documentation homepage for [API/PRODUCT_NAME] β optimized for search ([PRODUCT] API docs, [PRODUCT] SDK, how to integrate [PRODUCT]) AND developer experience. --- π― AUDIENCE [Backend devs | Full-stack | No-code integrators] building [USE_CASES] SDKs: [JS, Python, Go, etc.] --- π PAGE LAYOUT 1. Hero - H1: [PRODUCT] Documentation - Sub: ship [OUTCOME] in minutes - Quickstarts: 3 cards (Popular: REST API, Webhooks, [SDK_LANGUAGE]) - Search bar prominent (cmd+K) 2. Popular guides (6 links with descriptions β indexable) 3. API reference teaser + OpenAPI badge 4. Code snippet block (dark theme) β copy button, real hello-world 5. Changelog preview (last 3 releases, link /changelog) 6. Community: Discord, GitHub, Stack Overflow 7. Support CTA --- π SEO Indexable intro copy (250+ words) explaining what the API does β not only a component grid Title/meta with "documentation" + "API" SoftwareApplication or TechArticle schema Breadcrumb to docs root Internal links to top 20 doc paths in HTML sitemap section (footer) --- π¨ DESIGN Dark mode default [#0D1117] or light [Stripe-style] β specify Typography: excellent code font [JetBrains Mono] + clear sans Sidebar preview in hero optional --- βοΈ STACK [Mintlify | Docusaurus | Fumadocs | Custom Next.js] Deliver: full wireframe, copy, nav taxonomy for docs sidebar, and SEO metadata.
π Example Output / Preview
Prompt Metadata
Primary Use Cases:
- β’Legacy code modernization & technical refactoring
- β’Full-stack layout generation & component structuring
- β’CI/CD workflow automation & unit/E2E testing suites
Associated Tags:
π‘ Pro Tips & Advice
1. Use bracketed items: Be sure to fill out all [PLACEHOLDER] elements with specific details before sending the prompt to the AI model.
2. Adjust temperature: For creative tasks, set AI temperature higher (e.g., 0.8), or lower (e.g., 0.2) for strict coding/technical tasks.
π Related AI Prompts
Full SaaS Landing Page Build Spec (SEO + Conversion)
You are a Staff Product Designer + Frontend Engineer + SEO strategist. Build a complete, production-ready marketing landing page f...
SaaS Analytics Dashboard Full Build Spec
You are a Principal Product Designer + Frontend Lead. Design and specify a complete [LIGHT | DARK] analytics dashboard for [PRODUC...
SaaS Admin Panel Dashboard Build Spec
Design a full internal Admin Dashboard for [PRODUCT_NAME] used by [ADMIN_ROLE: support | ops | super-admin]. --- π― CONTEXT Adm...