RasPi4(Ubuntu20.04)でcode-serverの建て方とつなぎ方

はじめに

どうも,Keymaleです.iPadを買ったのですが,VScodeがアプリストアにないため使えません.どうしてもVScodeを使いたいと思っていたところ,coderなるものを見つけました.これは,サーバーを建てて,そこにブラウザからアクセスすることで,ブラウザ上でVScodeが使えるというなんとも便利なものです.

今回は2つの使い方を紹介します.
1つはラズパイ上でcoder-servserを起動して,ラズパイ上でVScodeを使う方法.
もう1つはラズパイ上でcoder-serverを開いて,同じローカルエリアネットワークに接続している他の機器,今回はiPadから接続します.つまり同じ家のネットワーク内の機器からの接続になります.

使うラズパイは4でUbuntu20.04をOSに使っているものになります.

coderのインストール

単純にラズパイでVScodeを使うなら,VScodeのパッケージインストールでできますが,あえてcoderを使います.

公式のgithubにインストールの仕方が書いてあります.が,以下のコマンドを打てばインストールが始まります.

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

インストールが終わったら,一回リブートしましょう.
もし上のコマンドでうまく行かない場合は,直接以下のコマンドを打ちましょう

$ curl -fOL https://github.com/cdr/code-server/releases/download/v3.4.1/code-server_3.4.1_arm64.deb

今回はラズパイなので,armのパッケージを取ってきています.もしラズパイ以外でやられていて,armじゃなくてamdだよという内容のエラーが出た場合は

$ curl -fOL https://github.com/cdr/code-server/releases/download/v3.4.1/code-server_3.4.1_amd64.deb

こちらのコマンドにしてください. ダウンロードが終わったら,ラズパイの方は

$ sudo dpkg -i code-server_3.4.1_arm64.deb

それ以外の方は

$ sudo dpkg -i code-server_3.4.1_amd64.deb

でインストールしてください.インストールが終わったら一度リブートしておきましょう.

$ sudo reboot

これで準備は完了です.

ラズパイでVScodeを使う

リブートが終わったら,以下のコマンドでcode-serverを建てましょう.

$ code-server

バックグラウンドで立てる場合は

$ systemctl --user enable --now code-server

です.バックグラウンドの場合は終了の仕方は

$ systemctl --user disable --now code-server

になります.サーバーを建てたら,ブラウザでhttps://127.0.0.1:8080.と入れると,VScodeのページに飛ぶ前にパスワードを聞かれます.パスワードは

~/.config/code-server/config.yaml

に書かれていますので,コピペしましょう.
これでラズパイでVScodeが使えるようになりました.

iPadでVScodeを使う

先程の

~/.config/code-server/config.yaml

のファイルの中身は

bind-addr: 127.0.0.1:8080
auth: password
password: ****************
cert: false

こんな感じになっていると思います.bind-addrとpasswordを書き換えます.
bind-addrはifconfig等で自分のローカルアドレス(192.168.**.**:****)を入れましょう.最後の四桁はポートになります.とりあえず5000かなにかを入れておきましょう.passwordは自分のわかりやすいものを入れましょう.

ここでもしファイアウォールを設定している方は5000番のポートを開放しましょう.

$ sudo ufw enable
$ sudo ufw allow 5000
$ sudo ufw reload
$ sudo ufw status

最後のステータスの確認で5000番がALLOWになっていればOKです.

サイドcode-serverを起動し,iPadからhttps://192.168.**.**:5000.をブラウザから入力すれば,無事iPadでVScodeが使うことができます.

便利な時代になったものですね.