Quickstart: Complete your first task with an agent

In this quickstart, you use an AI agent in Visual Studio Code to build a small web app from a natural-language prompt. You can work in the Agents window for an agent-first experience or use the Chat view alongside your code. You then review the generated code and use browser tools to let the agent validate the app.

Prerequisites

Create a project folder

On your computer, create an empty folder named agent-quickstart. The agent creates all the files for the app in this folder.

Build the app

Choose where you want to work with the agent. Both options create the same app and give you access to the same session.

The Agents window (Preview) is a dedicated window for assigning tasks and monitoring agents across your projects.

In VS Code, select Open in Agents in the title bar.

You can also run Chat: Open Agents Window from the Command Palette (⇧⌘P (Windows, Linux Ctrl+Shift+P)).
Select New at the top of the sidebar.
From the workspace dropdown, select the agent-quickstart folder.

If VS Code asks whether you trust the folder, select Yes, I trust the authors.
Select the Copilot agent harness and the Agent role. Keep Default Approvals selected so that VS Code asks before the agent runs actions that require approval.

Enter the following prompt and press Enter:

Create a task list web app in a single index.html file with embedded CSS and JavaScript. Let me add, complete, and delete tasks. Save the tasks in local storage so they persist after a page reload. Use no external libraries.

Follow the agent's progress and review any approval requests before you accept them.

The Chat view keeps the agent beside your editor, which is useful when you want to inspect and work with the generated code.

In VS Code, select File > Open Folder, and then open the agent-quickstart folder.

If VS Code asks whether you trust the folder, select Yes, I trust the authors.
Open the Chat view with ⌃⌘I (Windows, Linux Ctrl+Alt+I), and then select New Chat (+).
Select the Copilot agent harness and the Agent role. Keep Default Approvals selected so that VS Code asks before the agent runs actions that require approval.

Enter the following prompt and press Enter:

Create a task list web app in a single index.html file with embedded CSS and JavaScript. Let me add, complete, and delete tasks. Save the tasks in local storage so they persist after a page reload. Use no external libraries.

Follow the agent's progress and review any approval requests before you accept them.

The agent creates index.html and reports when the task is complete.

Review and validate the result

AI-generated code can contain mistakes. Review the code, ask the agent to validate the app in the integrated browser, and manually confirm the result before you keep it.

Open the Changes panel and select index.html to review the generated code.
Select Customizations > Tools and verify that Integrated Browser is selected.

Enter the following prompt:

Open index.html in the integrated browser and validate the app.
Add a task, mark it complete, and delete it. Then add another task,
reload the page, and verify that the task persists. If any step fails,
fix the issue and repeat the complete flow.

Review the agent's tool calls, code changes, and verification report.
In the Files panel, right-click index.html, and then select Open in Integrated Browser. Manually try the task flow to confirm the result.

Select index.html in the agent response to review the generated code and its diff.
In the Chat view, select Open Customizations (gear icon) > Tools and verify that Integrated Browser is selected.

Enter the following prompt:

Open index.html in the integrated browser and validate the app.
Add a task, mark it complete, and delete it. Then add another task,
reload the page, and verify that the task persists. If any step fails,
fix the issue and repeat the complete flow.

Review the agent's tool calls, code changes, and verification report.
Open index.html from the Explorer, and then select Open in Integrated Browser in the editor title bar. Manually try the task flow to confirm the result.

You have completed your first task with an agent. The agent interpreted your goal, created the code, exercised the app in the browser, and fixed any issues it found. You stayed in control through approvals, code review, and final validation.

Continue in the other surface

The Agents window and Chat view share the same agent sessions, so you can switch between them without losing the conversation.

From the Agents window, select Open in Editor in the title bar. VS Code opens the project in an editor window with the session available in the Chat view.
From the Chat view, select Open in Agents in the title bar. The Agents window opens with the same session selected.

Next steps

8/12/2026