<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">
# LINE BOT x Webduino IoT開發實戰，打造 LINE聊天、氣象機器人，學會用 LINE直接控制 IoT裝置
###### `進階` 6 小時
##  課程目的
LINE BOT 還侷限在LINE 對話而已嗎？本課程讓你學會用LINE 控制IoT 裝置！從LINE BOT 基礎實作開始，開發聊天、氣象兩種機器人，進一步與 Webduino物聯網平台串接，讓LINE 直接控制物聯網裝置，例如在遠端控制家裡的電燈。
##  課程目標
1. 使用 LINE 搭配 Webduino物聯網平台，控制物聯網裝置。
2. 了解 LINE BOT 實作技術，架設後端服務與 LINE BOT 串接。
3. 掌握 Webduino 物聯網平台操控原理與程式碼撰寫。
4. 使用 Webduino 雲端平台串接自己的 LINE BOT。
5. 全套軟硬整合應用教學，培養跨領域的思維與開發等能力。
6. 認識講師，遇到困難有人回答。書本資料太多、網路資料太分散，現場有人教學得快。
##  課程內容
09:30 ~ 10:30 架設簡易後端
- Google Cloud Functions
- Google Apps Script
10:30 ~ 12:30 LINE BOT開發 1：聊天機器人
- 申請帳號與啟用
- 認識 Message API
- LINE BOT 接收與發送訊息
- LINE BOT 傳送表情貼圖、圖片、按鈕樣板
12:30 ~ 13:30 午休、交流
13:30 ~ 15:00 LINE BOT開發 2：氣象機器人
- 基礎網頁爬蟲，抓取氣象資訊
- LINE BOT 聊天問氣象
15:00 ~ 16:30 LINE BOT開發 3：Webduino 物聯網串接
- 使用 Webduino 雲端平台串接自己的 LINE BOT
- 使用 LINE 開關燈，控制Webduino Bit 5x5 全彩燈
##  課前準備
1. USB 電源線
2. Webduino Bit 開發板
3. 學員需具備 HTML/JavaScript 的基礎與使用經驗
4. 有 LINE 帳號
<div class="result">
###  成果展示
<div class="pic">
▲ 串接氣象資料 + Line 訊息通知
</div>
<div class="pic">
▲ 結合 Line Bot 訊息通知
</div>
</div>