In this workshop, you build a small landing page generator with Next.js and Claude Code. You focus on workflow planning, clear tasks, and how to use Claude as a steady helper during development.
What You Build
You create a simple front-end tool that generates marketing pages. You work with a basic Next.js setup and use Claude Code to guide tasks and support your workflow.
Skills You Practice
Project Setup
- Start a project with the ShadCN Next.js template
- Work in Cursor IDE with Claude Code support
- Set up Git with commits, branches, and a private repo
Claude Code Setup
- Pick a model for your work, such as Sonnet or Opus
- Create the rules file cloud.md
- Add settings.local.json for local setup
Task Planning with AI
Create a Simple Plan
You make a to-do.md file. Then Claude helps you turn it into a clear task list.
Use Claude for Step Work
- Reads your project structure
- Updates or builds cloud.md rules
- Generates a detailed task list
- Acts as an agent to follow each step
- Uses fast Sonnet tasks when you need quick results
Why This Approach Helps
You learn how to use Claude Code as part of a real workflow, not as a shortcut. This workshop shows how AI can support code work, task planning, and simple project management in one place.
