Raspberry Pi 4 Model Bを用いたGUIプログラムの作成手順と必要なもの

Raspberry Pi 4 Model Bを用いたGUIプログラムの作成手順と必要なものを以下に示します。GUIはHTML、CSS、JavaScriptで作成し、GPIOの状態に基づいて背景色を変更します。

## 必要なもの

1. Raspberry Pi 4 Model B

2. Raspberry Pi OS（Raspberry Pi OS Lite）

3. MicroSDカード（8GB以上）

4. HDMIケーブル

5. モニター（2台）

6. ジャンパーケーブル

7. Breadboard（ブレッドボード）

8. Python3（RPi.GPIOライブラリ）

9. Webサーバー（例えば、Flask）

## 構築手順

### 1. Raspberry Pi OSのインストール

1. Raspberry Piの公式サイトからRaspberry Pi Imagerをダウンロードし、MicroSDカードにRaspberry Pi OS Liteをインストールします。

2. Raspberry PiにMicroSDカードを挿入し、電源を入れます。

3. 初回起動時に必要な設定（Wi-Fi設定、地域設定など）を行います。

### 2. 必要なパッケージのインストール

Raspberry PiにSSHで接続し、以下のコマンドを実行して必要なパッケージをインストールします。

```bash

sudo apt update

sudo apt upgrade

sudo apt install python3 python3-pip

sudo pip3 install flask RPi.GPIO

```

### 3. Webサーバーの設定（Flask）

Flaskを使って簡単なWebサーバーを設定します。

#### ディレクトリ構造

```

/home/pi/webapp/

    ├── templates/

    │ └── index.html

    ├── static/

    │ └── styles.css

    └── app.py

```

#### `app.py`

```python

from flask import Flask, render_template

import RPi.GPIO as GPIO

import time

app = Flask(__name__)

GPIO.setmode(GPIO.BCM)

GPIO.setup(21, GPIO.IN, pull_up_down=GPIO.PUD_DOWN)

@app.route('/')

def index():

    background_color = "white"

    if GPIO.input(21) == GPIO.HIGH:

        background_color = "green"

    return render_template('index.html', background_color=background_color)

if __name__ == '__main__':

    app.run(host='0.0.0.0', port=5000)

```