docs: fix up port-forwarding (#3403)

ammario · web-flow · commit 13a2014d7ff1 · 2022-08-07T22:22:47.000Z
- Improve English
- Make new page live in manifest.json
- Add icon
- Outdent page to root
diff --git a/docs/ides.md b/docs/ides.md
@@ -79,9 +79,6 @@ Connection and connect to your Coder workspace.](./ides/configuring-gateway.md)
 
 Web IDEs (code-server, JetBrains Projector, VNC, etc.) are defined in the template. See [configuring IDEs](./ides/configuring-web-ides.md).
 
-## Port Forwarding
+## Up next
 
-Port Forwarding lets developers securely access processes on their Coder
-workspace from a local machine. A common use case is testing front-end
-applications in a browser at `http://localhost:<yourforwardedport>` See
-[configuring Port Forwarding](./ides/configuring-port-forwarding.md).
+- Learn about [Port Forwarding](./port-forwarding.md)
diff --git a/docs/ides/configuring-port-forwarding.md b/docs/ides/configuring-port-forwarding.md
diff --git a/docs/images/icons/port-forward.svg b/docs/images/icons/port-forward.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M6 3H3v3c1.66 0 3-1.34 3-3zm8 0h-2c0 4.97-4.03 9-9 9v2c6.08 0 11-4.93 11-11zm-4 0H8c0 2.76-2.24 5-5 5v2c3.87 0 7-3.13 7-7zm0 18h2c0-4.97 4.03-9 9-9v-2c-6.07 0-11 4.93-11 11zm8 0h3v-3c-1.66 0-3 1.34-3 3zm-4 0h2c0-2.76 2.24-5 5-5v-2c-3.87 0-7 3.13-7 7z"/></svg>
diff --git a/docs/manifest.json b/docs/manifest.json
@@ -94,6 +94,12 @@
         }
       ]
     },
+    {
+      "title": "Port Forwarding",
+      "description": "Learn how to forward ports in Coder",
+      "path": "./port-forwarding.md",
+      "icon_path": "./images/icons/port-forward.svg"
+    },
     {
       "title": "Dotfiles",
       "description": "Learn how to personalize your workspace",
diff --git a/docs/port-forwarding.md b/docs/port-forwarding.md
@@ -0,0 +1,33 @@
+# Port Forwarding
+
+Port forwarding lets developers securely access processes on their Coder
+workspace from a local machine. A common use case is testing web
+applications in a browser.
+
+There are two ways to forward ports in Coder:
+
+- The `coder port-forward` command
+- SSH
+
+The `coder port-forward` command is generally more performant.
+
+## coder port-forward
+
+Forward the remote TCP port `8080` to local port `8000` like so:
+
+```console
+coder port-forward myworkspace --tcp 8000:8080
+```
+
+For more examples, see `coder port-forward --help`.
+
+## SSH
+
+First, [configure SSH](../ides.md#ssh-configuration) on your
+local machine. Then, use `ssh` to forward like so:
+
+```console
+ssh -L 8080:localhost:8000 coder.myworkspace
+```
+
+You can read more on SSH port forwarding [here](https://www.ssh.com/academy/ssh/tunneling/example).

Original file line number	Diff line number	Diff line change
`@@ -94,6 +94,12 @@`
`94`	`94`	`}`
`95`	`95`	`]`
`96`	`96`	`},`
	`97`	`+ {`
	`98`	`+ "title": "Port Forwarding",`
	`99`	`+ "description": "Learn how to forward ports in Coder",`
	`100`	`+ "path": "./port-forwarding.md",`
	`101`	`+ "icon_path": "./images/icons/port-forward.svg"`
	`102`	`+ },`
`97`	`103`	`{`
`98`	`104`	`"title": "Dotfiles",`
`99`	`105`	`"description": "Learn how to personalize your workspace",`