---
# System prepended metadata

title: ESP32 × AIOT

---

# ESP32 × AIOT
補充：[C++ 教學](https://hackmd.io/@BeiDesign/cplusplus)

<br>

## 1. ESP32 與物聯網基礎
### 1-1 什麼是物聯網（IoT）？
:::warning
**物聯網（Internet of Things, IoT）**
:::
物聯網就是**讓「物」會感覺、會思考、會回應**

**核心流程只有四步：**
> 感測 → 判斷 → 行動 → 回傳資料

![what-is-the-internet-of-things-iot](https://hackmd.io/_uploads/Bkvh1EtSbx.png)


<br>

### 1-2 感測器的角色
:::warning
**感測器就是「電子的感官」**
:::

| 人類  | 電子    |
| --- | ----- |
| 眼睛  | 光敏感測器 |
| 皮膚  | 溫度、濕度 |
| 耳朵  | 麥克風   |
| 平衡感 | 陀螺儀  |

![15_Types_of_Sensor_in_IOT](https://hackmd.io/_uploads/SJmFeEYrZx.png)

<br>

### 1-3 ESP32 的角色
:::warning
**ESP32 就是整個系統的「大腦」**
:::

它負責把感測器收到的資料整理起來，
依照程式規則做判斷，
再決定要不要控制裝置或把資料送上網。

| 任務 | 說明          |
| -- | ----------- |
| 接收 | 從感測器讀取數值    |
| 判斷 | 用程式決定接下來怎麼做 |
| 控制 | 開燈、響蜂鳴器、轉馬達 |
| 連網 | 把資料傳到雲端或手機  |



<br>

### 1-4 為什麼選 ESP32？
:::warning
**ESP32 = 控制 + 感測 + 無線通訊 一次到位**
:::

ESP32 的核心優勢：
- 內建 WiFi + BLE
- 雙核心處理器
- 記憶體 4MB
- 支援 OTA 遠端更新
- 腳位數多、功能完整
- 價格便宜、教學資源多
- 與 Arduino 語法高度相容

#### 和其他板子的差異：
| 板子      | 特點               |
| ------- | ---------------- |
| UNO     | 入門、無網路           |
| ESP8266 | 單核心、WiFi         |
| ESP32   | 雙核心 + WiFi + BLE |

![ESP8266-vs-ESP32-vs-Arduino-elcircuits.com_](https://hackmd.io/_uploads/B1vcNtCBWe.png =75%x)

<br>
<br>

## 2. 開發環境建立
### 步驟一：[下載 Arduino IDE](https://www.arduino.cc/en/software/)

![image](https://hackmd.io/_uploads/rJDXbrk8bg.png)



<br>

### 步驟二：設定「額外開發板管理員網址」

```
https://dl.espressif.com/dl/package_esp32_index.json
```

![圖解](https://hackmd.io/_uploads/S1W7iFRB-e.png)

<br>

### 步驟三：安裝 ESP32 開發板核心

![圖解](https://hackmd.io/_uploads/BkZSpFRSZx.png)

:::info
如果是第一次使用**按鈕會是 INSTALL**，不會是 UPDATE 喔！
:::

<br>

### 步驟四：安裝驅動程式
**驅動程式 = USB ↔ ESP32 翻譯官**

[點此下載安裝](https://drive.google.com/file/d/1OS8NOjKURKl4gYf9aDzj29-vPjeNifEG/view?usp=sharing)

![image](https://hackmd.io/_uploads/H1cXJ5ASbe.png)

<br>

### 步驟五：設定開發板

![圖解拷貝](https://hackmd.io/_uploads/B1Zk-qCH-l.png)

<br>

### 步驟六：設定通訊連接參數

![截圖 2026-01-22 下午1.18.14](https://hackmd.io/_uploads/ryHa7VyIbg.png)

<br>

### 環境測試
#### (1) Hello World

```cpp=
void setup() {
  Serial.begin(115200);
}

void loop() {
  Serial.println("Hello ESP32");
  delay(1000);
}
```

#### (2) 內建 LED

```cpp=
void setup() {
  pinMode(2, OUTPUT);
}

void loop() {
  digitalWrite(2, HIGH);
  delay(1000);
  digitalWrite(2, LOW);
  delay(1000);
}
```

<br>
<br>

## 3. 數位類比與腳位觀念
### 3-1 數位訊號 vs 類比訊號
#### 數位訊號（Digital）：
- 只有兩種狀態：**HIGH / LOW**
- 例子：按鈕、震動開關、磁簧開關...

#### 類比訊號（Analog）：
- 數值連續（0~4095 概念）
- 例子：可變電阻、光敏電阻、土壤濕度...

:::info
有些模組同時提供 **Digital + Analog**
:::

![下載](https://hackmd.io/_uploads/HymF7G1I-e.jpg)

<br>

### 3-2 ESP32 腳位觀念
#### 電源腳：
- 3.3V：提供 3.3V 給模組
- Vin：通常是 5V 輸入
- GND：地（接地）

:::info
**「所有模組一定要跟 ESP32 共地（GND 要相通）」**
:::

#### 一般 GPIO（Digital I/O）：
GPIOxx 就是你寫程式時用的「腳位數字」

#### 顏色標籤：
- **ADC（類比輸入）**
- TOUCH（觸摸感測）
- SPI / I2C / UART（通訊）

#### ⚠️ 需要注意的腳位：
- GPIO34–GPIO39 只能輸入（Input Only）
- GPIO6–GPIO11 系統快閃記憶體用（不要碰）

:::info
**「34–39 只能讀；6–11 不要用」**
:::

![uW3Th3P](https://hackmd.io/_uploads/HJ6RKzJ8Ze.png)

:::spoiler 對照圖
![1584374673-2956395738](https://hackmd.io/_uploads/H1jl59eIWe.png)
:::

<br>

### 3-3 常用指令
#### `pinMode(pin, mode)`：
- pin 設定腳位
- mode 宣告腳位是輸入還是輸出
    - `INPUT`
    - `OUTPUT`
    - `INPUT_PULLUP`

#### `digitalWrite(pin, level)`：
- pin 設定腳位
- mode 指定 GPIO 輸出 HIGH / LOW（控制裝置）
    - `HIGH`
    - `LOW`

#### `digitalRead(pin)`：
- pin 設定腳位
- 用途為讀取指定 GPIO 狀態（HIGH / LOW）

#### `delay(ms)`：
用途為讓程式延遲（毫秒）

:::info
**為什麼需要 delay(ms)？**
「因為 ESP32 跑得太快，不停下來，人類看不到、裝置也來不及反應」
:::

<br>

### 3-4 麵包版架構
#### 中間區域（放元件用）：
- 中間左右兩塊是水平相通
- 同一排的 5 個洞是連在一起的
- 不同排，不相通

#### 左右兩側電源軌（+ / −）
- 旁邊紅色（+）和藍色（−）是一整條垂直相通
- 常用來：
    - **紅色接 3.3V / 5V**
    - **藍色接 GND**

![2014043349YPQjAFmZ](https://hackmd.io/_uploads/BJEj44k8Zl.png)

<br>
<br>

## 實作紅綠燈系統
### 使用元件
LED 燈 × 3（紅、黃、綠）

![01](https://hackmd.io/_uploads/B1jmO4JI-g.png)

<br>

### 參考接法

| 元件 | 長腳 | 短腳 |
| -------- | -------- | -------- |
| 紅色 LED     | GPIO4（麵包版右側 5）     | GND     |
| 黃色 LED     | GPIO0（麵包版右側 6）     | GND     |
| 綠色 LED     | GPIO2（麵包版右側 7）     | GND     |

![紅綠燈系統_bb](https://hackmd.io/_uploads/Bkz8WorL-g.png =75%x)



<br>

### 參考程式碼
```cpp=
const int LED_G = 2; // 綠燈 pin
const int LED_Y = 0; // 黃燈 pin
const int LED_R = 4; // 紅燈 pin

void setup() {
  pinMode(LED_G, OUTPUT);
  pinMode(LED_Y, OUTPUT);
  pinMode(LED_R, OUTPUT);
}

void loop() {
  // 綠燈 5 秒
  digitalWrite(LED_G, HIGH);
  digitalWrite(LED_Y, LOW);
  digitalWrite(LED_R, LOW);
  delay(5000);

  // 黃燈 1 秒
  digitalWrite(LED_G, LOW);
  digitalWrite(LED_Y, HIGH);
  digitalWrite(LED_R, LOW);
  delay(1000);

  // 紅燈 3 秒
  digitalWrite(LED_G, LOW);
  digitalWrite(LED_Y, LOW);
  digitalWrite(LED_R, HIGH);
  delay(3000);
}
```

<br>
<br>

## 其他章節
**下一篇：[元件介紹](https://hackmd.io/@BeiDesign/Component-introduction)**


