Day 3｜先看懂 Edge Box 專案結構檔案

建立完整專案骨架，確認 MCU、Python 與網頁檔案都放在正確位置。

上一篇我們已完成 App Lab 安裝、UNO Q 連線與 Blink LED 測試，也把官方範例複製成 unoq-30days，今天要了解這份專案的目錄與基本檔案結構，先統一骨架建立再長血長肉。

專案目錄

UNO Q 的 App 專案包含 Arduino C++、Python 與網頁素材，檔案皆有固定位置，本系列固定使用下列結構，八個核心檔案分別放在專案根目錄、sketch、python 與 assets 資料夾，另外保留 .gitignore 。

unoq-30days/
├─ .gitignore
├─ README.md
├─ app.yaml
├─ sketch/
│  ├─ sketch.ino
│  └─ sketch.yaml
├─ python/
│  └─ main.py
└─ assets/
   ├─ index.html
   ├─ style.css
   └─ app.js

sketch 就代表 Arduino 的 MCU 端程式，python 代表 Linux 的 MPU 端程式，assets 則保存瀏覽器會讀取的內容，這種分類讓後續新增控制、通訊與畫面功能時，都能直接找到對應檔案。

專案根目錄只放整體設定與說明文件，實際執行的程式依環境分到三個資料夾，這樣整理的目的不只是讓畫面整齊，App Lab 建置時也能依照固定位置找到需要處理的內容，讀者打開專案後可以從資料夾名稱判斷程式屬於 MCU、MPU 或瀏覽器，不必逐一開啟檔案猜測。

八個檔案的用途

README.md 記錄專案目的與目錄說明，app.yaml 保存 App 名稱及服務設定，sketch.ino 放 Arduino C++ 程式，sketch.yaml 提供 MCU 建置資訊，main.py 放 Python 程式，index.html、style.css、app.js 分別負責網頁內容、外觀與互動。

至於設定檔app.yaml 和 sketch.yaml 主要提供 App Lab 建置所需資訊，README.md 則是留給開發者閱讀的說明，真正會在裝置上執行的是 sketch.ino 與 main.py，至於網頁三個檔案則要等 Web 功能啟用後才會出現在瀏覽器。

放入最小骨架

今天我們會用最精簡的結構讓 app.yaml 先保留專案名稱與空白服務設定，MCU 端只放 Arduino 必要的 setup() 與 loop()，Python 端輸出一行訊息，三個網頁檔案則先留下簡單頁面與註解。

# app.yaml
name: unoq-30days
description: "智慧路口 Edge Box 30 天實作"
ports: []
bricks: []

// sketch/sketch.ino
void setup() {
}

void loop() {
}

# python/main.py
print("Edge Box Python ready")

<!-- assets/index.html -->
<h1>智慧路口 Edge Box</h1>
<p>管理畫面尚未啟用</p>

/* assets/style.css：暫時留空 */

// assets/app.js：暫時留空

最小骨架的用途是把問題範圍縮小，MCU 端只有可編譯的基本函式，Python 端只有一行輸出，網頁端也只留下識別內容，若建置失敗，原因大多集中在檔名、資料夾位置或設定格式，不會同時混入接線、腳位與控制流程，完成這次檢查後再開始增加功能會比較容易追蹤錯誤來源。

執行結果

完成後回到 App Lab 按下 Run，MCU 的空白 Sketch 應可通過編譯，Python Console 應顯示 Edge Box Python ready，專案樹也要看得到八個核心檔案與 .gitignore，三項結果都正確便代表 Day 3 完成，也表示後續功能可以在同一份專案上持續累加。

若建置失敗，先檢查資料夾名稱、檔名及 YAML 縮排，sketch.ino 與 sketch.yaml 必須放在 sketch，main.py 必須放在 python，三個網頁檔案則統一放在 assets。

Python Console 沒有顯示訊息時，應確認 main.py 是否位於正確資料夾，MCU 編譯失敗則回到 sketch 檢查兩個檔案，今天尚未啟用 Web 服務，因此瀏覽器無法開啟管理頁面屬於正常結果，不需要為了看到網頁而提前修改 app.yaml。

本篇完成內容

• 建立 Edge Box 的完整專案目錄。
• 確認八個核心檔案的用途。
• 放入 MCU、Python 與網頁的最小骨架。
• 完成 App Lab 建置與 Python 啟動檢查。

接下來將修改 sketch/sketch.ino，建立第一個由 MCU 控制的號誌輸出。

下一篇｜接上第一個號誌輸出