In this video, we walk through how to use the built-in integrated browser to do web development inside VS Code. Attach the browser tab or even UI elements to agent sessions to provide the most context to your agent. You can do all of your web development work without ever having to leave the editor.

🔎 Chapters:
00:00 Intro Integrated Browser
00:21 Demo
05:29 Recap
06:02 Wrap

🎙️ Featuring: Kayla Cinnamon (@cinnamon_msft)

📲 Follow VS Code:
* X: https://x.com/code
* Bluesky: https://bsky.app/profile/vscode.dev
* LinkedIn: https://aka.ms/VSCode/LinkedIn
* GitHub: https://github.com/microsoft/vscode

#vscode #visualstudiocode #code

Visual Studio Code is a lightweight and powerful code editor developed by Microsoft, offering built-in support for multiple programming languages, debugging, and extensions. From this resource developers can learn about VSCode's features, extensions, and customization options to enhance their coding productivity and workflow.

Visual Studio Code

VS Code now includes an integrated browser that lets web developers preview and debug their apps without switching to an external browser. You can open it via the command palette or keyboard shortcuts, configure it to automatically open localhost links, and run multiple browser tabs side by side. A key feature is the ability to share the browser tab or individual page elements directly with GitHub Copilot as context, allowing the AI agent to take screenshots, make UI changes, and iterate in real time. The integrated browser also includes standard developer tools accessible via F12 for manual inspection and debugging.

VS Code’s Integrated Browser: Faster Web Development Without Leaving the Editor