”HTML5 將移動終端與雲計算融為一體，所以它不只是技術，更是一種新概念，是一種各行各業都要把服務往移動終端整合的新概念”
-
為什麼要參加本講座？
1. 學習HTML5 = Mobile + Cloud的軟體架構
2. 學習HTML5與JavaScript程式碼的整合與組織模式
3. 建立HTML5應用開發的基本能力
-
雲端技術
介紹如何將網站平台化，使用JSON 製作Server-Side APIs，整合手機App
-
JavaScript in HTML5 開發
本講座以數個Design Pattern ，說明其與HTML5 的整合技術
HTML5 & 雲端整合: 深入Mobile & Cloud 設計模式 (課程大綱)
| 1. 再談 WOA (Web-Oriented Architect) | • Device-Server 設計模式 • Async & Offline 將是主流架構 • JavaScript Prototype 王者歸來？ | 30 mins |
| 2. JavaScript 特性與重點 | • Objects ＆ Functions • Callback, Module & Exceptions • Inheritance & Prototype | 30 mins |
| 3. JavaScript DOM & Debug | • Introducing JavaScript DOM • Best Practice: Performance • Debugging JavaScript & Benchmark | 60 mins |
| 4. JavaScript with Browser: The Design Pattern | • Creational Pattern • jQuery & Modular Pattern • Asynchronous Module in Browser | 60 mins |
| 5. Organizing JavaScript Code, HTML5, AJAX and JSON | • AJAX Pattern • ‘div’ element & Dynamic data • Separate View and Control: the MVC Model | 30 mins |
| 6. Node.js 開發教學 | • Node.js 使用案例 (Use Case) • Request handlers • Non-block requests • Route requests | 30 mins |
| 7. Node.js 實例與高級技術 | • Node.js Process • 如何 Spawn child process • Proxying Node.js • 實例研究 | 30 mins |
這門課程在學什麼？
本文出處：Jollen's Blog
上週(6/15)在北京舉辦「課程名稱HTML5 & 雲端整合: 深入MOBILE & CLOUD 設計模式」課程。這門課是從 HTML5 觀念到實作的第一門課（The 1st lesson from concepts to practice），這門課的重點在於「設計模式」(Design pattern)。
當天介紹了「jQuery pattern」。jQuery pattern就是開發jQuery插件(Plugin)的方式，所以技術上倒也沒有什麼學問。不過，jQuery pattern有很高深的哲學道理，意思是說，在軟體工程領域裡，它創造了一個獨特的觀念。這個觀念就是jQuery知名的”$”(Dollar sign)，也就是「Selector」。
以下的例子，就是jQuery pattern：
$(“div#news”).html(“<h2>News Today</h2>”);
從jQuery設計模式的角度思考，如果今天我們想要透過WebSocket與伺服器溝通，並且在一個”div”裡來顯示結果，應該怎麼設計呢？想法如下：
1. 將WebSocket的功能寫成一個function
2. 將JavaScript function封裝成module
3. 在jQuery裡擴充新的函數，簡單說，就是製作一個jQuery插件(Plugin)
以下是一段程式碼樣板：
(function($) {
$.fn.createWebSocket = function () {
if ("WebSocket" in window)
{
alert("WebSocket is supported by your Browser!");
var ws = new WebSocket("ws://<you-ip-adderess>:8888/start");
ws.onopen = function()
{
};
ws.onmessage = function (evt)
{
};
ws.onclose = function()
{
};
ws.onerror = function()
{
};
}
else
{
alert("WebSocket NOT supported by your Browser!");
}
};
})($);
上述的寫法，採用暱名模組來實作。接者，再將程式碼儲存為jquery.websocket.js。使用方法如下：
<!DOCTYPE html>
<head>
<script type='text/javascript' src="./jquery.min.js">
<script type='text/javascript' src="./jquery.websocket.js">
</head>
<body>
<div id="message"></div>
<script type="text/javascript">
$("#message").createWebSocket();
</script>
</body>
</html>
這種做法也可以良好地組織HTML5與JavaScript程式碼。此外，JavaScript的module具備「Closure」的特性，即封閉性，可以避免一些衍生問題。
由於HTML5+JavaScript的設計思想，和Natvie App的作法有很大的不同，所以了解HTML5+Javascript的應用程式「如何設計」，會是重要的一門課。了解設計模式，除了能有效組織HTML5+JavaScript程式碼外，也能做出正確的設計。
先備知識
- ● HTML5 標籤
- ● JavaScript 基本語法
適合對象
- ● 手機 App 開發人員
- ● Web 開發人員
- ● 美工設計人員
- ● 圖書出版與編輯
- ● 媒體業人員
- ● 有意以HTML5開發應用的業者
報名費用
| 1.原價 | 2.仕橙廠商方案 | 3.早安鳥方案 | 4.團報與仕橙VIP方案 | 5.兩場合報優惠 |
| NT$3,800(每人) | NT$3,200(每人) | NT$3,500(每人) | NT$3,200(每人) | NT$5,600(每人,兩場費用) |
| •繳費日期：2012/07/07前報名繳費(含現場報名) •本講座恕無法合併使用折價卷與VIP 卡 |
•繳費日期：2012/6/29 •仕橙企業客戶的員工參加本課程，皆享有此優惠 |
•繳費日期：2012/6/29 前報名繳費 •本講座恕無法合併使用折價卷與VIP 卡 |
•繳費日期：2012/6/29 前報名繳費 •團報：二人以上報名 •仕橙VIP：報名表須填寫VIP卡號，並請攜帶VIP卡報到 •本講座恕無法合併使用折價卷 |
•繳費日期：2012/6/11 前報名繳費 •此為報名參加 6/19 與6/20 兩場研討講座者，且報名參加為同一人者，才可享有此優惠 •本講座恕無法合併使用折價卷與VIP 卡 |
2012 Android Day 學員專屬優惠
| 1.原價 | 2.一場優惠 | 3.兩場合報優惠 |
| NT$3,800(每人) | NT$2,980(每人) | NT$5,400(每人) |
| •繳費日期：2012/6/19前報名繳費(含現場報名) •本講座恕無法合併使用折價卷與仕橙VIP 卡 |
•優惠期間：凡於 2012 Computex 展期間，報名並繳費者即享有此優惠（即 6/9前） •優惠獲得方式：於填寫報名表時，請於 VIP Code 欄位中，填寫2012 Android Day的『 報到編號 』，並於開課當日出示『 Android Day 活動識別證 』即可 •本講座恕無法合併使用折價卷與仕橙VIP 卡 |
•優惠期間：凡於 2012 Computex 展期間，報名並繳費者即享有此優惠（即 6/9前） •優惠獲得方式：於填寫報名表時，請於 VIP Code 欄位中，填寫2012 Android Day的『 報到編號 』，並於開課當日出示『 Android Day 活動識別證 』即可 •此為報名參加 6/19 與6/20 兩場研討講座者，且報名參加為同一人者，才可享有此優惠 •本講座恕無法合併使用折價卷與仕橙VIP 卡 |
如何報名
- 1. 下載報名表如下
- 2. 請回傳至 contact@moko365.com 或傳真 (02) 2383-1660
- 3. 客服人員將會主動與您連絡並寄發繳費通知
下載報名表
講座時間
日期：2012年07月07日（星期六）
時間：09:30~12:30，13:30~17:00
講座地點
地點：新領域教育訓練中心 A館 台北市中正區館前路49 號4 樓405教室 (台灣產物大樓, 台灣銀行樓上)
檢視較大的地圖
