🔍 Search

Home · Coding Agents · Landing Pages

🚀

Online course sales landing page — Landing Pages Prompt

You get a runnable project for online course sales landing page — plan, complete code, demo data and run instructions — instead of disconnected code snippets.

Landing Pages Advanced

✨ What you get — sample output preview

Sample output · Landing Pages

A complete project for online course sales landing page: file tree (index/entry, components or modules per feature, styles, README), working core flow, demo data preloaded, and the must-have feature implemented rather than stubbed. Built with React + Vite + Tailwind; runs locally with one command and passes the acceptance criteria above.

ResultYou get a runnable project for online course sales landing page — plan, complete code, demo data and run instructions — instead of disconnected code snippets.
Typical time5–30 minutes per build
CostCursor and Claude Code are paid; ChatGPT & Gemini free tiers work
DifficultyAdvanced

🧩 Fill the variables — your prompt updates live

You are a senior product engineer working as an autonomous coding agent. Build Online Course Sales Landing Page: a complete, working version of this brief — online course sales landing page — for first-time visitors on mobile and desktop. Stack: React + Vite + Tailwind. Non-negotiable feature: search and filtering. Scope and quality bar: conversion-focused landing page: hero with one primary CTA, social-proof strip, three feature blocks, pricing or signup section and FAQ, responsive and fast with no heavy frameworks unless the stack demands it. Process: 1) Write a short plan with the file tree. 2) Implement every file completely — no placeholders, no TODO stubs. 3) Include seed/demo data so the app works on first run. 4) Add a README with exact run commands. Acceptance criteria: the app starts with one command, the core flow works end to end, layout is responsive, and errors are shown to the user in plain language. If a requirement is ambiguous, choose the simplest sensible option and note the assumption in the README instead of asking.
▶ Open in ChatGPTCopy + open Cursor ↗Copy + open Claude Code ↗Copy + open Gemini ↗

🛠️ How to use it in each tool

  1. Open your project in Cursor, start an Agent (Composer) chat, and paste the filled prompt from the box above as the task.
  2. Attach the files the agent may touch with @ references; the prompt's acceptance criteria act as the stop condition, so keep them in.
  3. Review the plan the agent proposes before it edits; then let it implement and run the result inside Cursor's terminal.
  4. Commit after each accepted run — agent-built projects iterate fastest in small, verified steps.

Paste location: Agent/Composer chat in your open project; attach editable files with @.

  1. In your project folder, start Claude Code and paste the filled prompt from the box above as the task (or save it as TASK.md and say "follow TASK.md").
  2. Let it plan first (it will propose a file tree); approve the plan, then let it write files and run the app or tests itself.
  3. Ask it to verify against the acceptance criteria in the prompt and fix failures before summarizing.
  4. Keep the session open for follow-up features — Claude Code retains the codebase context.

Paste location: the Claude Code session in your project folder, or a TASK.md file it is told to follow.

  1. Open ChatGPT (link below) — the quick-use button pre-fills the filled prompt from the box above in a new chat.
  2. Review the filled variables once; if a variable still shows brackets, replace it with your own words.
  3. Send it. For image results, ask for one variation at a time ("same image, warmer light") instead of re-rolling everything.
  4. Save the winning output and copy the final prompt into your notes — ChatGPT does not keep a prompt library for you.
  1. Open Gemini and paste the filled prompt from the box above (or use Copy + Open below).
  2. For image or video-capable tasks, Gemini routes to its media models automatically; state the format (aspect ratio / length) in the first line, as the prompt does.
  3. Regenerate once rather than editing mid-chat if the first result misses the format; then refine with one change at a time.
  4. Export text results to Docs/Sheets from the share menu when you need them in office formats.

🔗 Related prompts

🚀Landing PagesMedium
Coding Agents

Mobile app waitlist landing page — Landing Pages Prompt

You get a runnable project for mobile app waitlist landing page — plan, complete code, demo data and run instructions — instead of disconnected code snippets.

CursorClaude CodeChatGPTGemini
🚀Landing PagesMedium
Coding Agents

Indie game pre-launch landing page — Landing Pages Prompt

You get a runnable project for indie game pre-launch landing page — plan, complete code, demo data and run instructions — instead of disconnected code snippets.

CursorClaude CodeChatGPTGemini
🚀Landing PagesMedium
Coding Agents

SaaS analytics product landing page — Landing Pages Prompt

You get a runnable project for SaaS analytics product landing page — plan, complete code, demo data and run instructions — instead of disconnected code snippets.

CursorClaude CodeChatGPTGemini
🚀Landing PagesAdvanced
Coding Agents

Artisan bakery landing page — Landing Pages Prompt

You get a runnable project for artisan bakery landing page — plan, complete code, demo data and run instructions — instead of disconnected code snippets.

CursorClaude CodeChatGPTGemini