Skip to content

Commit ad4b36d

Browse files
rjbeersrjbeers
authored
Re-Adds code-server redirect to marketing integrations page (#1676)
1 parent c8eabc1 commit ad4b36d

File tree

5 files changed

+171
-3
lines changed

5 files changed

+171
-3
lines changed

‎content/docs/courses/fundamentals/conclusion.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ You've made it! Congratulations on completing our Guided Tutorials series! Let's
2020
- You configured Pomerium to run in a VM instance
2121
- You enabled Autocert, which automatically generates certificates for upstream connections between Pomerium and your services
2222

23-
Now, you have a production-ready Pomerium instance. You have everything you need to be able to secure tools like [Grafana](https://www.pomerium.com/docs/guides/grafana), [Jenkins](https://www.pomerium.com/docs/guides/jenkins), [Code-server](https://www.pomerium.com/integrations/code-server), and more!
23+
Now, you have a production-ready Pomerium instance. You have everything you need to be able to secure tools like [Grafana](https://www.pomerium.com/docs/guides/grafana), [Jenkins](https://www.pomerium.com/docs/guides/jenkins), [Code-server](https://www.pomerium.com/docs/guides/code-server), and more!
2424

2525
## So, what's next?
2626

‎content/docs/guides/code-server.mdx

+165
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,165 @@
1+
---
2+
# cSpell:ignore codercom codeserver
3+
4+
title: Secure Code-Server with Pomerium Zero
5+
sidebar_label: Code-server
6+
lang: en-US
7+
keywords:
8+
[
9+
pomerium,
10+
identity access proxy,
11+
visual studio code,
12+
authentication,
13+
authorization,
14+
code server,
15+
vscode,
16+
coder,
17+
codercom,
18+
]
19+
description: In this guide, you’ll run code-server VSCode in a Docker container and secure browser access to your project behind Pomerium.
20+
---
21+
22+
import Tabs from '@theme/Tabs';
23+
import TabItem from '@theme/TabItem';
24+
25+
# Secure Browser Access to Code-Server Behind Pomerium Zero
26+
27+
In this guide, you'll run code-server's Visual Studio Code (VSCode) in a Docker container, and secure browser access to your project with Pomerium.
28+
29+
## What is Code-server?
30+
31+
[Code-server](https://github.com/coder/code-server) is an open-source tool that allows you to run [VSCode](https://code.visualstudio.com/), a popular integrated development environment (IDE), on a **remote server** through the browser. This setup essentially turns VSCode into a cloud-based IDE, providing flexibility and accessibility advantages.
32+
33+
Code-server is particularly popular among developers who want the full power of VSCode, but need to work in a cloud-based environment. This is ideal if you work on multiple machines, need to access your development environment remotely, or you have limited local resources.
34+
35+
## How to secure Code-server with Pomerium
36+
37+
Code-server requires [password authentication](https://coder.com/docs/code-server/latest/guide#expose-code-server) by default. By securing code-server behind Pomerium, you can remove code-server’s password requirement and configure Pomerium to add [authentication](/docs/capabilities/authentication) and [authorization](/docs/capabilities/authorization) to an online instance of VSCode.
38+
39+
This guide shows you how to secure code-server with Pomerium. Here are the steps you’ll follow:
40+
41+
1. Install code-server and run it in a Docker container
42+
43+
1. Access your code-server project in the browser listening on `localhost`
44+
45+
1. Configure Pomerium to safely expose your code-server instance
46+
47+
By the end, you will have a minimal, real-world code-server instance that allows developer teams to write code using VSCode in the browser.
48+
49+
![A code-server VSCode project running in the browser behind Pomerium.](img/code-server/vscode-pomerium.png)
50+
51+
### Before you start
52+
53+
This guide uses Docker to run Pomerium Zero and Code-Server services in containers.
54+
55+
To complete this guide, you need:
56+
57+
- A [Pomerium Zero](http://console.pomerium.app/create-account) account
58+
- [Docker](https://docs.docker.com/install/) and [Docker Compose](https://docs.docker.com/compose/install/)
59+
60+
## Configure Pomerium Zero
61+
62+
### Create a policy
63+
64+
In the Zero Console:
65+
66+
1. Go to **Policies**
67+
2. Select **New Policy**
68+
3. Give it a **Name** and an (optional) **Description**
69+
4. Add an **Allow Block** and select an **AND** operator
70+
5. Keep the **Domain** criteria and replace **Value** with the domain portion of your email address (the part after “@”)
71+
72+
Save your policy.
73+
74+
### Create a route
75+
76+
In the Zero Console:
77+
78+
1. Select **Routes**
79+
2. Add a **New Route**
80+
3. Give it a **Name** (like Codeserver)
81+
4. In `From:`, add the external URL to our Codeserver route
82+
5. In `To:`, add the internal URL
83+
6. In the **Policies** field, select the Codeserver policy
84+
7. Select the **Timeouts** tab and **Allow Websockets**
85+
8. Select the **Headers** tab and **Preserve Host Header**
86+
87+
## Add Docker Compose Services
88+
89+
First, make sure your `docker-compose.yaml` file contains the images to run Pomerium Zero and Codeserver:
90+
91+
```yaml {7,14} showLineNumbers
92+
pomerium:
93+
image: pomerium/pomerium:v0.27.1
94+
ports:
95+
- 443:443
96+
restart: always
97+
environment:
98+
POMERIUM_ZERO_TOKEN: <CLUSTER_TOKEN>
99+
XDG_CACHE_HOME: /var/cache
100+
volumes:
101+
- pomerium-cache:/var/cache
102+
networks:
103+
main:
104+
aliases:
105+
- authenticate.<CLUSTER_SUBDOMAIN>.pomerium.app
106+
codeserver:
107+
image: codercom/code-server:latest
108+
networks:
109+
main: {}
110+
ports:
111+
- 8080:8080
112+
command: --auth none --disable-telemetry /home/coder/project
113+
volumes:
114+
- ./code-server:/home/coder/project
115+
- ./code-server-config/.config:/home/coder/.config
116+
```
117+
118+
In line `7`, replace `CLUSTER_TOKEN` with your own.
119+
120+
In line `14`, replace `CLUSTER_SUBDOMAIN` with your own. For example, if your starter domain is `loquacious-cyborg-2214.pomerium.app`, the URL would be `authenticate.loquacious-cyborg-2214.pomerium.app`.
121+
122+
## Access Code-server
123+
124+
Run `docker compose up` and go to your external URL.
125+
126+
After authenticating against our hosted Identity Provider, Pomerium will redirect you to your code-server instance.
127+
128+
## Build a project in Code-server
129+
130+
Now that you can access VSCode in your browser, test out code-server by building a quick HTML project.
131+
132+
1. Create an `index.html` file and add the following code:
133+
134+
```html
135+
<!DOCTYPE html>
136+
<html lang="en">
137+
<head>
138+
<meta charset="UTF-8" />
139+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
140+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
141+
<title>Code-Server Sample</title>
142+
</head>
143+
<body>
144+
<h1 style="color:blueviolet">Check out more from Pomerium:</h1>
145+
<ul style="font-size: 20px;">
146+
<li><a href="<https://www.pomerium.com/docs/guides>">Guides</a></li>
147+
<li><a href="<https://www.pomerium.com/blog/>">Blog</a></li>
148+
<li><a href="<https://www.pomerium.com/docs>">Documentation</a></li>
149+
</ul>
150+
<h2 style="color:blueviolet">Happy coding!</h2>
151+
</body>
152+
</html>
153+
```
154+
155+
1. Go to **Extensions** and install [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer)
156+
2. Right-click `index.html` and select **Open with Live Server**
157+
3. Select any of the links to learn more about Pomerium
158+
159+
Great job! You successfully deployed code-server.
160+
161+
:::note
162+
163+
When the code-server container is rebuilt, any files outside of `/home/coder/project` are reset, removing any dependencies (such as go and make). In a real remote development workflow, you could mount additional volumes, or [use a custom code-server container](https://github.com/cdr/deploy-code-server/tree/main/deploy-container) with these dependencies installed.
164+
165+
:::

‎content/docs/zero.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -30,4 +30,4 @@ Check out these guides for real-world examples:
3030

3131
- [**Jenkins**](/docs/guides/jenkins)
3232
- [**Grafana**](/docs/guides/grafana)
33-
- [**Code-server**](https://www.pomerium.com/integrations/code-server)
33+
- [**Code-server**](/docs/guides/code-server)

‎sidebars.js

+4
Original file line numberDiff line numberDiff line change
@@ -274,6 +274,10 @@ const sidebars = {
274274
type: 'doc',
275275
id: 'docs/guides/guacamole',
276276
},
277+
{
278+
type: 'doc',
279+
id: 'docs/guides/code-server',
280+
},
277281
{
278282
type: 'doc',
279283
id: 'docs/guides/gitlab',

‎static/_redirects

-1
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,6 @@ https://0-20-0.docs.pomerium.com/category/guides https://0-20-0.docs.pomerium.co
8888
/docs/guides/tcp.html /docs/guides/securing-tcp
8989
/guides/vs-code-server.html /docs/guides/code-server
9090
/docs/guides/vs-code-server.html /docs/guides/code-server
91-
/docs/guides/code-server https://www.pomerium.com/integrations/code-server
9291
/guides/local-oidc.html /docs/guides/local-oidc
9392
/docs/guides/local-oidc /docs/identity-providers/oidc
9493
/docs/identity-providers/dex-freeipa /docs 410

0 commit comments

Comments
 (0)