Run VSCode Server on AWS

This project is about running vscode server on AWS with a minimal setup. It is packed into a standalone cdk construct.

This construct was created due to the inspiration at re:Invent 2024 in several workshops (e.g. see my post about it), and the usage of the AWS Workshop Studio. I personally have the uttermost respect of the people building creating those workshop to deliver so much condense knowledge in such short time. If you are interested you can read a story about this 👉 here.

The why - I created this construct

Well…

After the decommission of Cloud9 (see announcement) my challenge was, how to run the dev environments for the participants of my workshops.

The named options

1. AWS IDE Toolkits
2. and AWS CloudShell

were no suitable options as I want to provide a fresh environment in the cloud for every participant. If you want to dive deeper see the migration guide here how you can set up each option and what are the pros and cons.

Being hyped after re:Invent 2024, I did research if there is something already out there which I could use or adapt to my needs. I found the following inspiration in blog posts

• 2019: running-vscode-on-aws: a bit older and the solution was achieved via ssh tunnel
• 2020: using-vscode-remotely-on-an-ec2-instance: very good solution with vscode ssh tunnel, however lots of manual steps.
• 2021: how-to-setup-a-visual-studio-code-server-on-aws: great solution with nginx as reverse proxy, however with port 80 open of the instance and a description of the manual steps. I was hoping for a IaC template here as well.
• 2023: vscode-on-aws: Jimmy’s post are always very insightful to read, however his solution was pure cloudformation and with an ssh tunnel, which is great, however was not what I wanted

Futhermore I discovered the following code examples, which helped me guide the way:

• vscode-on-ec2-for-prototyping: as baseline, which unfortunately was outdated
• aws-terraform-dev-container: as baseline for terraform, but unfortunately also outdated
• java-workshop-ide-only.yaml: an already synthesized cloudformation stack, which used mostly python as the custom resources
• fleet-workshop-team-stack-self.json: also an already synthesized cloudformation stack, which did much more as I currently implemented here.
• eks-workshop-vscode-cfn.yaml: another great baseline

I talked to the creators of some of them (Carlos Santana and Niall Thomson) if there will be a release of a cdk construct any time soon from AWS side. However they encouraged me to to built my own and share it. So here we are.

However, let’s move on how you can use the vscode-server cdk construct 🎉

TL;DR

You can use the construct in your cdk app as follows:

import { App, Stack, StackProps } from 'aws-cdk-lib';
import { Construct } from 'constructs';
import { VSCodeServer } from '@mavogel/cdk-vscode-server';

export class MyStack extends Stack {
  constructor(scope: Construct, id: string, props: StackProps = {}) {
    super(scope, id, props);

    // just use the defaults 💡
    new VSCodeServer(this, 'vscode', {});
  }
}

const env = {
  account: '123456789912',
  region: 'eu-central-1',
};

const app = new App();
new MyStack(app, 'vscode-server', { env });
app.synth();

and deploy it via

npx projen build
npx projen deploy

grab a ☕ and come back to see

✨  Deployment time: 509.87s

Outputs:
dev.vscodedomainName6729AA39 = https://d1foo65bar4baz.cloudfront.net/?folder=/Workshop
dev.vscodepassword64FBCA12 = foobarbaz

Which results in the login screen:

Even the Amazon Q Developer extension is pre-installed. Log in with you BuilderID

Solution Design

Next up is a short overview of the architecture:

Custom configuration

And of course the construct can be configured to your needs:

import { App, Stack, StackProps } from 'aws-cdk-lib';
import * as ec2 from 'aws-cdk-lib/aws-ec2';
import * as iam from 'aws-cdk-lib/aws-iam';
import { Construct } from 'constructs';
import { LinuxArchitectureType, LinuxFlavorType, VSCodeServer } from '@mavogel/cdk-vscode-server';

export class MyStack extends Stack {
  constructor(scope: Construct, id: string, props: StackProps = {}) {
    super(scope, id, props);

    new VSCodeServer(this, 'vscode', {
      // for example (or simply use the defaults by not setting the properties)
      instanceVolumeSize: 8,
      instanceClass: ec2.InstanceClass.M7G,
      instanceSize: ec2.InstanceSize.LARGE,
      instanceOperatingSystem: LinuxFlavorType.UBUNTU_22,
      instanceCpuArchitecture: LinuxArchitectureType.ARM,
      
      // 👇🏽 or if you want to give the InstanceRole more permissions
      additionalInstanceRolePolicies: [
        new iam.PolicyStatement({
          effect: iam.Effect.ALLOW,
          actions: [
            'codebuild:*',
          ],
          resources: [
            `arn:aws:codebuild:*:${Stack.of(this).account}:*/*`,
          ],
        }),
      ]
      
      // and more... 💡
    });
  }
}

The associated repositories are the following:

• code here: https://github.com/mv-consulting/cdk-vscode-server
• the released construct: https://constructs.dev/packages/@mavogel/cdk-vscode-server
• the corresponding npm package: https://www.npmjs.com/package/@mavogel/cdk-vscode-server

Feel free to provide feedback in the form of issues or pull requests. There is also a CONTRIBUTING.md in the repository, which explains it in more detail.

Like what you read? You can hire me 💻, book a meeting 📆 or drop me a message to see which services may help you