WebサーバでVisual Studio Codeを動かせばiPadからでも使える！code-serverを試す

ちょっと出かける程度の時は、iPadとSmart Keyboardだけを持ち出すということをしています。
急に開発の仕事をしないといけなくなることが、たまにあるのですが、そういう時もVPNとVNCで自宅のMacBook Proにアクセスできるようにしているので、なんとかなります。

そんなことをしたいのも、SoftEtherでVPN構築した理由だったのですね。

SoftEtherを使ってDS-Lite環境の会社サーバに接続する

昨日の投稿で、DS-Lite環境だと、IPv4アドレスが他のユーザと共有になり、一部のポートのみしか占有になら…

inoccu.com

code-serverがあれば、ブラウザさえあれば開発できる！

iPadで開発仕事がどこまでできるのだろう？と思って、いろいろ調べてみると、code-serverというものがあることに気づきました。

MacBook Proでも、Surfaceでも愛用しているテキストエディタVisual Studio Codeなのですが、これは内部的にはWeb技術で作られています。GitHubのAtomとかもそうですね。
ということは、Visual Studio CodeをWebアプリとして動かすこともできるのではないかと…。そう、考えた人がいるわけですね。

それが、code-serverです。

GitHub – coder/code-server: VS Code in the browser

VS Code in the browser. Contribute to coder/code-server development by creating an account on GitHub.

github.com

VPNサーバの構築をするためにAzure VMでUbuntu 18.04 LTS環境があるので、そこにイントールします。

rootではなくユーザ環境で、下記のコマンドを実行します。

curl -fsSL https://code-server.dev/install.sh | sh

これだけでOKです。

設定ファイルが$HOME/.config/code-server/config.yamlにありますので、少なくともpasswordの値を指定します。bind-addrは適宜変更します。code-serverを設置したサーバからのみアクセスする（Nginxからのリバースプロキシを設定する場合を含む）は127.0.0.1のままで良いですし、他のPC等からcode-serverに直接アクセスする場合は0.0.0.0にします。8080番ポートを他に使っているなら、それも変更します。

bind-addr: 127.0.0.1:8080
auth: password
password: パスワード
cert: false

code-serverの起動は、これだけです。

code-server

常時起動する場合は、このようにしましょう。

systemctl --user enable code-server

rootで起動しないので、--userオプションを指定します。

私の環境では、さらにNginxからのリバースプロキシを設定しました。

あとは、リバースプロキシを設定したURLにアクセスすると…

なんということでしょう！iPadのSafariでVisual Studio Codeが動いている！！

Extensionも使えます。Japanese Language Pack for Visual Studio Codeをインストールすれば、このとおり日本語化！

なかなか使い出がありそうなので、有効活用していきたいと思います！

（続編）Tipsをいくつか書きました。

iPadでVisual Studio Codeを使うためのcode-serverのTips

先日、適当なサーバ上でcode-serverを動かせば、Webブラウザさえあれば、iPadからでもVisual…

inoccu.com