One prompt, many files

1. One prompt, many files

Hi! In this video, we’ll explore Cursor Agent: the assistant that can complete complex coding tasks independently, run terminal commands, and edit code.

2. One prompt, many files

We’ll continue with our Portfolio App and take it one step further — by converting it into a Next.js application that runs locally in our browser. Before we start, think about what usually makes multi-file edits tricky: keeping files consistent and avoiding broken imports. The Cursor Agent helps solve that.

3. One prompt, many files

Let’s open the Cursor Agent by pressing Cmd + I and choosing the agent from the modes dropdown. The Agent is our AI coding partner — it can edit code, run terminal commands, create new files, and apply coordinated changes across our whole project. Let’s start by asking the Cursor Agent to convert our static portfolio into a Next.js app. We’ll give a prompt. When Agent generates code changes, they're presented in a review interface in the diff format that shows additions and deletions with color-coded lines: red lines show deleted code snippets and green ones are the code blocks suggested by the agent. This allows us to examine, approve, or reject which changes are applied to our codebase.

4. Multi-file orchestration

Agent automatically creates the Next.js folder structure, sets up pages, and

5. Multi-file orchestration

migrates our existing

6. Multi-file orchestration

HTML and CSS into React components.

7. Multi-file orchestration

This is called multi-file orchestration, meaning the Agent understands relationships between files and applies consistent changes across all of them.

8. Tracking project state

Before applying any new change, the agent creates a checkpoint — a snapshot of our project’s state. We can review diffs, see what’s been modified, and restore a previous version anytime.

9. Auto Context and Indexing

This continuous learning is called codebase indexing: Cursor’s way of building a live mental model of our project.

10. Auto Context and Indexing

In our new Next.js app, this process builds a semantic map of the codebase so the Agent can reason about components, imports, and routes. That’s why when we later give a prompt like: “Add a footer component across all pages” The agent knows exactly where to update imports and apply changes, without us writing a single path manually.

11. Running commands in the terminal

Next, let’s get our app running.

12. Running commands in the terminal

We’ll ask the Cursor agent: “Run the development server to run the project” The agent uses terminal integration to execute commands directly without the need for any copy-pasting or switching tabs. It installs Next.js, sets up the environment, and launches the local server. And just like that, our portfolio app is now live on localhost. This is how the Agent Mode inside Cursor Agent transforms the way we build. We started with a simple HTML portfolio, and with just a few grounded prompts, we turned it into a working Next.js app, ran it locally, and verified it visually — all from within Cursor.

13. Let's practice!

Let's practice multi-files changes!

Create Your Free Account

By continuing, you accept our Terms of Use, our Privacy Policy and that your data is stored in the USA.