Merge pull request #3403 from matt-cossins/topo_2

[LP UPDATE] Add Topo VS Code Extension

Author: pareenaverma

content/learning-paths/cross-platform/deploy-containerized-workloads-with-topo/_index.md

@@ -1,7 +1,7 @@
 ---
 title: Deploy containerized workloads to Arm-based Linux targets with Topo
 
-description: Use Topo to detect Arm processor capabilities on a target device, select a compatible container template, and deploy containerized workloads to Arm-based Linux targets over SSH.
+description: Use Topo to detect Arm processor capabilities on a target device, select a compatible container template, and deploy containerized workloads to Arm-based Linux targets over SSH using the CLI or VS Code extension.
 
 minutes_to_complete: 30
 
@@ -11,13 +11,15 @@ learning_objectives:
     - Install Topo and verify that the host and target environments are ready for deployment
     - Run health checks and generate a target description to identify compatible Arm processor features and templates
     - Clone a Topo template and deploy a containerized workload to an Arm-based Linux target
+    - (Optional) Use the Topo VS Code extension to run the same target, template, and deployment workflow from Visual Studio Code
     - (Optional) Deploy firmware and applications to heterogeneous Cortex-A + Cortex-M devices using remoteproc-runtime
 
 prerequisites:
     - A host machine (x86 or Arm) with Linux, macOS, or Windows
     - An Arm-based Linux target accessible over SSH, for example an Arm-based Linux VM, Raspberry Pi, DGX Spark, or NXP i.MX 93
     - Docker installed on the host and target. For installation steps, see [Install Docker](/install-guides/docker/).
     - lscpu installed on the target (pre-installed on most Linux distributions)
+    - (Optional) Visual Studio Code installed if you want to use the Topo VS Code extension.
     - Basic familiarity with containers and CLI tools
 
 author: Matt Cossins
@@ -33,6 +35,7 @@ tools_software_languages:
     - Topo
     - Docker
     - SSH
+    - Visual Studio Code
 operatingsystems:
     - Linux
     - macOS
@@ -62,6 +65,10 @@ further_reading:
         title: remoteproc-runtime
         link: https://github.com/arm/remoteproc-runtime
         type: documentation
+    - resource:
+        title: Topo VS Code extension
+        link: https://marketplace.visualstudio.com/items?itemName=Arm.topo
+        type: website
 
 
 

content/learning-paths/cross-platform/deploy-containerized-workloads-with-topo/deploy-workload.md

@@ -178,8 +178,8 @@ Use Topo to deploy a containerized workload to my Arm target at user@my-target.
 
 The agent reads the Topo `README.md`, runs health checks, selects a template, and deploys it end-to-end with minimal manual input.
 
-## What you've accomplished
+## What you've accomplished and what's next
 
 You have now deployed a containerized workload to your Arm-based Linux target using Topo. You validated the deployment by accessing the application in a web browser. You also learned how to stop the deployment and forward ports if needed.
 
-Next you should explore modification and creation of Topo Templates in the follow-up Learning Path: [Create and deploy a custom Topo Template](/learning-paths/cross-platform/create-your-own-topo-templates/)
+Next, you can try the same workflow in Visual Studio Code using the Topo extension, or explore modification and creation of Topo Templates in the follow-up Learning Path: [Create and deploy a custom Topo Template](/learning-paths/cross-platform/create-your-own-topo-templates/).

content/learning-paths/cross-platform/deploy-containerized-workloads-with-topo/deploy_vscode.png

@@ -0,0 +1,63 @@
+---
+title: (Optional) Use the Topo VS Code extension
+weight: 5
+
+### FIXED, DO NOT MODIFY
+layout: learningpathall
+---
+
+## Use Topo from VS Code
+
+You have used the Topo CLI to check your target, list compatible templates, clone a template, deploy the workload, and inspect the running application.
+
+You can also perform the same workflow from Visual Studio Code using the [Topo extension](https://marketplace.visualstudio.com/items?itemName=Arm.topo). The extension provides a graphical interface for Topo deployment.
+
+## Install the extension
+
+Install the Topo extension from the Visual Studio Marketplace using the link above.
+
+![Screenshot of the Topo extension install page in Visual Studio Code.#center](topo_vscode.png "Topo extension install page for Visual Studio Code")
+
+A guide is provided on the extension page, but some brief steps are also shown here. If you are familiar with Topo CLI, you should have little trouble using the extension. After installation, open the Topo view from the VS Code activity bar.
+
+## Add and inspect a target
+
+The Topo sidebar shows your host by default. Use the sidebar to also add your Arm-based Linux target. The target is the same SSH destination you used with the CLI, for example `user@my-target`.
+
+The extension shows the host and target state, available Topo actions, and deployed applications, providing similar insights to `topo health` and `topo ps`.
+
+![Screenshot of the Topo sidebar in Visual Studio Code showing target and deployment actions.#center](topo_sidebar.png "Topo sidebar in Visual Studio Code")
+
+## Run Topo commands
+
+The command palette exposes the usual Topo commands such as listing compatible templates, cloning templates, and deploying projects.
+
+![Screenshot of Topo commands in Visual Studio Code.#center](topo_commands.png "Topo commands in Visual Studio Code")
+
+These commands correspond to the CLI commands you used earlier, such as:
+
+```bash
+topo templates --target user@my-target
+topo clone <template-url>
+topo deploy --target user@my-target
+```
+
+## Deploy from VS Code
+
+After cloning or selecting a Topo Template, you can deploy it. Open or clone the LLM Chatbot example, then deploy it using the VS Code extension.
+
+![Screenshot of deploying a Topo workload from Visual Studio Code.#center](deploy_vscode.png "Deploy a Topo workload from Visual Studio Code")
+
+When deployment completes, you will see the processes running on the target in the Topo sidebar:
+
+![Screenshot of a deployed LLM chatbot processes shown in the Topo VS Code extension.#center](deployed_llm.png "Deployed LLM chatbot processes in the Topo VS Code extension")
+
+Open the application in your browser just as you did with the CLI workflow:
+
+```output
+http://<target-ip>:3000
+```
+
+## What you've accomplished
+
+You have now seen two ways to deploy Topo workloads: directly from the command line and from Visual Studio Code. Both approaches use the same target checks, template metadata, and deployment flow, so you can choose the interface that best fits your workflow.