自我修煉來(lái)到了第59天，還有一天就兩個(gè)月了，距離自我設(shè)定的期限還有35天，明天出發(fā)去成都九寨玩5天，回來(lái)剛好剩下最后一個(gè)月。離設(shè)定的期限越近，不免出現(xiàn)了焦躁和不安的情緒，竟然路已經(jīng)走到了現(xiàn)在這里，最后或者再試一次吧，我想做有趣的事，我想成為有故事的人，我下了這個(gè)決定，還是先來(lái)點(diǎn)雞湯歌詞來(lái)打一下氣吧：

我不好也不壞 不特別出眾 我只是敢不同
我的人生就是 一錯(cuò)再錯(cuò) 錯(cuò)完了再重頭
也許放棄掉一些 活得更輕松 我卻不再是我
我不愿一生 曬太陽(yáng)吹風(fēng) 咸魚(yú)也要有夢(mèng)
—五月天《咸魚(yú)》

最近看了韓寒導(dǎo)演的電影《后會(huì)無(wú)期》，貌似其實(shí)當(dāng)導(dǎo)演也不是一件難事吧，但當(dāng)初我卻放棄了，不過(guò)已經(jīng)不再重要了，我已經(jīng)找到我要走的路了。我不是韓迷，但我一直都覺(jué)得韓寒是一個(gè)有自己想法，對(duì)生活敏感，對(duì)自己誠(chéng)實(shí)的人。《后會(huì)無(wú)期》是他的處女作，先不論他在技術(shù)層面，電影語(yǔ)言上的運(yùn)用如何，但我覺(jué)得他講了一個(gè)不錯(cuò)的故事，也拋出了很多值得思考的問(wèn)題。一千個(gè)人就有一千個(gè)哈姆雷特，一千個(gè)觀眾也會(huì)有一千個(gè)后會(huì)無(wú)期。對(duì)于電影拋出的問(wèn)題我思考了很多，我并不準(zhǔn)備在這里展開(kāi)敘述，但有一個(gè)感觸想在這里分享：每個(gè)人都走在一條平凡之路上，在這條路上會(huì)遇見(jiàn)很多擦身而過(guò)的人，他給你留下或深或淺的印記，這些交集會(huì)影響著你下一步的選擇，你會(huì)成長(zhǎng)，你會(huì)改變，但你一定要對(duì)自己誠(chéng)實(shí)、勇敢和堅(jiān)定，不然你只會(huì)成為別人故事里的配角，甚至是路人甲乙丙。

總結(jié)一下從上次文章到現(xiàn)在的學(xué)習(xí)，在這20多天里，主要有以下幾個(gè)內(nèi)容：

1. 鞏固了CSS方面的知識(shí)，以前有很多知識(shí)點(diǎn)都是模模糊糊的，通過(guò)這次的學(xué)習(xí)，清晰了很多內(nèi)容，也學(xué)到了之前不曾接觸的，后文會(huì)展開(kāi)記錄；
2. 學(xué)習(xí)了一些web開(kāi)發(fā)的小技巧，主要來(lái)自《web開(kāi)發(fā)秘方》一書(shū)；
3. 了解了移動(dòng)端重構(gòu)方面的基礎(chǔ)知識(shí)；
4. 對(duì)node.js進(jìn)行了較為完整的學(xué)習(xí)；
5. 對(duì)BackBone.js框架有了初步的認(rèn)識(shí)（BackBone.js的相關(guān)文章：Backbone使用總結(jié)，Backbone first glance，認(rèn)識(shí)BackBone系列文章）；
6. 對(duì)Angular.js框架進(jìn)行較為基礎(chǔ)的學(xué)習(xí)，因?yàn)榻酉聛?lái)的項(xiàng)目將會(huì)使用上，（Angular.js學(xué)習(xí)資料：七步從Angular.JS菜鳥(niǎo)到專家系列文章，Build custom directives with AngularJS，shaping-up-with-angular-js）后文展開(kāi)記錄；
7. 對(duì)Hybrid App的框架Framework7，ionic和onsenUI進(jìn)行了技術(shù)選型，搭建好了phonegap的開(kāi)發(fā)環(huán)境（phonegap開(kāi)發(fā)環(huán)境的搭建可以參見(jiàn)如下兩篇文章：Mac 10.9x下安裝配置phonegap3.0開(kāi)發(fā)環(huán)境 (涉及android sdk配置)和PhoneGap 3 CLI Setup on Mac & Windows）。

