Walkthrough · Project build
Ship your first web project
Stack
Choose tools that stay out of your way. Nothing here is forever.
For a first project, the tools matter much less than picking some and moving on. Use Next.js to build the site, Tailwind to style it, and Vercel to put it online. Skip the database unless your idea really needs to save something. A list of recipes can live in a file just fine. In your terminal, go to your projects folder first with cd ~/projects, then run:
bash
npx create-next-app@latest my-projectWhat you should see
npm asks Ok to proceed? Press y. Then one question: Would you like to use the recommended Next.js defaults? Pick Yes, use recommended defaults. That gives you TypeScript, Tailwind and the App Router in one go. Installing takes a minute or two and ends with Success! Created my-project.bash
cd my-project
npm run devWhat you should see
A few lines, including Local: http://localhost:3000. Open that address in your browser. The first load takes a few seconds while it builds, then you see the Next.js starter page. To stop the server later, press Ctrl+C.Stuck? Pick a prompt and ask your AI tool
I am setting up my first Next.js project and something went wrong. The command I ran: [paste the command] What I saw: [paste the full error message] My computer: [Windows, Mac or Linux] Explain in plain words what the error means, then give me the exact steps to fix it, one at a time. Assume I am a beginner.
Open it in your AI tool. Clicking copies the prompt, and ChatGPT and Grok open with it already filled in.
- Claude(opens in a new tab)
- ChatGPT(opens in a new tab)
- Qwen(opens in a new tab)
- DeepSeek(opens in a new tab)
- Kimi(opens in a new tab)
- Grok(opens in a new tab)
More tools
App builders, in your browser:
Code editors on your computer. Open app only works once it is installed, so use Get it first if you do not have it.
- CursorOpen appGet it(opens in a new tab)
- VS CodeOpen appGet it(opens in a new tab)
- Antigravity IDEOpen appGet it(opens in a new tab)
- Antigravity 2.0Open appGet it(opens in a new tab)
Want the full list? Browse all app builders and coding editors (IDEs).
- Created the project with create-next-app
- Saw the starter page at localhost:3000
- Changed some text in app/page.tsx and watched it update by itself
- Sign in to tick these off and pick up where you left them.
Tools used in this build
Everything this walkthrough reaches for, with the directory entry for each.