Summer。桑莫。夏天

AngularJS - TodoList 圖片來源：Static translations with AngularJS。 大約一年多前(還在前公司)，RD部門的工程師們 被迫 組了讀書會 駭客任務 ，其中一個主題是研究當前火紅的JavaScript框架為之後平台改版做準備，當時還小不懂事的我看到 EmberJS 的可愛LOGO便自告奮勇研讀。　　 最後公司選了 React ...。居然就這樣了...都沒好好玩到AngularJS XD 好吧，就當作是當年讀書會的複習！從TodoList開始吧！

JavaScript Design Pattern - Strategy 策略模式 JavaScript Design Pattern 「Strategy 策略模式」 筆記。

JavaScript - Event Delegation 事件委派 JavaScript Pattern 「Event Delegation 事件委派」 筆記。

JavaScript Design Pattern - Iterator 迭代器模式 JavaScript Design Pattern 「Iterator 迭代器模式」 筆記。

JavaScript Design Pattern - Factory JavaScript Design Pattern 「Factory 工廠模式」 筆記。

JavaScript Design Pattern - Singleton JavaScript Design Pattern 「Singleton 單體模式」 筆記。

JavaScript - Code Reuse Patterns JavaScript Pattern之Code Reuse Patterns筆記。

結構化資料之「活動」範例 (Part 2) - 使用Microdata與JSON-LD (圖片來源： WEBAFFIX ) 在上一個範例 結構化資料之「活動」範例 (Part 1) 中使用的規範是 Data-Vocabulary.org ，這次改用Microdata與JSON-LD，並記錄更多實作上的疑難雜症。

結構化資料之「活動」範例 (Part 1) (圖片來源： How To Add Rich Snippets To Your WP Blog Posts The Easy Way ) 「Promote Your Content with Structured Data Markup」，搜尋引擎愈來愈人性化，提供愈來愈多實用的資料給使用者做決策。因此，前端工程師的切版不再只是依照設計稿呈現美麗的畫面和特效而已，還要能利用結構化資料，讓網站內容在SERPs上顯示更多資訊。拿活動來說，如下圖紅框所示，搜尋活動「資策會數據創新應用黑客松 IDEAS Tech Hackathon」，第三則結果出現了活動時間「7月25日 - 7月26日」和活動地點「TAF空總創新基地-空軍總部舊址中正堂, 台灣」。使用者不但能在SERPs知道活動標題、短描述和網址外，還能馬上知道日期(區間)、地點。

JavaScript - Module Pattern 自從離開上一份十分忙碌的工作後，終於有時間好好針對JavaScript這個部份充電，於是來看「 JavaScript Patterns (中譯：JavaScript 設計模式) 」這本書，也將自己的學習歷程記錄下來。歡迎大家討論，無論是有錯糾正或新知分享等。 什麼是Module Pattern？解決什麼問題？ Module Pattern 利用函數的「閉包(closure)」特性來避免汙染全域的問題 - 使用閉包(closure)來提供封裝的功能，將方法和變數限制在一個範圍內存取與使用。這樣的好處除了避免汙染全域外，也將實作隱藏起來，只提供公開的介面(public API)供其他地方使用，簡單易懂。

Modern Web 2015：電子商務與活動平台的SEO到底要做哪些事？ 自從SEO成為顯學後，各大電子商務和活動網站都開始注意是否有做SEO - 是否能讓搜尋引擎正確剖析內容、商品、活動或報導是否出現在SERPs上，進而注意是否能從搜尋中帶入正確的TA和流量。但SEO到底要做什麼？搜尋引擎對於一般人來說像是個黑盒子，網路上的文件所述影響搜尋引擎的因子又非常多，到底要從哪裡開始優化？很多人光想到這裡就非常頭痛。 小黑在這次短短25分鐘真的把SEO基本該做的事情都講得一清二楚( 看投影片：電子商務的美麗與哀愁 - SEO 真的只要做這些事情就好 )，精采無冷場阿！以下除了小黑的演說內容外，也補充我的想法。

JavaScript - Decorator Decorator(裝飾者模式)的說明與範例。

JavaScript - JSON.parse and JSON.stringify 使用JSON做Client端與Server端資料傳遞的說明與範例。

JavaScript - Call and Apply call與apply兩者皆是執行某個function，並將這個function的context(即物件)替換成第一個代入的參數。其差異在於call必須將參數一一代入，而apply除了第一個參數代入context外，其餘的參數只要包在一個陣列裡面即可。註：第二個參數不是必須的(optional)。

JavaScript - Closure與Hoisting 分散var來宣告變數並沒有太大的意義，因為就JavaScript程式語言的特性來說，函數(Function)中未宣告而先用到的變數會被提升至區塊的第一行做宣告。先來看基本觀念Closure，再來看Hoisting。

Responsive Patterns - Layout Responsive Patterns 是一個蒐集響應式設計與實作的元件庫，舉凡Layout、Navigation、Forms、Carousel、Tabs、Accordion和Lightbox等皆有，很適合當成學習教材。先來玩玩Layout吧。我們分成幾大類： Reflowing、Equal Width、Off Canvas、Source-Order Shift、Lists、Grid Block 。

利用Bootstrap Grid System排版的學習筆記 Bootstrap Grid System in Responsive Web Design 利用Bootstrap Grid System來排版真是一個方便的方法，最簡單的例子就是如果一個頁面上有許多小方格會隨著Device/解析度而有不同的排列方式，就很適合用Grid System來排版，像這樣～ Am I Responsive?

UXHK 2015 年初我和 小奎 突然決定要參加 UXHK 2015 ，對我來說，有自己想做的東西後，很自然的就想去看看其他產業、其他環境、其他人/職位怎麼做怎麼想、關心什麼議題。

赤柱 (Stanley) - 悠閒愜意的異國風情小鎮 如果準備搭飛機離港前剛好有一小段時間不知道要幹嘛的話，可以考慮到 赤柱(Stanley) 逛逛。赤柱像是沒有商業化又比較乾淨的淡水，跟西貢比起來更有異國風情味。