一、關(guān)于CSS方面的學(xué)習(xí)記錄
以下記錄是《CSS設(shè)計(jì)指南》的學(xué)習(xí)筆記，相關(guān)章節(jié)也是書(shū)中的章節(jié)

1. 第2章：（1）特指到最明確的元素樣式，為最終計(jì)算顯示樣式，ICE計(jì)算特指值；（2）::after和::before為元素為默認(rèn)在指定的元素增加inline類型的子元素，可修改為block屬性或inline-blockline屬性。
2. 第3章：（1）float令子元素特破了父元素的包裹，浮至父元素的左上端或右上端，其他同級(jí)元素在父元素的大小內(nèi)盡力與浮動(dòng)元素并排，父元素繼續(xù)包裹其他子元素。（2）沒(méi)有顯示設(shè)定寬度的block元素總寬度（外邊距+邊框+內(nèi)邊距+內(nèi)容）與父元素等寬；若設(shè)定則是設(shè)定了元素的內(nèi)容寬度。（3）理解好定位元素的上下文；（4）color是前景色，默認(rèn)影響邊框顏色，background-color后景色；（5）前景-背景-背景顏色，背景范圍默認(rèn)包括外邊距，通過(guò)background-clip設(shè)置；（6）多背景通過(guò)逗號(hào)分隔每一層圖片設(shè)置。
3. 第4章：（1）字體相對(duì)大小用em時(shí)，通過(guò)逐層計(jì)算父元素大小繼承，基本是body為首先基礎(chǔ)，1em為16像素，如不對(duì)父元素設(shè)置絕對(duì)大小，則每一個(gè)子元素相同的em值對(duì)應(yīng)的像素值不等；（2）text-indent直接繼承父元素的計(jì)算縮進(jìn)值；（3）文本屬性默認(rèn)只對(duì)文本或inline元素有影響，因文本內(nèi)容有一個(gè)inline-box包裹，不可設(shè)置高度和寬度，line-height是設(shè)置一行inline-box的高度，與字體大小相互作用影響行間距；（4）text-align設(shè)置文本水平對(duì)齊位置，center屬性值并可設(shè)置在有固定寬度且較小的元素和圖片；（5）vertical-align只對(duì)行內(nèi)元素有影響；（6）fontssquirrel.com轉(zhuǎn)換字體格式，用于@font-face引入。
4. 第5章：（1）960px的width是最理想的；（2）box-sizing改變盒子的寬度計(jì)算范圍（3）max-width控制包含元素的寬度；（3）display：table-cell。
5. 第6章：（1）父元素 子元素 + 子元素選擇法；（2）表單<label>可包含控件也可不包含，用for來(lái)默認(rèn)對(duì)應(yīng)id；（3）表單legend元素的定位機(jī)制不明，在入面嵌入<span>來(lái)控制定位，再設(shè)定為block；（4）transition屬性跟蹤相關(guān)屬性變化的過(guò)渡，實(shí)現(xiàn)搜索框的變化；（5）<figcaption>在<figure>中必須是唯一的，并且是第一個(gè)子元素或最后一個(gè)子元素；（6）行內(nèi)元素的定位基準(zhǔn)為文本基線；（7）z-index對(duì)除static之外的元素有效；（8）使用border及::before和::after形成三角形。
6. 第7章：（1）沒(méi)有寬度的元素水平居中，父元素為text-align:center，子元素為display:inlineblock；（2）垂直居中，文本line-height與父元素同高，為display:row,vertical-align:middle(middle只對(duì)單元格有效)；（3）inline-block外邊距不能為auto。

二、關(guān)于HybridApp應(yīng)用的框架選型

