3
VS Code を使ってブラウザから Raspberry Pi をリモートでプログラミングする方法

Raspberry Piのコードをリモートで編集することは可能ですが、作業環境をセットアップするためにいくつかの手順を踏む必要があります。通常は、SSHを有効にしてターミナルで接続し、SFTP接続でRaspberry Pi上のファイルにアクセスするか、ヘッドレスRaspberry Piセットアップ後にVNC接続を実行します。しかし、これらの方法にはそれぞれ欠点があります。ターミナルでテキストベースのエディタしか使えなかったり、頻繁にファイルを再アップロードしたり、リモートデスクトップの速度が遅くなったりするなどです。 

しかし、もしRaspberry Piで、ノートパソコンやタブレットなど、ネットワーク上の他のデバイスからアクセスできるWebベースのインターフェースを使ってコードを書けたらどうでしょう?今ならそれが可能になります。このチュートリアルでは、デバイスのブラウザからMicrosoftのVisual Studio Codeアプリケーションでプログラミングできるツール、code-serverを紹介します。もちろん、Raspberry Piなので、Visual BasicやC#などのMicrosoft言語ではなく、PythonなどのRaspberry Pi対応言語やJavaScriptなどのWeb対応言語を使用します。 

1.ターミナルで次のコマンドを入力して、   code-server をダウンロードしてインストールします。

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

2.サーバーをバックグラウンドでサービスとして実行して、起動時にコード サーバーを自動的に起動します。

systemctl --user enable --now code-server

3. Geany で編集するために 設定ファイルを開きます。

geany /home/pi/.config/code-server/config.yaml

4.バインド アドレスを変更して、ネットワーク上の任意のデバイスが接続できるようにします。 

Tom's Hardware の最高のニュースと詳細なレビューをあなたの受信箱に直接お届けします。

0.0.0.0:8080

Raspberry Pi コードサーバー

(画像提供:Tom's Hardware)

5.パスワードを raspberry に変更します。Ctrl + X、Y、Enter の順に押して保存し、終了します。

6.右上隅のネットワーク アイコンの上にマウス カーソルを置いて、IP アドレスを取得します。

7. Raspberry Piを再起動し、 

8. 同じネットワーク上のPCでブラウザを開き、Raspberry PiのIPアドレスに続けて:8080を入力します。例えば

192.168.0.6:8080

9.パスワード「raspberry」を使用してログインします。 

Raspberry Pi コードサーバー

(画像提供:Tom's Hardware)

10. 「ツールと言語」の下にある「Python」をクリックして、Python 3 のサポートをインストールします。

Raspberry Pi コードサーバー

(画像提供:Tom's Hardware)

code-server と VS Code が他の初心者向けエディターと異なるのは、作業方法に合わせて拡張できる点です。

Raspberry Pi コードサーバー

(画像提供:Tom's Hardware)

プロジェクト ファイルをフォルダーにグループ化して、大規模なプロジェクトで生成される多数のファイルを整理することができます。

Raspberry Pi コードサーバー

(画像提供:Tom's Hardware)

Gitなどのバージョン管理システムにコードを保存するソース管理ツールがあります。エディター内で作業しながらプロジェクトを公開できます。

Raspberry Pi コードサーバー

(画像提供:Tom's Hardware)

コードをステップ実行することで、発生したバグや問題をリアルタイムで確認できます。コードが各タスクを実行する際に、一時停止、巻き戻し、再開、停止といった操作が可能です。

Raspberry Pi コードサーバー

(画像提供:Tom's Hardware)