microsoft · Copilot · Nov 22, 2025 · Nov 22, 2025 · Nov 22, 2025 · Nov 22, 2025
@@ -90,26 +90,71 @@ export const sidebarTopics: StarlightSidebarTopicsUserConfig = [
         },
         items: [
           {
-            label: "Prerequisites",
+            label: 'Setup and tooling',
             translations: {
-              da: "Forudsætninger",
-              de: "Voraussetzungen",
-              en: "Prerequisites",
-              es: "Requisitos previos",
-              fr: "Prérequis",
-              hi: "पूर्वापेक्षाएँ",
-              id: "Prasyarat",
-              it: "Prerequisiti",
-              ja: "前提条件",
-              ko: "전제 조건",
-              "pt-BR": "Pré-requisitos",
-              "pt-PT": "Pré-requisitos",
-              ru: "Предварительные требования",
-              tr: "Ön koşullar",
-              uk: "Попередні вимоги",
-              "zh-CN": "先决条件",
+              da: 'Opsætning og værktøjer',
+              de: 'Einrichtung und Werkzeuge',
+              en: 'Setup and tooling',
+              es: 'Configuración y herramientas',
+              fr: 'Configuration et outils',
+              hi: 'सेटअप और टूलिंग',
+              id: 'Pengaturan dan alat',
+              it: 'Configurazione e strumenti',
+              ja: 'セットアップとツール',
+              ko: '설정 및 도구',
+              'pt-BR': 'Configuração e ferramentas',
+              'pt-PT': 'Configuração e ferramentas',
+              ru: 'Настройка и инструменты',
+              tr: 'Kurulum ve araçlar',
+              uk: 'Налаштування та інструменти',
+              'zh-CN': '设置和工具',
             },
-            slug: "get-started/prerequisites",
+            items: [
+              {
+                label: 'Prerequisites',
+                translations: {
+                  da: "Forudsætninger",
+                  de: "Voraussetzungen",
+                  en: "Prerequisites",
+                  es: "Requisitos previos",
+                  fr: "Prérequis",
+                  hi: "पूर्वापेक्षाएँ",
+                  id: "Prasyarat",
+                  it: "Prerequisiti",
+                  ja: "前提条件",
+                  ko: "전제 조건",
+                  "pt-BR": "Pré-requisitos",
+                  "pt-PT": "Pré-requisitos",
+                  ru: "Предварительные требования",
+                  tr: "Ön koşullar",
+                  uk: "Попередні вимоги",
+                  "zh-CN": "先决条件",
+                },
+                slug: 'get-started/prerequisites'
+              },
+              {
+                label: 'Dev environment',
+                translations: {
+                  da: 'Udviklingsmiljø',
+                  de: 'Entwicklungsumgebung',
+                  en: 'Dev environment',
+                  es: 'Entorno de desarrollo',
+                  fr: 'Environnement de développement',
+                  hi: 'डेव वातावरण',
+                  id: 'Lingkungan pengembangan',
+                  it: 'Ambiente di sviluppo',
+                  ja: '開発環境',
+                  ko: '개발 환경',
+                  'pt-BR': 'Ambiente de desenvolvimento',
+                  'pt-PT': 'Ambiente de desenvolvimento',
+                  ru: 'Среда разработки',
+                  tr: 'Geliştirme ortamı',
+                  uk: 'Середовище розробки',
+                  'zh-CN': '开发环境',
+                },
+                slug: 'get-started/dev-environment'
+              },
+            ]
           },
           {
             label: "Install CLI",

@@ -0,0 +1,241 @@
+---
+title: Dev environment
+description: Learn about different development environments and IDEs for Aspire.
+lastUpdated: true
+prev: false
+tableOfContents:
+  maxHeadingLevel: 2
+---
+
+import { Aside, Steps, Tabs } from '@astrojs/starlight/components';
+import { Kbd } from 'starlight-kbd/components'
+import PivotSelector from '@components/PivotSelector.astro';
+import Pivot from '@components/Pivot.astro';
+
+Aspire supports multiple integrated development environments (IDEs) and code editors. Choose the environment that best fits your workflow and platform.<br/><br/>
+
+<PivotSelector
+    title="Select your development environment"
+    key="ide"
+    options={[
+        { id: "vscode", title: "Visual Studio Code" },
+        { id: "vs", title: "Visual Studio" },
+        { id: "rider", title: "JetBrains Rider" }
+    ]}
+/>
+
+<Pivot id="vscode">
+
+[Visual Studio Code](https://code.visualstudio.com/) is a lightweight, cross-platform code editor that works on Windows, macOS, and Linux. It provides excellent support for C# development and Aspire applications.
+
+</Pivot>
+<Pivot id="vs">
+
+[Visual Studio](https://visualstudio.microsoft.com/vs/) is a comprehensive IDE for Windows and macOS that provides full-featured development tools for .NET applications.
+
+</Pivot>
+<Pivot id="rider">
+
+[JetBrains Rider](https://www.jetbrains.com/rider/) is a powerful, cross-platform IDE for .NET development available on Windows, macOS, and Linux.
+
+</Pivot>
+
+## Installation
+
+<Pivot id="vscode">
+
+<Steps>
+1. Download and install [Visual Studio Code](https://code.visualstudio.com/download) for your platform.
+</Steps>
+
+</Pivot>
+<Pivot id="vs">
+
+<Steps>
+1. Download [Visual Studio 2026](https://visualstudio.microsoft.com/downloads/)
+2. During installation, select the **ASP.NET and web development** workload
+</Steps>
+
+</Pivot>
+<Pivot id="rider">
+
+<Steps>
+1. Download and install [JetBrains Rider](https://www.jetbrains.com/rider/download/)
+2. Ensure you have at least Rider 2024.1 or later for best Aspire support
+</Steps>
+
+</Pivot>
+
+## Setup
+
+<Pivot id="vscode">
+
+Install the following extensions to work with Aspire in Visual Studio Code:
+
+### C# Dev Kit
+
+The [C# Dev Kit extension](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csdevkit) provides comprehensive C# language support, including:
+
+- IntelliSense for code completion
+- Debugging capabilities
+- Project management
+- Testing integration
+
+To install:
+
+<Steps>
+1. Open Visual Studio Code
+2. Go to the Extensions view (<Kbd windows="Ctrl+Shift+X" mac="Cmd+Shift+X" />)
+3. Search for "C# Dev Kit"
+4. Click **Install**
+</Steps>
+
+### Aspire extension
+
+The [Aspire extension for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=microsoft-aspire.aspire-vscode) provides Aspire-specific features:
+
+- **Run and debug** Aspire applications directly from VS Code
+- **Dashboard integration** to view and manage your application resources
+- **IntelliSense** for Aspire APIs and configuration
+- **Project templates** for creating new Aspire applications
+- **Code snippets** for common Aspire patterns
+
+To install:
+
+<Steps>
+1. Open Visual Studio Code
+2. Go to the Extensions view (<Kbd windows="Ctrl+Shift+X" mac="Cmd+Shift+X" />)
+3. Search for "Aspire"
+4. Click **Install**
+</Steps>
+
+</Pivot>
+<Pivot id="vs">
+
+Visual Studio doesn't require any additional setup.
+
+</Pivot>
+<Pivot id="rider">
+
+Install the [Aspire plugin](https://plugins.jetbrains.com/plugin/23289--net-aspire) to get enhanced Aspire support:
+
+<Steps>
+1. Open Rider
+2. Go to **File** > **Settings** (or **Rider** > **Preferences** on macOS)
+3. Navigate to **Plugins**
+4. Search for "Aspire"
+5. Click **Install**
+6. Restart Rider
+</Steps>
+
+</Pivot>
+
+## Features
+
+<Pivot id="vscode">
+
+The Aspire extension for Visual Studio Code provides:
+
+- **Run and debug** capabilities for Aspire applications
+- **Dashboard integration** to view and manage resources
+- **IntelliSense** for Aspire APIs and configuration
+- **Project templates** for creating new applications
+- **Code snippets** for common patterns
+
+</Pivot>
+<Pivot id="vs">
+
+Visual Studio provides integrated support for Aspire development:
+
+- **Project templates** for creating Aspire applications
+- **Solution Explorer** integration for managing Aspire projects
+- **Debugging** with full breakpoint and diagnostic support
+- **Dashboard integration** that launches automatically when you run an AppHost
+- **IntelliSense** for Aspire APIs
+- **NuGet package management** for Aspire integrations
+- **Docker integration** for container management
+
+</Pivot>
+<Pivot id="rider">
+
+The Aspire plugin provides:
+
+- **Run configurations** for AppHost projects
+- **Dashboard integration** that launches when running an AppHost
+- **Project templates** for creating Aspire applications
+- **Code completion** for Aspire APIs
+- **Debugging support** for Aspire services
+- **Resource monitoring** in the IDE
+
+</Pivot>
+
+## Getting started
+
+<Pivot id="vscode">
+
+Once you have the extensions installed:
+
+<Steps>
+1. Open your Aspire solution folder in Visual Studio Code
+2. The Aspire extension will detect your AppHost project
+3. Use the **Run and Debug** panel to start your application
+4. The Aspire dashboard will open automatically in your browser
+5. Set breakpoints and debug your services as needed
+</Steps>
+
+<Aside type="tip">
+The Aspire extension provides commands accessible via the Command Palette (<Kbd windows="Ctrl+Shift+P" mac="Cmd+Shift+P" />). Type "Aspire" to see all available commands.
+</Aside>
+
+</Pivot>
+
+<Pivot id="vs">
+
+<Steps>
+1. Create a new Aspire application:
+   - Go to **File** > **New** > **Project**
+   - Search for "Aspire"
+   - Select **Aspire Starter Application** or **Aspire Empty App**
+   - Configure your project settings and click **Create**
+
+2. Run your application:
+   - Press <Kbd windows="F5" /> or click the **Start** button
+   - The Aspire dashboard opens automatically
+   - All configured services start and are visible in the dashboard
+
+3. Debug your services:
+   - Set breakpoints in your service code
+   - The debugger attaches to all .NET projects automatically
+   - Use the Debug toolbar to step through code and inspect variables
+</Steps>
+
+<Aside type="note">
+Visual Studio is available on both Windows and macOS. The macOS version provides .NET development capabilities, though some features may differ from the Windows version.
+</Aside>
+
+</Pivot>
+<Pivot id="rider">
+
+<Steps>
+1. Open your Aspire solution in Rider
+2. The IDE automatically detects the AppHost project
+3. Select the AppHost project in the run configurations dropdown
+4. Click the **Run** or **Debug** button
+5. The Aspire dashboard opens automatically
+</Steps>
+
+<Aside type="tip">
+Rider's powerful refactoring and code analysis features work seamlessly with Aspire projects, helping you maintain clean, well-structured code.
+</Aside>
+
+</Pivot>
+
+## Next steps
+
+After setting up your development environment:
+
+<Steps>
+1. Complete the [Prerequisites](/get-started/prerequisites/) to ensure all required tools are installed
+2. [Build your first Aspire app](/get-started/first-app/) to learn the basics
+3. Explore the [Aspire dashboard](/dashboard/overview/) to monitor and manage your applications
+</Steps>
@@ -10,6 +10,7 @@ prev: false
 ---
 
 import { Aside, Icon, Code, CardGrid, Card, LinkCard, LinkButton, Steps, Tabs, TabItem } from '@astrojs/starlight/components';
+import LearnMore from '@components/LearnMore.astro';
 import IconAside from '@components/IconAside.astro';
 import IconLinkCard from '@components/IconLinkCard.astro';
 import CodespacesButton from '@components/CodespacesButton.astro';
@@ -65,7 +66,10 @@ Ready to dive into Aspire? Before you begin, make sure your development environm
 
     - [Visual Studio](https://visualstudio.microsoft.com/vs/): A full-featured IDE for C# development with debugging, IntelliSense, and Git support.
     - [JetBrains Rider](https://plugins.jetbrains.com/plugin/23289--net-aspire): A powerful, cross-platform C# IDE with advanced features like code analysis, refactoring, and debugging.
-    <br/>
+
+    <LearnMore>
+    To learn more, see [setting up your dev environment](/get-started/dev-environment/).
+    </LearnMore>
 
 1. #### Consider alternatives to local installation