Code Monkey home page Code Monkey logo

use-vs-code-on-any-device-aws-cloudformation's Introduction

Deploying code-server (Visual Studio Code) on AWS Ubuntu EC2 server using AWS CloudFormation Template

This is the CloudFormation Template for creating an Ubuntu EC2 instance and deploy code-server in the browser. You can use vscode VS Code any machine including your ipad, iphone, android mobile devices, computer, etc.



Steps



1. Select the desired AWS region where you want to create your ec2 server

Selecting_desired_AWS_Region.png

You will have to use an existing key pair. If you don't have one already, create a new key pair after selecting your desired AWS Region.

2. Create CloudFromation stack with new resources

Create_a_CloudFromation_Stack

3. Upload the CloudFromation template

Upload_the_CloudFormation_Template

4. Specify stack details

Specify_stack_details_stackName_KeyPairName

Name your new stack. You must have an existing key pair you have already created before. Instance name will be the stack name you give. Please refer the CloudFormation Template of this project for the EC2 Instance properties/Tags.

CodeServer:
    Type: AWS::EC2::Instance
    Properties:
      # Ubuntu
      ImageId: ami-09e67e426f25ce0d7
      InstanceType: t2.micro
      KeyName: !Ref KeyPairName
      IamInstanceProfile: !Ref CodeServerEC2Profile
      SecurityGroupIds:
        - !GetAtt CodeServerSecurityGroup.GroupId
      Tags:
        - Key: Name
          Value: !Sub ${AWS::StackName}
        - Key: server
          Value: vscode



Click Next to move all the way the last step Review without making any other change

5. Review and create stack

Review_and_create_stack

After stack creation is complete check your ec2 console for your vscode-server

Stack_created

Ec2_instance_created

6. Navigate the server

Once your instance starts, you can simply navigate to the public IP address and get forwarded to a secure version of code-server, which will be proxied behind your GitHub account (the first one you log in with). Login to your GitHub account. For information on how this works, see code-server

Navigate_the_server

7. Select a theme and open folder

Select_themes_and_open_folder



Using VS Code on iPad

Installing extensions

Installing_extensions.mp4

Cloning

Clone_repo_from_github.mp4



Reference

See the original code and more information for deploying on AWS

Some additional lines added to user data in this CloudFromation template which is slightly different than the original user data.

See the troubleshooting guide if you are unable to connect after some time.

Deploying code-server on various cloud platforms



Or, just use GitHub web-based editor without using any other tool except your web browser (Lightweight editing only)

The web-based editor introduces a lightweight editing experience that runs entirely in your browser.

Opening the web-based editor:

You can open any GitHub repository in the web-based editor in either of the following ways:

  • Press . while browsing any repository or pull request on GitHub.
  • Change the URL from "github.com" to "github.dev".




vscode

aws

bash

github.dev

use-vs-code-on-any-device-aws-cloudformation's People

Contributors

kzs61 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.