radius-project · zachcasper · Aug 20, 2026
@@ -68,6 +68,13 @@
         font-size: .6em;
     }
 
+    // When a foldable section is expanded its child links are visible, so if a
+    // child carries its own "New" badge, hide the parent section's badge to
+    // avoid showing the same "New" twice.
+    li:has(> ul .sidebar-new-badge) > input:checked + label .sidebar-new-badge {
+        display: none;
+    }
+
     a {
         font-size: .9rem;
         &:hover {

@@ -16,6 +16,6 @@ This guide will show you how to quickly get started with Radius. You will do a b
 
 ## Organization
 
-This guide is organized into four sequential parts.
+This guide is organized into five sequential parts.
 
 {{< button text="Get started: Install Radius" page="getting-started/install-radius" >}}
@@ -68,6 +68,6 @@ rad uninstall kubernetes --purge
 
 ## Next steps
 
-You have installed Radius, deployed the Radius Demo application, and connected it to a PostgreSQL database. Continue with the hands-on labs for deeper, real-world scenarios.
+You have installed Radius, deployed the Radius Demo application, and connected it to a PostgreSQL database. Next, use the GitHub Copilot app to model and deploy an application directly from your source code repository.
 
-{{< button text="Next step: Explore the labs" page="getting-started/labs" >}}
+{{< button text="Next step: Use the GitHub Copilot app" page="getting-started/try-github-copilot-app" >}}
@@ -8,7 +8,7 @@ weight: 100
 
 In part one, you will install Radius on an existing Kubernetes cluster.
 
-## Prerequisites
+## Before you begin
 
 For this guide you only need a **Kubernetes cluster**. To install Radius, your user must have the cluster-admin role. Radius <a href="{{< ref "installation#supported-kubernetes-clusters" >}}">supports</a> <a href="https://azure.microsoft.com/en-us/products/kubernetes-service">AKS</a>, <a href="https://aws.amazon.com/eks/">EKS</a>, <a href="https://k3d.io/">k3d</a>, and <a href="https://kind.sigs.k8s.io/">kind</a> clusters. Running a local cluster with k3d or kind is recommended.
 

@@ -1,9 +1,9 @@
 ---
 type: docs
-title: "4. Hands-on labs"
-linkTitle: "4. Hands-on labs"
+title: "5. Hands-on labs"
+linkTitle: "5. Hands-on labs"
 description: "Hands-on, scenario-based labs for Radius"
-weight: 400
+weight: 500
 ---
 
 Now that you have installed Radius and deployed an application, work through the hands-on labs for deeper, real-world scenarios. Each lab is a self-contained project with source code and step-by-step instructions.

@@ -1,13 +1,25 @@
 ---
 type: docs
-title: "Model, visualize, and deploy applications using Radius Canvas extension"
-linkTitle: "Radius Canvas extension"
-weight: 2
-description: "Install the Radius Canvas extension to model, visualize, and deploy an application in the GitHub Copilot app"
+title: "4. Use the GitHub Copilot app"
+linkTitle: "4. Use the GitHub Copilot app"
+weight: 400
+description: "Install the Radius plugin and use it to model, visualize, and deploy an application in the GitHub Copilot app"
 hide_preview_release_banner: true
+aliases:
+  - /integrations/github-copilot-app/canvas-extension/
 ---
 
-## Prerequisites
+{{% alert title="Preview Release" color="warning" %}}
+Radius integration with the GitHub Copilot app is a preview release. It is only compatible with **containerized applications deployed to Azure**.
+{{% /alert %}}
+
+In this guide, you will install the Radius plugin for the GitHub Copilot app and use it to model, visualize, and deploy a containerized application to Azure, all from within the app.
+
+The Radius integration with the GitHub Copilot app is completely self-contained and separate from a standalone Radius installation. It runs Radius operations as GitHub Actions workflows in your repository. If you installed Radius on a Kubernetes cluster in the previous pages of this Getting Started guide, this integration does not use that control plane. You do not need a local `rad` installation or an existing Radius control plane to complete this guide.
+
+## Before you begin
+
+Make sure you have:
 
 - The latest version of the [GitHub Copilot app](https://docs.github.com/en/copilot/concepts/agents/github-copilot-app).
 - An Azure subscription.
@@ -39,117 +51,91 @@ You can use your own application or fork one of these open-source samples:
 
    {{< image src="open-add-marketplace-menu.png" alt="Plugins settings with the Install menu open and Add marketplace selected" width=800px >}}
 
-4. Enter `radius-project/ai-extensions`, and then select **Add marketplace**.
+4. Enter the following under **Add marketplace**:
+
+   ```text
+   radius-project/ai-extensions
+   ```
 
    {{< image src="add-radius-marketplace.png" alt="Add marketplace dialog with radius-project/ai-extensions entered as the marketplace source" width=800px >}}
 
-5. In the `radius-plugins` marketplace, install the `radius-edge` plugin.
+5. Expand the **`radius-plugins`** marketplace and install the `radius-edge` plugin.
 
    {{< image src="install-radius-plugin.png" alt="Radius plugins marketplace showing the radius-edge plugin available to install" width=700px >}}
 
-6. Restart your Copilot session so the skills and canvas become available.
-
-The plugin bundles the Radius skills and canvas extension into one installation. After installation, use the plugin's three-dot menu to update or uninstall it.
-
-{{% alert title="Preview installation" color="info" %}}
-Adding the Radius marketplace manually is temporary. When the extension is released for public preview, the plugin will be available from the `awesome-copilot` marketplace.
-{{% /alert %}}
+6. Restart your Copilot session so the skills and the Radius Canvas extension become available.
 
 ## Step 2: Model your Application
 
 1. Create a new Copilot session. Select **GitHub repository**, and then add the repository you want to model.
 
-   {{< image src="select-github-repository.png" alt="GitHub Copilot App menu for starting a session from a GitHub repository" width=500px >}}
-
-2. In the chat, enter **Show me the application graph**.
+   {{< image src="select-github-repository.png" alt="GitHub Copilot app menu for starting a session from a GitHub repository" width=500px class="d-block mb-4" >}}
 
-   {{< image src="prompt-application-graph.png" alt="GitHub Copilot App chat prompt asking Copilot to show the application graph" width=800px >}}
+2. In the chat, type:
 
-   Copilot runs the Radius app-modeling skill. The skill analyzes your source code, manifests, and Dockerfiles, identifies your workloads and their dependencies, generates a Radius Application definition, and writes it into your repository. The canvas opens and renders the definition as an interactive Application graph.
+   ```text
+   Show me the application graph
+   ```
 
-   {{< image src="modeled-application-graph-create-environment.png" alt="Radius Canvas Modeled graph with the Create Environment action" width=800px >}}
+   Copilot analyzes your source code, manifests, and Dockerfiles, identifies your workloads and their dependencies, and generates an application definition. It writes the definition to `.radius/app.bicep` in your repository, creating the `.radius/` directory if it does not already exist. The Radius panel opens and renders the definition as an interactive Application graph.
 
-   {{% alert title="Canvas troubleshooting" color="info" %}}
-   If Radius Canvas does not open, ask Copilot to `Fix my Radius extension`. This invokes the Radius repair skill, which copies the required Canvas extension files into place.
-   {{% /alert %}}
-
-   The **Modeled** view visualizes the generated application definition `.radius/app.bicep` file. The graph represents the workloads, routes, backing services, and connections Radius identified in the repository.
-
-   Review the connections in the graph:
-
-   - Verify that all application workloads appear in the graph.
-   - Check that the graph includes the expected backing services and infrastructure dependencies.
-   - Ensure that the connections between resources accurately represent the application architecture.
-   - Select **View source code** to open the file where Radius detected the service or dependency.
-
-3. Select **Create Environment** next to the **Modeled** graph to begin configuring the Environment and planning the deployment.
+   The **Modeled** view visualizes the generated application definition `.radius/app.bicep` file. The graph represents the workloads, routes, backing services, and connections Radius identified in the repository. Select a resource on the graph and **View source code** to open the file where Radius detected the service or dependency.
 
 ## Step 3: Configure your Environment
 
-An Environment defines where your Application runs and the infrastructure available to it. After you select **Create Environment**, the canvas opens the environment configuration flow.
+An Environment defines where your Application is deployed to.
+
+1. Select **Create Environment** next to the **Modeled** graph to begin configuring the Environment and planning the deployment.
 
-1. Under **Choose Cloud credentials**, open the credential profile dropdown, and then select **Create new profile**.
+2. Under **Choose Cloud credentials**, open the credential profile dropdown, and then select **Create new profile**. A credential profile is a reusable, named set of cloud credentials—the provider, Azure tenant, and subscription—that Radius uses to authenticate to your cloud and establish OIDC trust with GitHub Actions.
 
-   {{< image src="choose-cloud-credentials.png" alt="Choose cloud credentials step with the option to create a credential profile" width=800px >}}
+   {{< image src="choose-cloud-credentials.png" alt="Choose cloud credentials step with the option to create a credential profile" width=800px class="d-block mb-4" >}}
 
-2. Enter a profile name, select **Azure** as the provider, and enter your Azure tenant ID and subscription.
+3. Enter a profile name, select **Azure** as the provider, enter your Azure tenant ID and subscription, then click **Verify credentials**.
 
-   {{< image src="create-azure-credential-profile.png" alt="Create Credential Profile form for an Azure tenant and subscription" width=800px >}}
+   {{< image src="create-azure-credential-profile.png" alt="Create Credential Profile form for an Azure tenant and subscription" width=800px class="d-block mb-4" >}}
 
-3. Select **Verify credentials**.
 4. After verification succeeds, select **Save and continue**.
-5. Next, enter a name for the environment and select the GitHub account and the saved credential profile under **Connect GitHub to a cloud**.
+5. Enter a name for the Environment and select the GitHub account and the saved credential profile under **Connect GitHub to a cloud**.
 
    {{< image src="connect-github-to-cloud.png" alt="Create Environment form connecting a GitHub account to an Azure credential profile" width=800px >}}
 
 6. Under **Deploy identity**, the Microsoft Entra app registration name is already populated.
-7. Under **Infrastructure**, select the Azure resource group and AKS cluster. Select an existing Kubernetes namespace or enter a namespace such as `my-app`.
-8. Select **Create the Environment**. You can follow the status of the Environment configuration.
-
-   {{< image src="environment-creation-progress.png" alt="Environment creation progress showing deploy identity authorization, configuration, and credential verification" width=800px >}}
-
-   Radius establishes OIDC trust with GitHub Actions, so deployment workflows authenticate with short-lived credentials instead of long-lived secrets stored in the repository.
+7. Under **Infrastructure**, select the Azure resource group and AKS cluster. Select an existing Kubernetes namespace or enter a new namespace.
+8. Select **Create the Environment**. Radius then configures OIDC authentication between GitHub Actions and Azure.
 
 ## Step 4: Plan the deployment
 
-When Environment configuration is complete, the canvas displays **View planned graph** that takes you the **Planned** graph view.
+When the Environment configuration is complete, the panel displays the **Planned** graph view.
 
 1. Confirm that the correct Application, branch, and Environment are selected.
 
-   {{< image src="planned-application-graph.png" alt="Radius Canvas Planned graph showing application workloads and supporting infrastructure" width=800px >}}
-
-2. Review the planned Application and supporting infrastructure.
-3. Confirm how Radius will deploy each workload and provide its infrastructure dependencies in the selected Environment.
+   {{< image src="planned-application-graph.png" alt="Radius Canvas Planned graph showing application workloads and supporting infrastructure" width=800px class="d-block mb-4" >}}
 
-Viewing the planned graph does not deploy or change cloud resources.
+2. Review the Planned graph to verify that it includes the expected Application resources, connections, and supporting infrastructure for the selected Environment.
+3. Select any resource on the graph to see additional details, such as its Radius resource type, its connections to other resources, and links to **View source code** where the resource is defined in your repository or **View app definition** to open its entry in `.radius/app.bicep`.
 
 ## Step 5: Deploy your Application
 
-Select **Deploy Application**.
+Select **Deploy Application** and the **Deployments** panel opens, where you can monitor deployment progress and open the GitHub Actions workflow run for more details. Radius dispatches a GitHub Actions workflow run that deploys the Application to the selected Environment and provisions the required infrastructure. The workflow is committed to your repository, so you review it before it runs and maintain it alongside your Application code.
 
-{{< image src="deploy-application.png" alt="Deployments view for selecting an Application, Environment, and branch to deploy" width=800px >}}
-
-The canvas opens the **Deployments** area, where you can monitor deployment progress and open the GitHub Actions run. Radius generates a GitHub Actions workflow that provisions the required infrastructure and deploys the Application to the selected Environment. The workflow is committed to your repository, so you review it before it runs and maintain it alongside your Application code.
+{{< image src="deploy-application.png" alt="Deployments view for selecting an Application, Environment, and branch to deploy" width=800px class="d-block mb-4" >}}
 
 When the deployment completes, return to the Application graph and open the **Deployed** view to see the Application and its resources running in the Environment.
 
 {{< image src="deployed-application-graph.png" alt="Deployed view of the application graph" width=800px >}}
 
 ## Step 6: Access your Application
 
-In the Copilot chat, enter **Access my deployed application**.
+In the Copilot chat, type:
 
-Copilot sets up port forwarding and provides a URL to access the deployed Application.
+```text
+Access my deployed application
+```
 
-## Step 7: Clean up
-
-1. In the **Deployments** view, select **Delete Deployment**, and then confirm the deletion.
-2. Monitor the deletion workflow until it completes. Radius deletes the Application and the infrastructure resources owned by it.
-3. If you no longer need the Radius Environment, open the **Environments** view and delete it.
-
-Deleting the Radius deployment or Environment does not delete the AKS cluster or Azure resource group.
+Copilot sets up port forwarding and provides a URL to access the deployed Application.
 
-## Compare Application changes
+## Step 7: Compare Application changes
 
 Make changes to your Application on a branch, and then open the **Diff** view to compare the updated Application against `main`.
 
@@ -162,10 +148,27 @@ You can generate a Markdown summary of the graph diff and post it as part of a p
 
 {{< image src="application-graph-diff.png" alt="Radius Canvas Diff view comparing application resources and connections between two branches" width=800px >}}
 
-## Report bugs and feedback
 
-Before opening an issue, check the [existing Radius AI extensions backlog](https://github.com/orgs/radius-project/projects/23/views/14?layout=table) for a matching report.
+## Step 8: Clean up
 
-Submit bugs and feedback with the [feedback or bug report form](https://github.com/radius-project/ai-extensions/issues/new?template=feedback-or-bug-report.yml). You can also open the form from the feedback button in the bottom right corner of the canvas extension.
+1. In the **Deployments** view, select **Delete Deployment**, and then confirm the deletion.
+2. Monitor the deletion workflow until it completes. Radius deletes the Application and the infrastructure resources.
+3. If you no longer need the Radius Environment, open the **Environments** view and delete it.
+
+Deleting the Radius deployment or Environment does not delete the AKS cluster or Azure resource group.
+
+## Troubleshooting
+
+If the Radius panel does not open, ask Copilot to `Fix my Radius extension`. This invokes the Radius repair skill, which copies the required Radius Canvas extension files into place.
+
+## Report bugs and feedback
+
+Submit bugs and feedback with the [feedback or bug report form](https://github.com/radius-project/ai-extensions/issues/new?template=feedback-or-bug-report.yml). You can also open the form from the feedback button in the bottom right corner of the panel.
 
 {{< image src="feedback.png" alt="Feedback button in the canvas extension" width=250px >}}
+
+## Next steps
+
+You have modeled, deployed, and inspected an application with the GitHub Copilot app. Continue with the hands-on labs for deeper, real-world scenarios.
+
+{{< button text="Next step: Explore the labs" page="getting-started/labs" >}}
@@ -4,5 +4,4 @@ title: "Integrations"
 linkTitle: "Integrations"
 description: "Use Radius with other common tools"
 weight: 800
-new_badge: true
 ---