Update dev container content

docs/devcontainers/create-dev-container.md

@@ -32,7 +32,7 @@ You can use an image as a starting point for your `devcontainer.json`. An image
 
 ```json
 {
-    "image": "mcr.microsoft.com/devcontainers/typescript-node:0-12"
+    "image": "mcr.microsoft.com/devcontainers/typescript-node:0-18"
 }
 ```
 
@@ -49,7 +49,7 @@ For this example, if you'd like to install the [ESLint extension](https://market
 
 ```json
 {
-    "image": "mcr.microsoft.com/devcontainers/typescript-node:0-12",
+    "image": "mcr.microsoft.com/devcontainers/typescript-node:0-18",
 
     "customizations": {
         "vscode": {
@@ -184,7 +184,7 @@ When you make changes like installing new software, changes made in the Dockerfi
 In your Dockerfile, use `FROM` to designate the image, and the `RUN` instruction to install any software. You can use `&&` to string together multiple commands.
 
 ```docker
-FROM mcr.microsoft.com/vscode/devcontainers/typescript-node:0-12
+FROM mcr.microsoft.com/devcontainers/javascript-node:0-18
 RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
     && apt-get -y install git
 ```

docs/devcontainers/devcontainer-cli.md

@@ -29,24 +29,15 @@ When tools like VS Code and Codespaces detect a `devcontainer.json` file in a us
 
 This CLI can either be used directly or integrated into product experiences, similar to how it's integrated with Dev Containers and Codespaces today. It currently supports both a simple single container option and integrates with [Docker Compose](https://docs.docker.com/compose/) for multi-container scenarios.
 
-The CLI is available for review in a new [devcontainers/cli](https://github.com/devcontainers/cli) repository and you can read more about its development in [this issue in the spec repo](https://github.com/devcontainers/spec/issues/9).
+The CLI is available in the [devcontainers/cli](https://github.com/devcontainers/cli) repository.
 
 ## System requirements
 
-To use the VS Code dev container CLI, you'll need the following on your system or CI/DevOps environment:
+You can quickly try out the CLI in just a few simple steps, either by installing its npm package or building the CLI repo from sources.
 
-1. [Node.js (version 14 or greater)](https://nodejs.org).
-1. [The `docker` CLI](/docs/devcontainers/containers.md#installation).
-1. [Python](https://www.python.org/downloads)
-1. C/C++ compiler
+You may learn more about building from sources in the [CLI repo's README](https://github.com/devcontainers/cli#try-it-out). On this page, we'll focus on using the npm package.
 
-The VS Code [How to Contribute](https://github.com/microsoft/vscode/wiki/How-to-Contribute) wiki has details about the recommended toolsets.
-
-## Installation
-
-You can try out the dev container CLI, either by installing its npm package or building the CLI repo from sources.
-
-To learn more about building the CLI from sources, go to the [CLI repo's README](https://github.com/devcontainers/cli#try-it-out).
+To install the npm package, you will need Python, Node.js (version 14 or greater), and C/C++ installed to build one of the dependencies. The VS Code [How to Contribute](https://github.com/microsoft/vscode/wiki/How-to-Contribute) wiki has details about the recommended toolsets.
 
 ### npm install
 
@@ -64,6 +55,8 @@ Commands:
   devcontainer build [path]         Build a dev container image
   devcontainer run-user-commands    Run user commands
   devcontainer read-configuration   Read configuration
+  devcontainer features             Features commands
+  devcontainer templates            Templates commands
   devcontainer exec <cmd> [args..]  Execute a command on a running dev container
 
 Options:

docs/devcontainers/tutorial.md

@@ -11,7 +11,7 @@ DateApproved: 12/7/2022
 
 This tutorial walks you through running Visual Studio Code in a [Docker](https://www.docker.com/) container using the [Dev Containers](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers) extension. You need no prior knowledge of Docker to complete this tutorial.
 
-Running VS Code **inside** a Docker container can be useful for many reasons, but in this walkthrough we'll focus on using a Docker container to set up a development environment that is isolated from your local environment.
+Running VS Code **inside** a Docker container can be useful for many reasons, but in this walkthrough we'll focus on using a Docker container to set up a development environment that is separate from your local environment.
 
 ## Prerequisites
 
@@ -88,7 +88,7 @@ Once the container is running and you're connected, you should see your remote c
 
 One of the useful things about developing in a container is that you can use specific versions of dependencies that your application needs without impacting your local development environment.
 
-The specific container for this tutorial has Node.js v12 installed, which you can check by opening a new terminal **Terminal** > **New Terminal** (`kb(workbench.action.terminal.new)`) and entering:
+The specific container for this tutorial has Node.js v18 installed, which you can check by opening a new terminal **Terminal** > **New Terminal** (`kb(workbench.action.terminal.new)`) and entering:
 
 ```bash
 node --version; npm --version
