How to Build Apps with Claude Code in Cursor

TL;DR

Install Claude Code in Cursor by opening its terminal, running “npm install -g @anthropic-ai/claude-code,” logging in, and entering “claude.” Start a project by describing the app in plain language, then review and approve the proposed steps. A planning workflow and a Claude.MD rules file can keep tasks simple, organized, and easier to monitor.

Transcript

you are about to gain AI superpowers What I'm going to show you in this video is the AI tool taking the world by storm Claude Code Even if you've never written a line of code before in your life by the end of these 15 minutes you're going to be able to build and launch money-making apps faster than you can imagine By the end of this video you'll be... Read More

Key Insights

• Claude Code is a terminal-based AI coding tool that accepts plain-language instructions, plans development work, and builds applications. The presenter describes it as more autonomous than Cursor’s built-in agent because it can complete substantial work without requiring the user to supervise every individual step.
• Cursor is the recommended environment for running Claude Code because its integrated terminal keeps the AI conversation beside the project files. This arrangement also lets users watch code changes in real time and combine Claude Code with other AI functionality available in the editor.
• Claude Code installation begins by running “npm install -g @anthropic-ai/claude-code” in a terminal. After installation, the user logs in so the service can identify the selected plan, then types “claude” and presses Enter to begin a Claude Code session.
• Claude pricing in the presentation includes a $17 monthly Pro plan and Max plans priced at $100 and $200 per month. The Pro plan provides Sonnet 4, while both Max plans provide Opus 4, with the $200 option offering substantially more usage.
• The recommended starting plan is the $17 monthly Pro tier for people who are testing Claude Code. The presenter says Sonnet 4 is sufficient for getting started, while users who code regularly can later move to a Max plan for Opus 4 and higher usage.
• The sample application is a Next.js calendar that displays a weekly view and allows users to create events with dates and times. The prompt also requests an attractive design, demonstrating that functional and visual requirements can be expressed together through ordinary language.
• Claude Code breaks a broad application request into a list of smaller tasks before executing it. The presenter contrasts this behavior with attempting the entire request in one pass and argues that the task-based approach produces better results by giving the work a structured sequence.
• A Claude.MD rules file can define a repeatable project workflow: inspect relevant files, create a todo.md plan, request approval, complete items individually, report high-level changes, minimize complexity, and finish with a review section summarizing the completed work.

Questions & Answers

Q: How do you install Claude Code inside Cursor?

Open a new project or folder in Cursor, then open the integrated terminal with Control and the tilde key on a Mac. Paste “npm install -g @anthropic-ai/claude-code” into the terminal and press Enter. When installation finishes, log in so Claude Code can identify your plan. Finally, enter “claude” in the terminal and press Enter to start a session.

Q: Why run Claude Code in Cursor instead of a separate terminal?

Running Claude Code inside Cursor places the terminal conversation beside the project’s source files. The presenter recommends this setup because users can see code changing in real time while Claude works. It also makes it possible to combine Claude Code with Cursor’s other AI features. Moving the terminal panel to the right provides more room to view the complete conversation.

Q: Which Claude plan should a beginner choose?

The presenter recommends starting with the $17 monthly Pro plan when testing Claude Code. It includes access to Sonnet 4, which the presenter considers capable enough for initial projects. The $100 and $200 Max plans provide access to Opus 4. The $200 plan mainly offers more usage and is presented as suitable for someone coding for many hours each day.

Q: How do you start building an app with Claude Code?

Create or open an empty project, start Claude Code in the terminal, and describe the desired application as if assigning work to an engineer. The demonstration requests a Next.js calendar with a weekly view, event creation, assigned dates and times, and an attractive appearance. Claude Code then begins setting up the project, creates tasks, and asks for approval before proceeding with actions.

Q: What app does the Claude Code tutorial build?

The tutorial begins building a calendar application with Next.js, which the presenter identifies as a popular web application technology. The requested interface shows a calendar view of the current week. Users should be able to create events and assign dates and times to them. The prompt also asks Claude Code to make the application visually attractive, combining design and functionality in one request.

Q: Why does Claude Code create a to-do list before coding?

Claude Code creates a to-do list to divide a broad request into smaller pieces that can be completed in sequence. The presenter argues that trying to complete an entire application in one pass makes mistakes more likely. By planning individual tasks and executing them separately, Claude Code gives the work a visible structure and allows the user to follow or approve its progress.

Q: What should a Claude.MD workflow tell Claude Code to do?

The supplied Claude.MD workflow tells Claude Code to inspect the codebase, think through the problem, and write a plan in todo.md. The plan should contain checkable tasks and be shown to the user for approval before implementation begins. Claude should mark items complete, explain changes at a high level, keep every change simple and limited, and add a final review section.

Q: How can beginners control Claude Code while it works?

Beginners can review the task list and approve each proposed action when Claude Code asks whether it should proceed. The supplied rules file adds another checkpoint by requiring Claude to present its plan before making changes. It also requires high-level progress explanations and checked-off tasks. The presenter mentions a mode that stops repeated approval requests, but demonstrates explicit approval for the tutorial.

Summary & Key Takeaways

• Claude Code lets users request application development through plain-language commands entered in a computer terminal. The presenter recommends running it inside Cursor because the editor displays code changes as they happen and allows Claude Code to be used alongside Cursor features. The tool can plan tasks, edit files, and maintain project context.

• The setup process starts with a Claude plan and the free tier of Cursor. Inside a new Cursor project, opening the integrated terminal and running “npm install -g @anthropic-ai/claude-code” installs the tool. After logging in, entering “claude” starts Claude Code, and the terminal panel can be moved to the right.

• The demonstration begins with an empty project and a request for a Next.js calendar app that shows the current week and supports events with assigned dates and times. Claude Code creates a task list instead of attempting everything in one pass. The supplied Claude.MD workflow adds planning, approval, progress tracking, simplicity, and review.