你將在課堂中，從零開始入門 React.js，並獨立完成一個物聯網的溫度監控儀表板（Real-time Dashboard）。課堂將步驟式引導：以 Flux 模式來串連 WebSocket 通訊協定，以接收 Real-Time Sensor Data。
不知從何下手學習 React 嗎？即便知道從何處找尋正確文件學習，但花很多時間看文件、讀範例，還是覺得不能掌握 React？Jollen 與 Casear 二位 Web Fullstack Developer 開發者，共同設計與規劃高效率的 React 入門課程。透過 2 個上機專題：SlideShow 與 Real-time IoT Dashboard，讓 React 初學者 6 小時內，跑完入門的實作流程，有效率地成為 React 前端使用者。
本課程採用工作坊形式，學習 React 的入門知識（Level 101）。React 101 實戰教學的理念：有效率地入門 React 前端開發。
- 第 1 課：React 101 入門實作
- Node.js 與 npm 操作
- React Biolerplate 開發環境演練
- React 在 MVC 架構的角色
- 關於 React Views 的觀念介紹
- Component 的建立與使用
- JSX 語法簡單上手
- ES6 (ES2016) 語法練習與 Babel
- 第一個 Web Frontend
- 第 2 課：React 101 基礎與理論架構
- React 的 Virtual DOM 技術介紹
- React 的 MVC 架構討論
- 認識 State 與 State Container
- 關於 View 與 Single-Page Application 的討論
- 第 3 課：React 與 Flux 架構模式演練
- Flux 架構模式的使用場景
- 5 個步驟學會 Flux 模式
- 使用 Flux 模式整合 Backend APIs
- 使用 Flux 模式整合 IoT real-time data
| React 101 入門實作 | React 101 基礎與理論架構 | Flux 架構模式 |
|---|---|---|
| React | ES6 | Reactive |
| JSX | Babel | Dispatcher |
| Component | Virtual DOM | Stateless |
技術主題這麼多，請看以下說明，了解我們如何為初學者規劃 React 101 工作坊。
課程內容分為 3 個部份：React 實作、理論架構與 Flux 模式。React 實作的部份，主要的內容如下：
- 認識 React 與 Component 觀念
- React 101 上手操作
- JSX 撰寫
- Frontend 製作
理論架構的部份，會講解必須知道的入門觀念，內容如下：
- ES6 重點語法
- Babel 重點導覽
- Vritual DOM 重點導覽
上述主題是採用解說的方式，並不會有太深入的實作，或是理論討論；目的是搭配 React 101 的實作，在實作的過程，一併建立基本的理論基礎。
學習 Flux 架構模式，是為了能撰寫高度可維護，以及更大型的 Web App：
- 了解 Reactive 程式設計模式
- 認識 Dispatcher，以及了解 Unidirectional data flow
- 認識 Stateless component，以及 Flux 模式的精神
- Step-by-step 方式將 Flux 模式演練一次
本課程採取工作坊形式，教學定位是「初學者入門與上手」。
React 101 採用工作坊的形式，搭配 2 個專題：
- SlideShow 專題，讓初學者完整實作一次 React 的入門（Level 101 實作流程）
- Real-time IoT dashboard 專題，讓初學者完整演練整個 Flux 模式實作，並再次練習 React 入門觀念
本課程適合：
- Web Frontend 初學者
- 想認識 Single-page application 的初學者
- 想開始接觸 React 的設計師
- 想認識 React 前端技術的產品經理
Jollen，Node.js 全端開發者、Moko365 的技術總監暨講師。正使用 React 與 Node.js 開發 Decentralized IoT 與 P2P IoT 的專案。
Casear，對於前後端技術皆有興趣，曾於 Microsoft 與 TrendMicro 任職，於 2012 年獲得 Node.js Knockout 台灣區第一名。曾於 JSDC 2014、2015 擔任講師，也是 SlideNow（線上 Markdown 編輯 Slides）的創辦人。目前興趣轉向 IoT，於 2015 年建立 KitchBot，轉至於廚具的系統分享與建立，並獲得聯發科穿戴式比賽亞軍。
- 時間：平日下午班，2 個下午、共計 6 小時
- Day 1: 2016/10/5（三）14:00-17:00
- Day 2: 2016/10/6（四）14:00-17:00
- 地點： 台北市博愛路 25 號 3F
- 2016/3/27: 台北班 React 101 實戰教學：開始用 React 打造 Web Frontend (第 2 期，已結訓)
- 2016/1/23: 台北班 React 101 實戰教學：開始用 React 打造 Web Frontend (第 1 期，已結訓)