<style>
.main{
}
.main img{
border-radius:10px;
}
.main h1{
text-align: center;
border: none;
color:4B4B4B;
letter-spacing: 3px;
}
.main h6{
text-align:right;
color:#F4AA14;
font-size:18px;
}
.main code{
background-color:#FFF0D1;
padding: 8px 10px;
border-radius: 20px;
margin-right:7px;
}
.main h2{
background-color:#0B8D97;
color:#fff;
width: max-content;
padding: 7px 25px 7px 17px;
border-top-right-radius: 40px;
border-bottom-right-radius: 40px;
border-bottom: none;
margin-top:46px;
margin-bottom: 25px;
}
.main h2 img{
padding-bottom: 4px;
border-radius:0;
}
.main p,li{
font-size: 18px;
line-height: 29px;
letter-spacing: 0.15em;
color:#525252;
}
.main .result{
background-color:#0B8D97;
padding:0.8rem 1rem 1rem 1rem;
border-radius: 10px;
}
.main .result h3{
text-align:center;
color:#fff;
margin-bottom:3rem;
}
.main .result h3 img{
margin-bottom:0.5rem
}
.main .result .pic img{
border: 5px solid #FFFFFF;
}
.main .pic{
text-align:center;
width: 84%;
margin: auto;
margin-top: 2rem;
}
.pic p{
color:#fff;
text-align:left;
font-size:1.8rem;
line-height:4rem
}
</style>
<div class="main">
# PM2.5 空氣偵測器+雲端伺服器實作，打造客製化偵測站、開發 APP 掌握環境空氣狀況
###### `初階` 3 小時
##  課程目的
PM2.5的議題層出不窮，空氣中的危害與自身健康密不可分，該如何即時得知空氣品質呢？不妨自建即時監控數據的空氣偵測站吧！課程不同於市面上的空氣盒子，所有監控模式皆是自己打造而成，實現環境數據自己掌握。最後教您Google Blockly 積木包裝技巧，將自己的積木匯入 Webduino 雲端平台使用，並開發 APP 監控各地區空氣品質狀態。
##  課程目標
1. 快速學會使用 Webduino 技術經由 WiFi 控制開發板
2. 學習如何抓取 Open Data，結合公開偵測站的空氣品質數據
3. 學習 Google Blockly 積木編程技術，掌握自訂積木技巧
4. 結合動態圖表 / Google Maps 顯示資料，輕鬆擁有數據收集與統計能力
5. 學習自己架 Web Server，打造全年無休的智能監控裝置
6. 輕鬆打造 APP，隨時隨地進行個人化數據監控
7. 全套軟硬整合應用教學，培養跨領域的思維與開發等能力
8. 認識講師，遇到困難有人回答。書本資料太多、網路資料太分散，現場有人教學得快。
##  課程內容
1. Webduino 基本介紹
- Web x Arduino 原理剖析
- 範例及影片介紹
- 雲端註冊、管理、燒錄韌體、監控裝置狀態
2. 打造 PM2.5 空氣偵測站
- 基本傳感器控制 (三色燈、光感、按鈕)
- 手把手組裝教學
- 手機監控空氣品質狀態
- 以警示燈顯示空氣超標
- 電腦朗讀自動回報空氣品質狀態
3. 環境資料收集與統計
- 以動態圖表形式顯示不同懸浮粒子比例
- 偵測環境數值儲存於 Firebase
4. 結合 Google Maps 顯示空氣品質狀態
- 匯入自訂積木 - Google Maps
- 將 PM2.5 同時顯示於 Google Maps
5. 自訂 PM2.5 Open Data 積木
- 抓取 PM2.5 Open Data 資料
- Google Blockly 積木架構
- 開發 Open Data 積木
- 匯入 Webduino Blockly 自訂積木
- 將自訂積木程式上傳至 Github
- 結合 Open Data 數據定位於 Google Maps 上
6. 結合開源 LoopBack 實現本機監控與紀錄
- 同時監測多個 PM2.5 裝置於網頁中
- 本機安裝 LoopBack (學習架設 WebServer & DB)
- 從 Webduino Blockly 匯出程式碼
- 監測與儲存 PM2.5 資料寫到資料庫
- 自建可查詢歷史數據的 PM2.5 偵測站
7. 物聯網專屬 App 開發
##  課前準備
* Smart 開發板 + USB線
* PM2.5 感測器+轉接板
* 杜邦線 (公公) x10
* 杜邦線 (公母) x10
* 蜂鳴器 x1
* LED燈 x3
* 麵包板
* 按鈕 ( Smart 內建 )
* 光感 ( Smart 內建 )
* 三色燈 ( Smart 內建 )
<div class="result">
###  成果展示
<div class="pic">
</div>
<div class="pic">
</div>
<div class="pic">
</div>
</div>