HybridApp是采用HTML5技術(shù)開(kāi)發(fā)通過(guò)Phonegap等相關(guān)工具打包成類NativeApp的應(yīng)用，其特點(diǎn)是采用前端語(yǔ)言進(jìn)行開(kāi)發(fā)，一次開(kāi)發(fā)跨平臺(tái)部署，但卻是以犧牲應(yīng)用性能為代價(jià)，用于相關(guān)開(kāi)發(fā)的框架現(xiàn)在比較多，如jQueryMobile，senchaTouch等，但通過(guò)網(wǎng)上資料顯示，這兩個(gè)框架優(yōu)化并不是特別好，目前較為流行的有以下三個(gè)：Framework7，ionic和OnsenUI，下文從文檔，學(xué)習(xí)成本，社區(qū)，跨平臺(tái)性，component和其他特性六個(gè)方面進(jìn)行比較：

1. 文檔：三個(gè)框架都具備較為完整的文檔，通過(guò)文檔學(xué)習(xí)起來(lái)并沒(méi)有太大問(wèn)題，估計(jì)Framework7框架出現(xiàn)得較為晚，所以文檔方面仍在不斷更新；
2. 學(xué)習(xí)成本：Framework7并不具備MVC的模式，就像普通的webapp框架，學(xué)習(xí)成本較低；ionic和OnsenUI比較依賴AngularJS，采用MVC模式，比較適合用于應(yīng)用類型的開(kāi)發(fā)，但學(xué)習(xí)成本較高；
3. 社區(qū)：ionic的社區(qū)較為活躍，F(xiàn)ramework7和OnsenUI相對(duì)欠缺；
4. 跨平臺(tái)性：Framework7主要針對(duì)的是iOS平臺(tái)，雖然也可用于Android平臺(tái)，但考慮到Android平臺(tái)的混亂，支持效果不可保證；另外兩者都號(hào)稱對(duì)于android平臺(tái)有不錯(cuò)的支持并且支持Android2.3以上；
5. component：只能說(shuō)三者都有足夠使用的component；
6. 其他特性：OnsenUI有個(gè)在線的IDE monaca，并且支持直接在移動(dòng)設(shè)備上Debbug，但經(jīng)過(guò)試驗(yàn)可以支持另外兩種框架；OnsenUI還有個(gè)主題自定義工具。

三、關(guān)于AngularJS學(xué)習(xí)的記錄

關(guān)于Angular學(xué)習(xí)方面，上面已經(jīng)記錄了我的相關(guān)學(xué)習(xí)資料，現(xiàn)在講講我的一些理解：

1. angular的適用范圍是針對(duì)那些AngularJS是一個(gè) MV* 框架，最適于開(kāi)發(fā)客戶端的單頁(yè)面應(yīng)用。它不是個(gè)功能庫(kù)，而是用來(lái)開(kāi)發(fā)動(dòng)態(tài)網(wǎng)頁(yè)的框架。它專注于擴(kuò)展HTML的功能，提供動(dòng)態(tài)數(shù)據(jù)綁定（data binding），而且它能跟其它框架（如jQuery）合作融洽。如果你要開(kāi)發(fā)的是單頁(yè)應(yīng)用，AngularJS就是你的上上之選。Gmail、Google Docs、Twitter和Facebook這樣的應(yīng)用，都很能發(fā)揮AngularJS的長(zhǎng)處。但是像游戲開(kāi)發(fā)之類對(duì)DOM進(jìn)行大量操縱、又或者單純需要極高運(yùn)行速度的應(yīng)用，就不是AngularJS的用武之地了。
2. 使用好angular系統(tǒng)定義的directive，每一個(gè)directive都可以理解成一個(gè)功能區(qū)域，都是一個(gè)controller和view的綁定；
3. 利用自定義的directive來(lái)簡(jiǎn)化應(yīng)用架構(gòu)；
4. 使用好$scope service來(lái)設(shè)定數(shù)據(jù)的有效范圍；
5. 使用serveice概念來(lái)擴(kuò)充controller的功能，并實(shí)現(xiàn)controller間的數(shù)據(jù)共享；
6. 忘記對(duì)DOM的操作；
7. 表達(dá)式對(duì)于數(shù)據(jù)的展現(xiàn)功能；

接下來(lái)，將會(huì)以開(kāi)放一個(gè)應(yīng)用來(lái)結(jié)束這次的修煉，作為期末考試。抓緊和珍惜剩下的時(shí)間。然后開(kāi)始一次新的嘗試。