
ノートパソコンを持ち歩く手間をかけずに、どこからでもコーディングできる方法をお探しですか? Visual Studio Codeの機能をWebブラウザで直接利用できる、堅牢なセルフホスト型アプリケーション、 code-serverのご利用をご検討ください。自宅のラボサーバーにcode-serverをセットアップすれば、コードとデータへのアクセスと制御が確保されたシームレスな開発環境を実現でき、サードパーティ製のクラウドIDEは不要になります。
コードサーバーとセルフホスティングのメリットを理解する
Code-serverはVS Codeをリモートサーバー上で実行し、あらゆるウェブブラウザからアクセスできるようにします。機能はデスクトップ版とほぼ同等で、自動補完、デバッグ、Git統合、各種拡張機能といった機能をサポートしています。この構成は、タブレットやChromebookなどの低消費電力デバイスに特に有利です。すべての計算タスクがサーバー上で実行されるため、どこからでもアクセス可能な一貫した環境が維持されます。
このアプリケーションをセルフホストすると、開発環境に対する比類のない制御、強化されたプライバシー、個人ドメインの使用、HTTPS の有効化、必要に応じてコンピューティング リソースを拡張しながらユーザー アクセスを管理するなど、さまざまな機能を柔軟にカスタマイズできるなど、いくつかの重要な利点が得られます。
始めるには、この便利なチートシートをチェックしてください。
Linuxへのコードサーバーのインストール
インストール プロセスに Docker を使用すると、コード サーバーのセットアップは簡単になります。
まず、次のコマンドで Docker Hub から公式の code-server イメージをダウンロードします。
sudo docker pull codercom/code-server
このコマンドは、コンテナの作成に進む前に、コード サーバー イメージの最新バージョンがローカルに保存されていることを確認します。

次に、一意のパスワードを指定して永続的なストレージを確保するコマンドを実行して、バックグラウンドで新しいコード サーバー コンテナーを開始します。
sudo docker run -d --name code-server -p 8443:8080 -v "$HOME/code-server-data:/home/coder/project" -e PASSWORD="my_password" codercom/code-server

コードサーバーの設定が完了したら、Webブラウザでhttp://localhost:8443と入力してアクセスします。コマンド実行時に設定したパスワードを入力しdocker run
、「送信」をクリックしてコードサーバーにログインします。

コードサーバーを使い始める
ログインすると、おなじみのデスクトップ版VS Codeによく似たインターフェースが表示されます。主要なコンポーネントの概要は以下のとおりです。
ファイルエクスプローラー
ファイルエクスプローラーを使えば、プロジェクト内を簡単に移動できます。フォルダーの閲覧、ファイルの開き方、新規ファイルの作成、プロジェクトの構造管理など、様々な操作を簡単に行えます。

エディタ
中央のエリアはエディターで、ほとんどの作業はここで行います。ファイルを開くと、デスクトップ版のVS Codeと同じように、ここにコードの作成とフォーマットが表示されます。

ターミナル
ターミナルはコードサーバーの下部に簡単に配置されています。上部のメニューから「ターミナル」→「新しいターミナル」を選択するか、キーボードショートカットのCtrl+を使って開くことができます。また、 + + を`押すことでもターミナルに素早くアクセスできます。CtrlShiftC

拡張機能
拡張機能はVS Codeの強力な機能です。サイドバーにある「拡張機能」タブを使用すると、リンター、テーマ、さまざまな言語サポートツールなどを含むVS Code拡張機能を参照、インストール、管理できます。

検索バーを使用して拡張機能を検索し、すぐにインストールしてアクティブ化することで、開発環境の機能が強化されます。
ブラウザベースのIDEをカスタマイズする
テーマの変更など、IDE の外観をカスタマイズするには、左下隅にある歯車アイコンをクリックし、「テーマ」にマウスを移動して、ドロップダウン メニューから「カラー テーマ」を選択します。

利用可能なテーマのリストが表示され、希望するテーマをプレビューして適用できます。

さらに、「拡張機能」タブから好みのテーマを簡単にインストールし、すぐに有効にすることができます。

さらに、歯車アイコンをクリックして「設定」を選択すると、その他の設定をカスタマイズできます。ここでは、エディターの動作、フォントサイズ、フォーマットなど、さまざまな設定を変更できます。

コードサーバーで最初のプログラムを作成して実行する
新しいファイルを作成するには、エクスプローラーパネルを使用するか、キーボード ショートカットCtrl+ Alt+を使用しますN。

「言語を選択」をクリックするか、ショートカットCtrl+を使用してプログラミング言語を選択しK、次にMをクリックして、Python などの目的の言語を選択します。

次のコードをエディターに貼り付けると、「Welcome to maketecheasier.com」が 3 回出力されます。
for i in range(3): print("Welcome to maketecheasier.com")
Ctrlこのプログラムを実行する前に、サーバーにPythonがインストールされていることを確認してください。 +を押してS適切な名前を付け、「OK」をクリックしてファイルを保存します。

CtrlPython スクリプトを実行するには、 +でターミナルを開き`、次のコマンドを実行します。
python3 mteExample.py

Linuxシステム上でcode-serverが正常に動作すれば、ブラウザベースの開発環境のメリットを享受できるようになります。テーマや拡張機能で環境をカスタマイズしたり、様々なプログラミング言語でコードを実行したり、カスタムドメインとHTTPSによる安全なアクセスを実現したりできます。次のステップとして、Gitワークフローの検討、本番環境でのSSL有効化、JupyterLab、Docker、PortainerなどのWebベースツールの統合など、環境の強化を検討し、ホームラボの機能を拡張しましょう。
コメントを残す