步入前端已經(jīng)一年了，是時(shí)候?qū)憘€(gè)總結(jié)了。

一個(gè)自不量力的承諾，我步入了前端。

去年的10月份來(lái)到北京尋找工作，在面試中，總經(jīng)理問(wèn)我，能否仿照某網(wǎng)站做出一個(gè)官網(wǎng)來(lái)，我那個(gè)時(shí)候連jquery都寫不熟練，甚至都不會(huì)寫，css沒(méi)有學(xué)過(guò)，html也知道的可憐，但由于我特別喜歡這個(gè)公司，所以當(dāng)時(shí)自不量力的說(shuō)我可以，于是開(kāi)始了我人生的前端開(kāi)發(fā)。現(xiàn)在回想起來(lái)，真的很慶幸當(dāng)時(shí)的自不量力。人生是需要一些自不量力的，萬(wàn)一實(shí)現(xiàn)了呢。

去年的10月份，我的能力確實(shí)是如此，去年畢業(yè)開(kāi)始從事javaweb開(kāi)發(fā)，還不分前后端，什么都學(xué)，導(dǎo)致我什么都沒(méi)學(xué)會(huì)。來(lái)到北京后的這個(gè)公司，開(kāi)始從事前端開(kāi)發(fā)。最先開(kāi)始的工作是用jquery，css，html來(lái)搭建我們的官網(wǎng)，加上修修改改，前前后后，用了大約兩個(gè)月的時(shí)間。這兩個(gè)月的時(shí)間熟練使用了，jquery，css，html。然后開(kāi)始轉(zhuǎn)戰(zhàn)公司的IOT（Internet Of Things）項(xiàng)目前端開(kāi)發(fā)，IOT項(xiàng)目用的是時(shí)下比較流行的技術(shù)，html5,angular1.x,bootstrap3.x,requirejs,gulp,nodejs,npm,bower,圖標(biāo)字體等等，剛進(jìn)入這個(gè)項(xiàng)目，真的是一頭霧水，最開(kāi)始看了好多天的《用Angularjs開(kāi)發(fā)下一代wen應(yīng)用》，但還是沒(méi)什么頭緒，后來(lái)按著我司大神的代碼，復(fù)制粘貼修改，做個(gè)簡(jiǎn)單的頁(yè)面，有不懂得就問(wèn)大神，就這樣開(kāi)始一點(diǎn)點(diǎn)的起步。這里有一點(diǎn)需要注意的是，盡量結(jié)合實(shí)踐學(xué)習(xí)。紙上得來(lái)終覺(jué)淺，絕知此事要躬行。

就這樣開(kāi)始學(xué)習(xí)angular，bootstrap，總是會(huì)遇到各種各樣的問(wèn)題，不停地百度（那個(gè)時(shí)候我還不用Google），總是會(huì)煩擾大神，每天都加班學(xué)習(xí)，一般都是8，9點(diǎn)上班，晚上9，10點(diǎn)下班，我喜歡這樣的工作，在能吃苦的年紀(jì)，不要選擇安逸。要知道功夫不負(fù)有心人，這句話是對(duì)的，隨著時(shí)間的推移，我掌握了越來(lái)越多的知識(shí)，遇到的一個(gè)個(gè)問(wèn)題，都一個(gè)個(gè)的被解決，漸漸地能熟練的在當(dāng)前的框架下面寫代碼，雖然還是不懂這個(gè)框架深層原理，至少實(shí)現(xiàn)產(chǎn)品功能已經(jīng)沒(méi)有太大的阻力。這個(gè)時(shí)候大約是今年的4，5月份了。

這個(gè)階段，我開(kāi)始看一些基礎(chǔ)書(shū)籍，《JavaScript權(quán)威指南》，《Html5程序設(shè)計(jì)》，《瘋狂Html5/css3/javascript講義》，《響應(yīng)式web設(shè)計(jì)》，《移動(dòng)優(yōu)先與響應(yīng)式設(shè)計(jì)》，《Bootstrap實(shí)戰(zhàn)》等，這些書(shū)籍大約都是這個(gè)階段開(kāi)始深入學(xué)習(xí)的，對(duì)前端的基礎(chǔ)有了更深入的學(xué)習(xí)掌握。比如要重視響應(yīng)式設(shè)計(jì)，移動(dòng)優(yōu)先準(zhǔn)則，h5的新元素，css3的新特性，js的原型，閉包，設(shè)計(jì)模式等等。

