Setup flow
Backbone
Give the coding agent one strict task to implement the project backbone.
What you need before starting
- Make sure the setup docs are present in the repo.
- Use one strict implementation prompt instead of multiple loose asks.
Files the agent must read
Require the setup docs in order before implementation begins.
- 1. AGENTS.md
- 2. docs/brief.md
- 3. docs/sitemap.md
- 4. docs/ui-system.md
- 5. docs/ux-rules.md
- 6. docs/content-model.md
Backbone prompt
Use one strict implementation prompt so the coding pass stays inside scope.
Prompt for implementing the backbone
Read these files first and follow them strictly, in this exact order:
1. AGENTS.md
2. docs/brief.md
3. docs/sitemap.md
4. docs/ui-system.md
5. docs/ux-rules.md
6. docs/content-model.md
Context:
This repo is for App Setup Flow.
It is a guided setup tool for starting new Next.js web app projects properly.
It is NOT a marketing site.
It is NOT a generic documentation site.
It is a task-focused workflow product.
Project input:
- repo name: app-setup-flow
- folder name: app-setup-flow
- one-line description: A guided setup tool for starting Next.js web app projects with exact steps, prompts, and done states.
- target audience: The product creator setting up new web app foundations.
- primary goal: Move from app idea to an agent-ready Next.js backbone.
- primary visitor action: Walk the flow phase by phase and copy the required commands and prompts.
Secondary actions:
Refine the project brief
Review generated outputs
Verify the backbone locally
Routes/pages:
/
/setup/intake
/setup/scaffold
/setup/docs
/setup/files
/setup/backbone
/setup/verify
Visual direction:
Warm off-white background, white and cool-tinted cards, anthracite text, light blue accents, subtle borders, subtle shadows.
UX rules:
Mobile first
Visible input labels
Copy buttons must be obvious
Current phase stays visible
Every setup page includes previous and next navigation
Constraints:
Next.js App Router
TypeScript
Tailwind CSS
Vercel
No auth in v1
No backend in v1
No analytics in v1
No CMS in v1
Required shared components:
Header
Footer
Container
Section
Card
Button
Input
Textarea
Phase progress nav
Code block with copy button
Prompt block with copy button
Checklist
Required UI states:
Default
Hover
Focus
Active phase
Empty context notice
Checklist complete state
Definition of done:
All main routes exist
Global layout exists
Shared UI primitives exist
Commands and prompts are easy to copy on mobile
The foundation can be refined without redesigning the structure
Task:
Implement the backbone v1 of this Next.js site on top of the existing scaffold.
Scope:
- Create only the required routes.
- Add the global layout, stable header, stable footer, container, and section wrapper.
- Create reusable shared components for the setup flow.
- Wire the intake page to labeled inputs.
- Reflect project context values into generated command and prompt blocks where applicable.
- Use local static TypeScript data only.
- Do not add backend, persistence, auth, analytics, CMS, extra routes, or extra product features.
Validation:
- npm run lint
- npx tsc --noEmit
- npm run build
Output:
- changed files listed
- short explanationIn scope
Keep the implementation focused on the requested v1 backbone.
- Required routes only: / and the six setup pages
- Global layout, stable header, stable footer, container, and section wrapper
- Reusable shared components for forms, cards, progress, copy blocks, and checklists
- Local project context wired through the intake inputs and generated outputs
- Warm light visual system with subtle borders and shadows
Out of scope
Avoid adding product or platform work that belongs outside this pass.
- Extra routes or feature areas
- Backend, persistence, auth, analytics, or CMS work
- Marketing heroes, dashboards, fake metrics, or decorative illustrations
- Dark theme, loud gradients, or non-essential animation
- Template marketplace, account areas, pricing, blog, or search flows
Validation commands
Run the fixed checks after the coding pass.
Run the required validation checks
npm run lint
npx tsc --noEmit
npm run build