Giter Site home page Giter Site logo

code-server-cfn's Introduction

code-server-cfn

シンプルなcode-server環境を作るためのCloudFormationテンプレートです。

このテンプレートはAWS Cloud9の代替を意図して作成しました。
主な用途としてAWS Workshopsやコミュニティイベントのハンズオン等での 一時的な 利用を想定しています。

Warning

このテンプレートは永続的な開発環境として使うことを意図していません

永続的な開発環境が必要な場合はCoderを使用してください。

作成される環境

本テンプレートは新規にVPCとcode-serverがインストールされた1台のEC2インスタンスを作成します。

Environment

以下の環境でテスト済みです。

  • AWS 東京リージョン (ap-northeast-1)
  • Amazon Linux 2023 : 2023.5.20240730.0
  • code-server : v4.91.1

利用方法

VPC、EC2、IAMロールを作成可能な権限を持つユーザーで作業してください。

1. 環境構築

はじめにローカル環境で以下のコマンドを実行して、自分のグローバルIPアドレスを取得してください。
取得したグローバルIPアドレスは次の手順で使います。

#
# ローカル環境で次のコマンドを実行します
#

# Widnows環境の場合
curl.exe -s https://checkip.amazonaws.com

# macOSおよびLinux環境の場合
curl -s https://checkip.amazonaws.com

次に東京リージョンでAWS CloudShellを起動し以下のコマンドを実行して環境を構築します。
YOUR_GLOBAL_IP変数にご自身のグローバルIPアドレスを設定します。

#
# 東京リージョンのAWS CloudShellで以下のコマンドを実行します
# 

# 本リポジトリをclone
git clone https://github.com/stknohg/code-server-cfn.git --depth 1
cd code-server-cfn/

# 自分のグローバルIPアドレスを設定
export YOUR_GLOBAL_IP="XX.XX.XX.XX"

# CloudFormationスタックを作成
aws cloudformation create-stack --stack-name temp-code-server \
    --template-body file://./code-server.yaml \
    --parameters "ParameterKey=UserCIDR,ParameterValue=${YOUR_GLOBAL_IP}/32" \
    --capabilities CAPABILITY_NAMED_IAM

CloudFormationスタックがエラー無く完了すればセットアップは完了です。

2. code-serverへのアクセス

code-serverへアクセスする際にパスワードが必要になります。

このパスワードはEC2インスタンスのOS内部に保存されており、SSM Sessionでインスタンス内部に接続してから次のコマンドを実行して取得してください。

#
# SSM Sessionを使いEC2インスタンスに接続して次のコマンドを実行します
#

# code-serverのパスワードを取得
sudo cat /home/ec2-user/.config/code-server/config.yaml | grep password:

get-password

続けてWEBブラウザを起動しhttps://<Your EC2 instance Public IP>/にアクセスしてください。

直接IPアドレスを指定しているので「接続がプライベートでない」旨のエラーがでますがそのまま続行します。

how-to-connect-01

するとcode-serverのログイン画面に遷移しますので、先ほど取得したパスワードを入力し「SUBMIT」ボタンをクリックします。

how-to-connect-02

初期設定を済ませて、後は自由にWeb IDEを利用してください。

how-to-connect-03

直接IPアドレスを指定しているため以下のSSLエラーが出ますが、これは意図した挙動ですので無視してください。

An SSL certificate error occurred when fetching the script.

Warning

SSLエラーを解消したい場合は別途適切なサーバー証明書を導入してください。
もしくは code-server でなく Coder を使用してください。

Note

短時間の利用であれば Pinggyを使う構成 で代替することもできます。

3. 終了

Web IDEの利用を終えた後はEC2インスタンスを停止し、CloudFormationスタックを削除して環境を削除します。

東京リージョンでAWS CloudShellを起動し以下のコマンドを実行すると環境を削除できます。

#
# 東京リージョンのAWS CloudShellで以下のコマンドを実行します
# 

# CloudFormationスタックの削除
aws cloudformation delete-stack --stack-name temp-code-server

ライセンス

本テンプレートはMIT Licenseで公開しています。

必要に応じて改変してご利用ください。

code-server-cfn's People

Contributors

stknohg avatar

Stargazers

Hiranuma Naruaki avatar

Watchers

 avatar

code-server-cfn's Issues

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.