Raspberry Pi 4 Model B 環境構築【リモート環境構築編】

# はじめに

[Raspberry Pi 4 Model B 環境構築【OSインストール編】](https://qiita.com/tkmsk/items/ef44e397ba9b2634cbcf)で環境構築をしたRaspbery Piが机の上の配線地獄にしたので、机の上をすっきりさせるためにリモート環境を構築した手順を残します。
ssh接続はOSインストール編にて実施済み。

# 実現したいこと

* Raspbery PiをAC電源ケーブル以外挿さなくても使えるようにしたい
* とはいえ、GUIも使えるようにしておきたい

# 環境

* 作業PC
  * OS：Windows 11 Home
  * Version：22H2
  * プロセッサ：11th Gen Intel(R) Core(TM) i7-1185G7 @ 3.00GHz 3.00 GHz
  * RAM：16GB
* Raspberry Pi 関連
  * ケース、ファン、ヒートシンク、電源
    * [Miuzei 最新 Raspberry Pi 4 ケース](https://www.amazon.co.jp/Miuzei-Raspberry-%E9%9B%BB%E6%BA%90%E3%82%A2%E3%83%80%E3%83%97%E3%82%BF%E3%83%BC-B%E3%81%A8%E3%82%82%E5%AF%BE%E5%BF%9C%EF%BC%88Raspberry-%E6%9C%AC%E4%BD%93%E5%90%AB%E3%81%BE%E3%82%8A%E3%81%BE%E3%81%9B%E3%82%93%EF%BC%89/dp/B07H2WKYBF/ref=sr_1_1?__mk_ja_JP=%E3%82%AB%E3%82%BF%E3%82%AB%E3%83%8A&crid=ZA3T1UYS2NOI&keywords=Miuzei%2B%E6%9C%80%E6%96%B0%2BRaspberry%2BPi%2B4%2B%E3%82%B1%E3%83%BC%E3%82%B9%2B%E3%83%A9%E3%82%B9%E3%83%99%E3%83%AA%E3%83%BC%2B%E3%83%91%E3%82%A44%2B5.1V%2B3A%2BUSB-C%2B%E9%9B%BB%E6%BA%90%E3%82%A2%E3%83%80%E3%83%97%E3%82%BF%E3%83%BC%2B%E5%86%B7%E5%8D%B4%E3%83%95%E3%82%A1%E3%83%B3%2B%E3%83%92%E3%83%BC%E3%83%88%E3%82%B7%E3%83%B3%E3%82%AF%E3%83%A9%E3%82%BA&qid=1696061057&s=electronics&sprefix=miuzei%2B%E6%9C%80%E6%96%B0%2Braspberry%2Bpi%2B4%2B%E3%82%B1%E3%83%BC%E3%82%B9%2B%E3%83%A9%E3%82%B9%E3%83%99%E3%83%AA%E3%83%BC%2B%E3%83%91%E3%82%A44%2B5.1v%2B3a%2Busb-c%2B%E9%9B%BB%E6%BA%90%E3%82%A2%E3%83%80%E3%83%97%E3%82%BF%E3%83%BC%2B%E5%86%B7%E5%8D%B4%E3%83%95%E3%82%A1%E3%83%B3%2B%E3%83%92%E3%83%BC%E3%83%88%E3%82%B7%E3%83%B3%E3%82%AF%E3%83%A9%E3%82%BA%2Celectronics%2C154&sr=1-1&th=1)
  * SD カード
    * [SanDisk Extreme SDSQXAT-032G-GH3MA](https://www.amazon.co.jp/gp/product/B0B21BXZ6V/ref=ppx_yo_dt_b_asin_title_o03_s00?ie=UTF8&th=1)

# 概要

0. VNCで接続
0. モニターの接続なしでもVNCで画面が表示できるように設定
0. Visual Studio Code から ssh接続できるようにする

## VNCで接続

* 「Raspberry Pi」アイコンをクリックし、「設定 > Raaspbery Piの設定」をクリックする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/3b23c3f8-f2e1-5c8e-2800-35533fa0fb8e.jpeg">

* 「Raspbery Piの設定」画面が表示されたら、「インターフェイス」タブの「VNC」を有効にし、「OK」をクリックする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/ba087f8f-4327-785c-62b4-e9f24ac42cc2.jpeg">

* [公式サイト](https://www.realvnc.com/en/connect/download/viewer/)からVNC Viewerをダウンロード

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/854ebde7-b2a1-ad78-f854-4bf82963addf.png">

* 検索バーにホスト名を入力し、Enterを押す

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/2eb16135-d41a-9c79-d273-a6eaf24e4bae.png">

* 初めて接続するときは警告画面が出るので、「Continue」をクリックする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/f558bfeb-6140-a4a7-737a-9db2e92414a6.png">

* Raspberry Piのユーザー名とパスワードを入力して「OK」をクリックする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/723dec58-1bcc-a1f1-736a-cee9667efb1e.png">

## モニターの接続なしでもVNCで画面が表示できるように設定

起動時にモニターを接続していない場合、VNCで接続できないので、設定を変更する必要がある。

* sshで接続し、`/boot/config.txt`の`hdmi_force_hotplug`を有効にする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/a3f6e18c-525a-4738-d4e4-699ee9ac393e.png">

* `reboot`を実行し、再起動する

## Visual Studio Code(VSCode) から ssh接続できるようにする

* VSCode の拡張機能の Remote SSH をインストールする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/645224a8-4bce-5b64-669f-2cfb880821a6.png">

* インストール後、「リモート(トンネル/SSH)」を選択し、「歯車」アイコンをクリックする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/37214444-ad69-8266-6ca5-054f5e4cddab.png">

* 「<ホームフォルダ>\.ssh\config」を選択する

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/2444f0ba-2347-92a4-6a0c-9988163f2798.png">

* 「config」ファイルに以下のように設定する

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/b61be1a5-35c7-afcd-7eb2-89caa585a817.png">

* リモートエクスプローラーで「raspberrypi.local」横のアイコンをクリックする

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/279e0751-b6ed-2908-a66f-9d05af6bacd2.png">

* リモート先のプラットフォームは「Linux」を選択する

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/901939ff-e593-d572-59d2-31ca286ba432.png">

* 「続行」を選択する

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/f0554284-37d0-2cf3-a597-b2e40abddf4f.png">

* パスワードを入力し、Enter を入力する

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/964816fa-ca87-3ba6-75ac-232a42c40523.png">

* Raspberry Pi と ssh 接続に成功した場合は、以下の画像のように接続先が表示される

<img width="80%" alt="" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1561074/e3cc8d27-ccec-f988-2f4e-dca2f5e3081f.png">


# 備考

## モニターを接続せずにRaspberry PiのIPアドレスを確認する

0. コマンドプロンプトで`for /l %i in (0,1,255) do ping -w 1 -n 1 192.168.1.%i`を実行する
0. コマンドプロンプトで`arp -a`を実行する
0. 当方のRaspberry PiのMACアドレスが`d8-3a-dd-57-ab-5a`なので、IPアドレスが`192.168.2.50`なことがわかる

# まとめ

VNCで見た時の解像度がいけていないが、いったん使えるようになったので、OKか。。。
今後もよい設定があれば随時更新していきます。

# 参考

* [Raspberry Pi 4にSSHとVNCで接続してみた](https://dev.classmethod.jp/articles/raspberry-pi-4-ssh-vnc-remote/)
* [同じLAN内に接続したRaspberry PiのIPアドレスを調べる](https://qiita.com/xshell/items/af4e2ef8d804cd29e38e)