How To Set Up the Eclipse Theia Cloud IDE Platform on CentOS 7
著者は、 Write for DOnations プログラムの一環として、 Free and Open SourceFundを選択して寄付を受け取りました。
序章
開発者ツールがクラウドに移行するにつれ、クラウドIDE(統合開発環境)プラットフォームの採用が増えています。 クラウドIDEは、Webブラウザーを介してあらゆるタイプの最新デバイスからアクセスでき、リアルタイムコラボレーションシナリオに多くの利点を提供します。 クラウドIDEでの作業は、プラットフォームの非互換性を最小限に抑えながら、あなたとあなたのチームに統合された開発およびテスト環境を提供します。 WebブラウザーからアクセスできるクラウドIDEは、あらゆるタイプの最新デバイスから利用できます。
Eclipse Theia は、リモートサーバー上で実行され、Webブラウザーからアクセスできる拡張可能なクラウドIDEです。 視覚的には、 Microsoft Visual Studio Code と同様に表示および動作するように設計されています。つまり、多くのプログラミング言語をサポートし、柔軟なレイアウトを備え、端末が統合されています。 Eclipse Theiaを他のクラウドIDEソフトウェアと区別するのは、その拡張性です。 カスタム拡張機能を使用して変更できます。これにより、ニーズに合ったクラウドIDEを作成できます。
このチュートリアルでは、コンテナーオーケストレーションツールであるDocker Composeを使用して、EclipseTheiaをCentOS7サーバーにデプロイします。 nginx-proxy を使用してドメインで公開します。これは、コンテナーのリバースプロキシとして機能するようにNginxを構成するプロセスを簡素化するDockerの自動システムです。 また、無料の Let’s Encrypt TLS証明書を使用してセキュリティで保護します。この証明書は、専用のアドオンを使用してプロビジョニングします。 最終的には、CentOS7サーバーでEclipseTheiaを実行し、HTTPS経由で利用できるようにし、ユーザーにログインを要求します。
前提条件
- root権限を持つCentOS7サーバー、および2番目の非rootアカウント。 これを設定するには、CentOS7の初期サーバー設定ガイドに従ってください。 このチュートリアルでは、root以外のユーザーは
sammy
です。 - サーバーにDockerがインストールされています。 CentOS7にDockerをインストールする方法のステップ1およびステップ2に従います。 この前提条件を実行した後は、必ずログアウトしてから再度ログインしてください。 Dockerの概要については、 Dockerエコシステム:一般的なコンポーネントの概要を参照してください。
- サーバーにインストールされているDockerCompose。 CentOS7にDockerComposeをインストールする方法のステップ1に従います。
- 完全に登録されたドメイン名。 このチュートリアルでは、全体を通して
theia.your-domain
を使用します。 Namecheap でドメイン名を購入するか、 Freenom で無料でドメイン名を取得するか、選択したドメイン登録事業者を使用できます。 - サーバーのパブリックIPアドレスを指す
theia.your-domain
を含むDNSレコード。 それらを追加する方法の詳細については、このDigitalOceanDNSの紹介に従ってください。
ステップ1—Let’sEncryptを使用してnginx-proxyをデプロイする
このセクションでは、DockerComposeを使用してnginx-proxy
とそのLet’sEncryptアドオンをデプロイします。 これにより、TLS証明書の自動プロビジョニングと更新が可能になり、Eclipse Theiaをデプロイすると、ドメインでHTTPS経由でアクセスできるようになります。
このチュートリアルでは、すべてのファイルを~/eclipse-theia
の下に保存します。 次のコマンドを実行して、ディレクトリを作成します。
- mkdir ~/eclipse-theia
そこに移動します:
- cd ~/eclipse-theia
nginx-proxy
のDockerCompose構成をnginx-proxy-compose.yaml
という名前のファイルに保存します。 テキストエディタを使用して作成します。
- vi nginx-proxy-compose.yaml
次の行を追加します。
version: '2'
services:
nginx-proxy:
restart: always
image: jwilder/nginx-proxy
ports:
- "80:80"
- "443:443"
volumes:
- "/etc/nginx/htpasswd:/etc/nginx/htpasswd"
- "/etc/nginx/vhost.d"
- "/usr/share/nginx/html"
- "/var/run/docker.sock:/tmp/docker.sock:ro"
- "/etc/nginx/certs"
letsencrypt-nginx-proxy-companion:
restart: always
image: jrcs/letsencrypt-nginx-proxy-companion
volumes:
- "/var/run/docker.sock:/var/run/docker.sock:ro"
volumes_from:
- "nginx-proxy"
ここでは、DockerComposeが実行する2つのサービスnginx-proxy
とそのLet’sEncryptコンパニオンを定義しています。 プロキシの場合、イメージとしてjwilder/nginx-proxy
を指定し、HTTPポートとHTTPSポートをマップし、実行時にプロキシにアクセスできるボリュームを定義します。
ボリュームは、定義されたサービスがフルアクセスできるサーバー上のディレクトリであり、後でユーザー認証を設定するために使用します。 これを実現するには、リストの最初のボリュームを使用します。これにより、ローカルの/etc/nginx/htpasswd
ディレクトリがコンテナ内の同じディレクトリにマップされます。 そのフォルダーで、nginx-proxy
は、 htpasswd 形式(username:hashed_password
)のユーザー認証用のログイン資格情報を含む、ターゲットドメインとまったく同じ名前のファイルを見つけることを想定しています。
アドオンの場合、Dockerイメージに名前を付け、ボリュームを定義することでDockerのソケットへのアクセスを許可します。 次に、アドオンがnginx-proxy
用に定義されたボリュームへのアクセスを継承するように指定します。 どちらのサービスでもrestart
がalways
に設定されており、クラッシュやシステムの再起動が発生した場合にDockerにコンテナーを再起動するように指示します。
ファイルを保存して閉じます。
以下を実行して構成をデプロイします。
- docker-compose -f nginx-proxy-compose.yaml up -d
ここでは、nginx-proxy-compose.yaml
ファイル名をdocker-compose
コマンドの-f
パラメーターに渡します。このパラメーターは、実行するファイルを指定します。 次に、コンテナを実行するように指示するup
動詞を渡します。 -d
フラグは、デタッチモードを有効にします。これは、DockerComposeがコンテナーをバックグラウンドで実行することを意味します。
最終的な出力は次のようになります。
OutputCreating network "eclipse-theia_default" with the default driver
Pulling nginx-proxy (jwilder/nginx-proxy:)...
latest: Pulling from jwilder/nginx-proxy
8d691f585fa8: Pull complete
5b07f4e08ad0: Pull complete
...
Digest: sha256:dfc0666b9747a6fc851f5fb9b03e65e957b34c95d9635b4b5d1d6b01104bde28
Status: Downloaded newer image for jwilder/nginx-proxy:latest
Pulling letsencrypt-nginx-proxy-companion (jrcs/letsencrypt-nginx-proxy-companion:)...
latest: Pulling from jrcs/letsencrypt-nginx-proxy-companion
89d9c30c1d48: Pull complete
668840c175f8: Pull complete
...
Digest: sha256:a8d369d84079a923fdec8ce2f85827917a15022b0dae9be73e6a0db03be95b5a
Status: Downloaded newer image for jrcs/letsencrypt-nginx-proxy-companion:latest
Creating eclipse-theia_nginx-proxy_1 ... done
Creating eclipse-theia_letsencrypt-nginx-proxy-companion_1 ... done
DockerComposeを使用してnginx-proxy
とそのLet’sEncryptコンパニオンをデプロイしました。 次に、ドメインでEclipse Theiaをセットアップし、保護します。
ステップ2— DockerizedEclipseTheiaをデプロイする
このセクションでは、ユーザーが入力する必要のある許可されたログインの組み合わせを含むファイルを作成します。 次に、DockerComposeを使用してEclipseTheiaをサーバーにデプロイし、nginx-proxy
を使用してセキュリティで保護されたドメインに公開します。
前の手順で説明したように、nginx-proxy
は、ログインの組み合わせが、公開されたドメインにちなんで名付けられたhtpasswd
形式のファイルにあり、/etc/nginx/htpasswd
ディレクトリに保存されていることを想定しています。コンテナ。 nginx-proxy
構成で指定されているように、仮想ディレクトリにマップするローカルディレクトリは同じである必要はありません。
ログインの組み合わせを作成するには、最初に次のコマンドを実行してhtpasswd
をインストールする必要があります。
- sudo yum install httpd-tools
httpd-tools
パッケージには、htpasswd
ユーティリティが含まれています。
/etc/nginx/htpasswd
ディレクトリを作成します。
- sudo mkdir -p /etc/nginx/htpasswd
ドメインのログインを保存するファイルを作成します。
- sudo touch /etc/nginx/htpasswd/theia.your-domain
theia.your-domain
をEclipseTheiaドメインに置き換えることを忘れないでください。
ユーザー名とパスワードの組み合わせを追加するには、次のコマンドを実行します。
- sudo htpasswd /etc/nginx/htpasswd/theia.your-domain username
username
を追加するユーザー名に置き換えます。 パスワードの入力を2回求められます。 それを提供した後、htpasswd
はユーザー名とハッシュ化されたパスワードのペアをファイルの最後に追加します。 追加したい数のログインに対してこのコマンドを繰り返すことができます。
次に、EclipseTheiaをデプロイするための構成を作成します。 eclipse-theia-compose.yaml
という名前のファイルに保存します。 テキストエディタを使用して作成します。
- vi eclipse-theia-compose.yaml
次の行を追加します。
version: '2.2'
services:
eclipse-theia:
restart: always
image: theiaide/theia:next
init: true
environment:
- VIRTUAL_HOST=theia.your-domain
- LETSENCRYPT_HOST=theia.your-domain
この構成では、eclipse-theia
という単一のサービスを定義し、restart
をalways
およびtheiaide/theia:next
にコンテナーイメージとして設定します。 また、init
をtrue
に設定して、コンテナー内でEclipseTheiaを実行するときにメインプロセスマネージャーとしてinit
を使用するようにDockerに指示します。
次に、environment
セクションでVIRTUAL_HOST
とLETSENCRYPT_HOST
の2つの環境変数を指定します。 前者はnginx-proxy
に渡され、コンテナを公開するドメインを指示します。後者はLet’s Encryptアドオンによって使用され、TLS証明書を要求するドメインを指定します。 VIRTUAL_HOST
の値としてワイルドカードを指定しない限り、それらは同じである必要があります。
theia.your-domain
を目的のドメインに置き換えてから、ファイルを保存して閉じてください。
次に、以下を実行してEclipseTheiaをデプロイします。
- docker-compose -f eclipse-theia-compose.yaml up -d
最終的な出力は次のようになります。
Output...
Pulling eclipse-theia (theiaide/theia:next)...
next: Pulling from theiaide/theia
63bc94deeb28: Pull complete
100db3e2539d: Pull complete
...
Digest: sha256:c36dff04e250f1ac52d13f6d6e15ab3e9b8cad9ad68aba0208312e0788ecb109
Status: Downloaded newer image for theiaide/theia:next
Creating eclipse-theia_eclipse-theia_1 ... done
次に、ブラウザーで、EclipseTheiaに使用しているドメインに移動します。 ブラウザに、ログインを求めるプロンプトが表示されます。 正しいクレデンシャルを入力したら、Eclipse Theiaに入り、すぐにエディターGUIが表示されます。 アドレスバーに、接続が安全であることを示す南京錠が表示されます。 これがすぐに表示されない場合は、TLS証明書がプロビジョニングされるまで数分待ってから、ページをリロードしてください。
クラウドIDEに安全にアクセスできるようになったので、次のステップでエディターの使用を開始します。
ステップ3—EclipseTheiaインターフェースを使用する
このセクションでは、EclipseTheiaインターフェースのいくつかの機能について説明します。
IDEの左側には、サイドパネルで最も一般的に使用される機能を開く4つのボタンが縦に並んでいます。
このバーはカスタマイズ可能であるため、これらのビューを別の順序に移動したり、バーから削除したりできます。 デフォルトでは、最初のビューは、プロジェクトの構造のツリーのようなナビゲーションを提供するエクスプローラーパネルを開きます。 ここでフォルダとファイルを管理できます。必要に応じて、それらを作成、削除、移動、および名前変更します。
ファイルメニューから新しいファイルを作成すると、空のファイルが新しいタブで開きます。 保存すると、エクスプローラのサイドパネルでファイルの名前を表示できます。 フォルダを作成するには、エクスプローラのサイドバーを右クリックし、新しいフォルダをクリックします。 フォルダの名前をクリックしたり、ファイルやフォルダを階層の上位にドラッグアンドドロップして新しい場所に移動したりすることで、フォルダを展開できます。
次の2つのオプションは、検索および置換機能へのアクセスを提供します。 続いて、 Git など、使用している可能性のあるソース管理システムのビューを示します。
最後のビューはデバッガーオプションであり、パネルでデバッグするためのすべての一般的なアクションを提供します。 デバッグ設定はlaunch.json
ファイルに保存できます。
GUIの中心部分はエディターであり、コード編集用にタブで区切ることができます。 編集ビューをグリッドシステムまたはサイドバイサイドファイルに変更できます。 最新のすべてのIDEと同様に、EclipseTheiaはコードの構文の強調表示をサポートしています。
CTRL+SHIFT+`
と入力するか、上部のメニューで Terminal をクリックし、 New Terminal を選択すると、ターミナルにアクセスできます。 ターミナルが下のパネルで開き、その作業ディレクトリがプロジェクトのワークスペースに設定されます。このワークスペースには、エクスプローラのサイドパネルに表示されるファイルとフォルダが含まれています。
Eclipse Theiaインターフェースの概要を調べ、最も一般的に使用される機能のいくつかを確認しました。
結論
これで、DockerComposeとnginx-proxy
を使用してCentOS7サーバーにインストールされた多用途のクラウドIDEであるEclipseTheiaができました。 無料のLet’sEncryptTLS証明書で保護し、ユーザーからのログイン資格情報を要求するようにインスタンスを設定しました。 ソースコードとドキュメントを個別に処理することも、チームと共同で作業することもできます。 追加の機能が必要な場合は、独自のバージョンのEclipseTheiaを作成してみることもできます。 これを行う方法の詳細については、 Theiadocsにアクセスしてください。