后來(lái)加入我司ARK產(chǎn)品的前端開(kāi)發(fā)工作，并開(kāi)始獨(dú)立負(fù)責(zé)這個(gè)產(chǎn)品的前端開(kāi)發(fā)，這又是一個(gè)新的從無(wú)到有的項(xiàng)目。這個(gè)階段我把以往學(xué)到的技術(shù)都應(yīng)用到這個(gè)項(xiàng)目中，但有一點(diǎn)是沒(méi)有適應(yīng)手機(jī)，因?yàn)镻C端的網(wǎng)站去適配手機(jī)還是會(huì)有很多的問(wèn)題，看了阿里云，天貓等網(wǎng)站，他們都是單獨(dú)做的手機(jī)端的網(wǎng)站，這個(gè)后期我想我們也要單獨(dú)做這種適配。這個(gè)階段也遇到了很多問(wèn)題，但大多都是一個(gè)人去解決，要知道能自己完成的盡量自己完成，實(shí)在弄不了的或者會(huì)影響產(chǎn)品發(fā)布時(shí)要請(qǐng)求他人，每個(gè)人的時(shí)間都是寶貴的，沒(méi)有人有責(zé)任義務(wù)愿意花很多時(shí)間來(lái)教你，成長(zhǎng)更多的是來(lái)自于內(nèi)心的渴望，而不是外界環(huán)境的施壓。這個(gè)階段主要學(xué)習(xí)了nodejs，webpack，canvas（可能大家都比較熟悉的是知乎的背景就是一個(gè)canvas），javascript設(shè)計(jì)模式（這個(gè)還是很有深度的，目前還沒(méi)能全部學(xué)會(huì)），并且自己寫了個(gè)nodejs的項(xiàng)目已開(kāi)源到GitHub，還主要學(xué)習(xí)了很多的教學(xué)視頻，推薦一些app，《極客學(xué)院》，《慕課網(wǎng)》，《百度傳課》，《網(wǎng)易云課堂》，《麥子學(xué)院》等這里面都有很多的前后端的知識(shí)視頻教學(xué)，能學(xué)習(xí)到很多知識(shí)。

最近，ARK產(chǎn)品已經(jīng)收尾，又要開(kāi)始新的產(chǎn)品，新的征程，這次是我自己搭建了前端框架

JS框架：Angular1.x

html/css框架： bootstrap3.x

模塊加載器兼打包工具：webpack

css預(yù)編譯器： sass

包管理器： npm

后期會(huì)更加詳細(xì)的介紹這個(gè)前端框架，這里要說(shuō)的是sass和webpack，其他的都是最熟悉不過(guò)的了。sass距今已經(jīng)至少4，5年了，已經(jīng)很穩(wěn)定并且得到廣泛好評(píng)，應(yīng)用很廣，大家可以自己百度。webpack是2015年最火熱的前端項(xiàng)目模塊加載器兼打包工具，可以把各種資源作為模塊來(lái)使用和處理。今天的webpack更加穩(wěn)定，而且一年來(lái)的時(shí)間，webpack社區(qū)發(fā)展豐富了很多內(nèi)容，幾乎你遇到的任何問(wèn)題，社區(qū)都會(huì)有答案。于是今年我引入了這個(gè)工具，這個(gè)工具有很多的優(yōu)點(diǎn)，它的目標(biāo)是：

Split the dependency tree into chunks loaded on demand

Keep initial loading time low

Every static asset should be able to be a module

Ability to integrate 3rd-party libraries as modules

Ability to customize nearly every part of the module bundler

Suited for big projects

這些目標(biāo)的實(shí)現(xiàn)讓它成為最優(yōu)秀的工具，這些是其他工具所不能達(dá)到的。它還有如下優(yōu)點(diǎn)：

支持AMD/CMD規(guī)范

能模塊化的不僅僅是js，包括CSS，Json，scss等等

開(kāi)發(fā)便捷，能替代部分gulp/grunt的工作，比如打包，壓縮混淆，圖片轉(zhuǎn)base64，scss編譯，熱加載等等

經(jīng)過(guò)一年多的迅速發(fā)展，有了更多的插件，擴(kuò)展性強(qiáng)，插件機(jī)制完善

可以通過(guò)配置打包成多個(gè)文件，有效利用瀏覽器的緩存功能提升性能

內(nèi)置source-map，即使打包到一起，也方便調(diào)試

網(wǎng)上也有很多的webpack，gulp，requirejs等的對(duì)比，大家可以自行搜索查看。

所有的工具都是為了解決時(shí)下項(xiàng)目的某個(gè)痛點(diǎn)，使開(kāi)發(fā)人員更加敏捷的開(kāi)發(fā)，大可不必追求最火熱的技術(shù)（比如當(dāng)前最新的ng2.x,vue2.x等，這些可以自己先寫寫測(cè)試），因?yàn)闀?huì)有很多不確定因素。時(shí)下正是前端時(shí)代，日新月異，發(fā)展速度 飛快，每天都有新的庫(kù)或者插件產(chǎn)生，Javascript也是2016年github上面最火熱的語(yǔ)言，這是一個(gè)混亂的時(shí)代，這是一個(gè)好的時(shí)代。作為前端開(kāi)發(fā)者，我們要抓住、珍惜這場(chǎng)機(jī)遇，首先最重要的是把基本技術(shù)打牢，然后不斷進(jìn)取，穩(wěn)步向前，追趕我們的時(shí)代。

2016年還有兩個(gè)月了，年初的計(jì)劃還有多少?zèng)]有完成？是時(shí)候做最后的沖刺了，對(duì)我而言，這是我前端的第一年，我的一年職業(yè)規(guī)劃就是把基本技術(shù)熟練掌握，還有兩個(gè)月，準(zhǔn)備要再多學(xué)習(xí)鞏固一些基本知識(shí)。

最后，祝愿每個(gè)人2016大豐收，有所成長(zhǎng)和進(jìn)步。以上文字如果有不正確之處，煩請(qǐng)指正，大家一起學(xué)習(xí)一起進(jìn)步。