@@ -114,53 +114,69 @@ This next section describes in more detail how the Dev Containers extension sets
 
 The Dev Containers extension uses the files in the `.devcontainer` folder, namely `devcontainer.json`, and an optional `Dockerfile` or `docker-compose.yml`, to create your dev containers.
 
-First your image is built from the supplied Docker file or image name. Then a container is created and started using some of the settings in the `devcontainer.json`. Finally your Visual Studio Code environment is installed and configured again according to settings in the `devcontainer.json`.
+In the example we just explored, the project has a `.devcontainer` folder with a `devcontainer.json` inside. The `devcontainer.json` uses the image `mcr.microsoft.com/devcontainers/javascript-node:0-18`. You can explore this image in greater detail in the [devcontainers/images](https://github.com/devcontainers/images/tree/main/src/javascript-node) repo.
+
+First, your image is built from the supplied Dockerfile or image name, which would be `mcr.microsoft.com/devcontainers/javascript-node:0-18` in this example. Then a container is created and started using some of the settings in the `devcontainer.json`. Finally your Visual Studio Code environment is installed and configured again according to settings in the `devcontainer.json`. For example, the dev container in this example installs the `streetsidesoftware.code-spell-checker` extension.
 
 Once all of this is done, your local copy of Visual Studio Code connects to the Visual Studio Code Server running inside of your new dev container.
 
+![Architecture](../remote/images/remote-overview/architecture.png)
+
 ### devcontainer.json
 
 The `devcontainer.json` is basically a config file that determines how your dev container gets built and started.
 
 ```json
 //devcontainer.json
 {
-    "name": "Node.js Sample",
-    "dockerFile": "Dockerfile",
+    "name": "Node.js",
+
+    // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
+	"image": "mcr.microsoft.com/devcontainers/javascript-node:0-18",
+
+    // Features to add to the dev container. More info: https://containers.dev/features.
+	// "features": {},
 
     "customizations": {
         "vscode": {
-            "settings": {
-                "terminal.integrated.defaultProfile.linux": "bash"
-            },
-
+            "settings": {},
             "extensions": [
-                "dbaeumer.vscode-eslint"
+                "streetsidesoftware.code-spell-checker"
             ]
         }
     },
 
-    "forwardPorts": [3000],
+    // "forwardPorts": [3000],
+
+	"portsAttributes": {
+		"9000": {
+			"label": "Hello Remote World",
+			"onAutoForward": "notify"
+		}
+	},
 
     "postCreateCommand": "yarn install",
 
-    "remoteUser": "node"
+    // "remoteUser": "root"
 }
 ```
 
-The above example is taken from the `vscode-remote-try-node` repo we used in the tutorial.
+The above example is extracted from the `vscode-remote-try-node` repo we used in the tutorial.
 
 | Option | Description |
 |---|---|
-| `dockerfile` | Relative path to a `Dockerfile` that you want to use as your image. |
-| `customizations` | Configure tool-specific properties, like `settings` and `extensions` properties for VS Code.
-| `settings`  | Adds default `settings.json` values into a container/machine specific settings file. |
-| `extensions`  | An array of extension IDs that specify the extensions that should be installed inside the container when it is created.   |
+| `image` | The name of an image in a container registry ([DockerHub](https://hub.docker.com/), [GitHub Container Registry](https://docs.github.com/packages/guides/about-github-container-registry), [Azure Container Registry](https://azure.microsoft.com/services/container-registry/)) VS Code should use to create the dev container. <br> |
+| `dockerfile` | Rather than referencing an `image`, you may instead use the `dockerfile` property, which is the relative path to a `Dockerfile` that you want to use as your image. |
+| `features` | An object of [Dev Container Feature](./containers.md#dev-container-features) IDs and related options to be added. |
+| `customizations` | Configure tool-specific properties, like `settings` and `extensions` properties for VS Code. |
+| `settings`  | Adds default `settings.json` values into a container/machine specific settings file, such as `"terminal.integrated.defaultProfile.linux": "bash"`. |
+| `extensions`  | An array of extension IDs that specify the extensions that should be installed inside the container when it is created. |
 | `forwardPorts`  | Make a list of ports inside the container available locally. |
+| `portsAttributes` | Set default properties for specific forwarded ports. |
 | `postCreateCommand`  | A command string or list of command arguments to run after the container is created. |
-| `remoteUser`  | Overrides the user that VS Code runs as in the container (along with sub-processes). Defaults to the `containerUser`.  |
+| `remoteUser`  | Overrides the user that VS Code runs as in the container (along with sub-processes). Defaults to the `containerUser`. |
 
-[Full list](https://containers.dev/implementors/json_reference) of `devcontainer.json` options.
+You can review the [full list](https://containers.dev/implementors/json_reference) of `devcontainer.json` options.
 
 ### Congratulations
 

docs/remote/ssh.md

@@ -46,7 +46,7 @@ To get started, you need to:
 
 2. Install [Visual Studio Code](https://code.visualstudio.com/) or [Visual Studio Code Insiders](https://code.visualstudio.com/insiders/).
 
-3. Install the [Remote Development extension pack](https://aka.ms/vscode-remote/download/extension).
+3. Install the [Remote-SSH extension](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-ssh). If you plan to work with other remote extensions in VS Code, you may choose to install the [Remote Development extension pack](https://aka.ms/vscode-remote/download/extension).
 
 ### SSH host setup
 

docs/remote/wsl.md

@@ -33,7 +33,7 @@ To get started, you need to:
 
     > **Note:** When prompted to **Select Additional Tasks** during installation, be sure to check the **Add to PATH** option so you can easily open a folder in WSL using the `code` command.
 
-3. Install the [Remote Development extension pack](https://aka.ms/vscode-remote/download/extension).
+3. Install the [WSL extension](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-wsl). If you plan to work with other remote extensions in VS Code, you may choose to install the [Remote Development extension pack](https://aka.ms/vscode-remote/download/extension).
 
 ### Open a remote folder or workspace
 

remote/advancedcontainers/add-nonroot-user.md

@@ -1,5 +1,5 @@
 ---
-Order: 9
+Order: 8
 Area: advancedcontainers
 TOCTitle: Add non-root user
 PageTitle: Add non-root user to a container

remote/advancedcontainers/configure-separate-containers.md

@@ -1,5 +1,5 @@
 ---
-Order: 13
+Order: 12
 Area: advancedcontainers
 TOCTitle: Configure separate containers
 PageTitle: Configure separate containers for multiple projects

remote/advancedcontainers/connect-multiple-containers.md

@@ -1,5 +1,5 @@
 ---
-Order: 12
+Order: 11
 Area: advancedcontainers
 TOCTitle: Connect to multiple containers
 PageTitle: Connect to multiple containers

remote/advancedcontainers/develop-remote-host.md

@@ -1,5 +1,5 @@
 ---
-Order: 14
+Order: 13
 Area: advancedcontainers
 TOCTitle: Develop on a remote Docker host
 PageTitle: Develop a container on a remote Docker host
@@ -95,7 +95,7 @@ After restarting VS Code (or reloading the window), you will now be able to [att
 
 ### Using the TCP protocol
 
-While the SSH protocol has its own built-in authorization mechanism, using the TCP protocol often requires setting other [Docker extension](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker) properties. These are:
+While the SSH protocol has its own built-in authorization mechanism, using the TCP protocol often requires setting other [Docker extension](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker) properties in your `settings.json`. These are:
 
 ```json
 "docker.environment": {

remote/advancedcontainers/docker-options.md

@@ -1,5 +1,5 @@
 ---
-Order: 16
+Order: 15
 Area: advancedcontainers
 TOCTitle: Docker options
 PageTitle: Dev Containers Docker options

remote/advancedcontainers/improve-performance.md

@@ -43,16 +43,18 @@ Follow these steps:
 
     ```json
     "mounts": [
-        "source=try-node-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
+        "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
     ]
     ```
 
+    > **Note**: You may use `${localWorkspaceFolderBasename}`, `${devcontainerId}`, or a hardcoded name in the `source`.
+
 2. Since this repository [runs VS Code as the non-root "node" user](/remote/advancedcontainers/add-nonroot-user.md), we need to add a `postCreateCommand` to be sure the user can access the folder.
 
     ```json
     "remoteUser": "node",
     "mounts": [
-        "source=try-node-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
+        "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
     ],
     "postCreateCommand": "sudo chown node node_modules"
     ```

remote/advancedcontainers/reduce-docker-warnings.md

@@ -1,5 +1,5 @@
 ---
-Order: 15
+Order: 14
 Area: advancedcontainers
 TOCTitle: Reduce Docker warnings
 PageTitle: Reduce Docker container build warnings

remote/advancedcontainers/set-docker-compose-project-name.md

@@ -1,5 +1,5 @@
 ---
-Order: 10
+Order: 9
 Area: advancedcontainers
 TOCTitle: Set Docker Compose project name
 PageTitle: Set Docker Compose project name