著者は、 Write for DOnations プログラムの一環として、 Free and Open SourceFundを選択して寄付を受け取りました。

序章

開発者ツールがクラウドに移行するにつれ、クラウドIDE(統合開発環境)プラットフォームの採用が増えています。 Cloud IDEは、Webブラウザーを介してあらゆるタイプの最新デバイスからアクセスでき、リアルタイムコラボレーションシナリオに多くの利点を提供します。 クラウドIDEでの作業は、プラットフォームの非互換性を最小限に抑えながら、あなたとあなたのチームに統合された開発およびテスト環境を提供します。 WebブラウザからアクセスできるクラウドIDEは、あらゆるタイプの最新デバイスから利用できます。

Eclipse Theia は、リモートサーバー上で実行され、Webブラウザーからアクセスできる拡張可能なクラウドIDEです。 視覚的には、 Microsoft Visual Studio Code と同様に表示および動作するように設計されています。つまり、多くのプログラミング言語をサポートし、柔軟なレイアウトを備え、端末が統合されています。 Eclipse Theiaを他のクラウドIDEソフトウェアと区別するのは、その拡張性です。 カスタム拡張機能を使用して変更できます。これにより、ニーズに合ったクラウドIDEを作成できます。

このチュートリアルでは、コンテナーオーケストレーションツールであるDocker Composeを使用して、EclipseTheiaをDebian10サーバーにデプロイします。 nginx-proxy を使用してドメインで公開します。これは、コンテナーのリバースプロキシとして機能するようにNginxを構成するプロセスを簡素化するDockerの自動システムです。 また、無料の Let’s Encrypt TLS証明書を使用してセキュリティで保護します。この証明書は、専用のアドオンを使用してプロビジョニングします。 最終的には、Debian10サーバーでEclipseTheiaを実行し、HTTPS経由で利用できるようにし、ユーザーにログインを要求します。

前提条件

  • root権限を持つDebian10サーバー、および2番目の非rootアカウント。 これを設定するには、Debian10初期サーバー設定ガイドに従ってください。 このチュートリアルでは、root以外のユーザーはsammyです。
  • サーバーにDockerがインストールされています。 Debian10にDockerをインストールする方法のステップ1ステップ2に従ってください。 Dockerの概要については、 Dockerエコシステム:一般的なコンポーネントの概要を参照してください。
  • サーバーにインストールされているDockerCompose。 Debian10に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の下に保存します。 次のコマンドを実行して、ディレクトリを作成します。

  1. mkdir ~/eclipse-theia

そこに移動します:

  1. cd ~/eclipse-theia

nginx-proxyのDockerCompose構成をnginx-proxy-compose.yamlという名前のファイルに保存します。 テキストエディタを使用して作成します。

  1. nano nginx-proxy-compose.yaml

次の行を追加します。

〜/ eclipse-theia / 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"

ここでは、Docker Composeが実行する2つのサービス、nginx-proxyとそのLet’sEncryptコンパニオンを定義しています。 プロキシの場合、イメージとしてjwilder/nginx-proxyを指定し、HTTPポートとHTTPSポートをマップし、実行時にプロキシにアクセスできるボリュームを定義します。

ボリュームは、定義されたサービスがフルアクセスできるサーバー上のディレクトリであり、後でユーザー認証を設定するために使用します。 これを実現するには、リストの最初のボリュームを使用します。これにより、ローカルの/etc/nginx/htpasswdディレクトリがコンテナ内の同じディレクトリにマップされます。 そのフォルダーで、nginx-proxyは、 htpasswd 形式(username:hashed_password)のユーザー認証用のログイン資格情報を含む、ターゲットドメインとまったく同じ名前のファイルを見つけることを想定しています。

アドオンの場合、Dockerイメージに名前を付け、ボリュームを定義することでDockerのソケットへのアクセスを許可します。 次に、アドオンがnginx-proxy用に定義されたボリュームへのアクセスを継承するように指定します。 どちらのサービスでもrestartalwaysに設定されており、クラッシュやシステムの再起動が発生した場合にDockerにコンテナーを再起動するように指示します。

ファイルを保存して閉じます。

次のコマンドを実行して構成をデプロイします。

  1. docker-compose -f nginx-proxy-compose.yaml up -d

ここでは、nginx-proxy-compose.yamlファイル名をdocker-composeコマンドの-fパラメーターに渡します。このパラメーターは、実行するファイルを指定します。 次に、コンテナを実行するように指示するup動詞を渡します。 -dフラグは、デタッチモードを有効にします。これは、DockerComposeがコンテナをバックグラウンドで実行することを意味します。

最終的な出力は次のようになります。

Output
Creating 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をインストールする必要があります。

  1. sudo apt install apache2-utils

apache2-utilsパッケージには、htpasswdユーティリティが含まれています。

/etc/nginx/htpasswdディレクトリを作成します。

  1. sudo mkdir -p /etc/nginx/htpasswd

ドメインのログインを保存するファイルを作成します。

  1. sudo touch /etc/nginx/htpasswd/theia.your_domain

theia.your_domainをEclipseTheiaドメインに置き換えることを忘れないでください。

ユーザー名とパスワードの組み合わせを追加するには、次のコマンドを実行します。

  1. sudo htpasswd /etc/nginx/htpasswd/theia.your_domain username

usernameを追加するユーザー名に置き換えます。 パスワードの入力を2回求められます。 それを提供した後、htpasswdはファイルの最後にユーザー名とハッシュ化されたパスワードのペアを追加します。 追加したい数のログインに対してこのコマンドを繰り返すことができます。

次に、EclipseTheiaをデプロイするための構成を作成します。 eclipse-theia-compose.yamlという名前のファイルに保存します。 テキストエディタを使用して作成します。

  1. nano eclipse-theia-compose.yaml

次の行を追加します。

〜/ eclipse-theia / 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という単一のサービスを定義し、restartalwaysおよびtheiaide/theia:nextにコンテナーイメージとして設定します。 また、inittrueに設定して、コンテナー内でEclipseTheiaを実行するときにメインプロセスマネージャーとしてinitを使用するようにDockerに指示します。

次に、environmentセクションでVIRTUAL_HOSTLETSENCRYPT_HOSTの2つの環境変数を指定します。 前者はnginx-proxyに渡され、コンテナを公開するドメインを指示します。後者はLet’s Encryptアドオンによって使用され、TLS証明書を要求するドメインを指定します。 VIRTUAL_HOSTの値としてワイルドカードを指定しない限り、それらは同じである必要があります。

theia.your_domainを目的のドメインに置き換えてから、ファイルを保存して閉じてください。

次に、以下を実行してEclipseTheiaをデプロイします。

  1. 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を使用してDebian10サーバーに多用途のクラウドIDEであるEclipseTheiaがインストールされました。 無料のLet’sEncryptTLS証明書で保護し、ユーザーからのログイン資格情報を要求するようにインスタンスを設定しました。 ソースコードとドキュメントを個別に処理することも、チームと協力することもできます。 追加の機能が必要な場合は、独自のバージョンのEclipseTheiaを作成してみることもできます。 これを行う方法の詳細については、 Theiadocsにアクセスしてください。