Web全端程式設計
Desktop Application及Install Wizard 將漸漸消失!Web APP程式開發將成為應用程式開發主流,未來任何東西都會在網路上,而未來所有的軟體程式都將用瀏覽器來執行
瀏覽器的能力將會愈來愈強,別停留在Web不就是個人網頁而已,...No! 那是20年以前的狀況。未來Web APP程式開發將成為應用程式開發主流,未來任何東西都會在網路上,應用程式也幾乎依賴瀏覽器來執行!換言之,瀏覽器就可以跑任何應用程式,開發者不須再各別為Windows、Linux、MacOS、 Android APP、iPhone等平台寫程式了。真的寫不完,不要說寫連維護都很難,因為沒有這麼多資源,可以養這麼多人去維護這麼多平台的程式碼。當然,可以找一個可以精通兩個平台以上的工程師,但實在太少了。瀏覽器的功能會逐漸增強,用AJAX, WebSocket(一種TCP Socket) 就能用瀏覽器進行雙向多工通訊,透過Canvas就可以在瀏覽器進行2D/3D繪圖,這些都是瀏覽器功能不斷演進才有的面貌。
[100%實作導向]
在每一個技術除了給你最清楚的觀念外,都有講師設計好準備讓你融會貫通的範例程式,讓你快速進行演練。課程不囉嗦! 強調動手實戰。
[名師醍醐灌頂]
對於初學者一開始想要進入Web APP開發領域,通常會發現,這個領域技術推進的步調很快且技術間盤根錯節!
艾鍗師資最厲害的地方就是,很複雜的東西可以講得很簡單,一針見血把技術精髓道盡! 要快速掌握Web程式精髓,唯有觀念清楚,才能快速開發,不得其要領,將曠日費時。
學習目標
1. 清楚了解Web前後端架構與DOM架構。
2. 精通JavaScript 程式語言與除錯方法。
3. 學會用JQuery操作HTML、CSS及FORM表單處理。
4. 掌握Node.js 處理異步、單執行緒與非阻塞I/O等關鍵技術。
5. 學會AJAX 及Webscoket的Web通訊方法。
6. 會用Express為Web和移動應用程序提供強大功能。
7. 會使用HTML模板引擎讓開發事半功倍。
8. 學會使用MongoDB資料庫進行資料的新增、更新、刪除、查詢動作。
章節架構
第一階段:Web 前端程式設計-JavaScript & JQuery
★ Web基礎概念
1. Web 技術前端技術架構與DOM架構簡介
2. HTML 簡介與Tag 概念
3. CSS 簡介與Style 屬性
★ JavaScript 程式語言
1. 關於JavaScript
2. 開發方式與除錯方法
3. JavaScript 操作HTML DOM & Browser Object Model
4. JavaScript 變數 & 基本資料型態
5. JavaScript運算式與運算子
6. JavaScript物件 型態
7. JavaScript陣列 型態
8. JavaScript函式
1) call by value & call by reference式
2) Self-Invoking Functions
3) Nested Function
4) Function Closures
1. JavaScript 數值處理與型別轉換
2. JavaScript Array Methods
1) push , pop, split, map
1. JavaScript Timing Events
2. JavaScript類別定義 (Object with property and method)
3. JSON資料格式與處理
4. Image Map
★ 使用JQuery
1. JQuery簡介
2. JavaScript vs JQuery
3. JQuery selectors
4. JQuery操作HTML DOM
5. JQuery操作CSS
6. JQuery Form表單處理
7. HTTP GET vs HTTP POST
8. JQuery AJAX
第二階段:Web 後端程式開發-Node.js
★ 關於Node.js
1. 非同步式 I/O 與事件式程式設計
2. 安裝Node.js
3. Node Package Manage: 使用npm
4. 製作package.json
5. 我的第一個node.js "Hello world"
★ Node.js HTTP 請求與回應
1. Node.js 處理HTTP Get & Post
2. Express HTTP Server提供靜態檔案
3. 用Express處理HTTP Get & Post
★ Node.js 其他模組
1. Child Process Module
2. File System Module
3. Net Module-Socket 網路通訊
★ HTML Template Engine
1. Why use Template Engine ?
2. Handlebars.js Template Engine
3. Handlebars.js 的運作流程說明
4. Client Side HTML範本引擎 (Template Engine)
5. 實驗 Handlebars.js
★ The WebSocket Protocol
1. 各種Web 通訊方法
2. Long Polling技術
3. Lab:實驗: Websocket 前後端通訊
4. Lab:實驗: 建立多人聊天室
★ MongoDB
1. MongoDB 簡介與使用
2. Node.js 操作MongoDB
3. Lab實驗: 使用Node.js 進行新增/查詢/更新/刪除 MongoDB
★ Node.js Serial 序列資料讀取
1. Node.js 讀取micro:bit 資料使用序列界面
2. Canvas.js 動態折線圖結
3. Lab實驗: 使用瀏覽器顯示Micro:bit狀態(A,B按鍵與加速度計值)
艾鍗學院