原文首發于我的博客

年末了，趕著剛考完兩門考試，在最后4門考試來臨之前抽空寫一下今年的小結。

今年格外忙。忙完本科畢設，又馬上投入了研究生實驗室的搬磚生涯。跟去年一樣，列個今年的學習成果清單：

過去的一年

技術成果

2017.03~2017.05.07 開坑學習Three.js，完成了一個簡單的機械裝置展示平臺（我的本科畢設）【Three.js+dat.gui】

2017.05.23~2017.07.15 基于vue2+koa2重構了福建北郵人服務系統，這是我自己的項目。開始引入eslint（以前嫌麻煩233），以后的項目也一并引入。期間在手寫一些常用Vue組件的時候學習了不少東西，寫了一篇Vue組件的三種調用方式【Vue2+Koa2】

2017.05.26 為了上面那個項目簡單做了一個基于stylus的柵格系統css——Melody.css，用來快速做響應式開發。【stylus】

2017.06.07 協助解決實驗室Vue項目里webpack的Hot Reload速度太慢的問題，做了個webpack的開發模式的插件webpack-dev-compile-optimize提升熱重載速度（只在自己內部項目測試過），同期總結了一篇基于vue-cli項目的webpack構建優化文章。【webpack】

2017.07.07 博客開啟持久化構建，依賴于github-page，不過加上了https以及進入了HSTS列表。第一次接觸了Travis-CI，發表了一篇經驗文。【Travis-CI】

2017.08.09 開坑hexo-theme-melody，寫一個送給我妹子的hexo主題，效果見我博客即是。【hexo hexo-theme】

2017.10.09 寫每周電影推薦的時候因為嫌棄獲取電影信息步驟繁雜，于是改造了一下早期寫的node小爬蟲dbmovie-spider支持讀取命令行信息了。【node】

2017.10.28 開始練習算法，并借機學習TypeScript和前端測試（采用了Jest）。 不過后來一直有其他事壓著，沒有持續，等考完試要繼續。【TypeScript Jest】

2017.11.02 開坑vue-koa-demo項目的前端測試。同期寫了一篇Jest 全棧測試的經驗博客。【Jest】

2017.11.18 開坑PicGo，學習electron的基本開發流程，邊寫邊學。最終完成了一個我現在寫博客貼圖片時很方便的工具。并于12月中發布正式版，還上了少數派首頁推薦。【electron】

PS，在掘金也發了一遍推薦不過沒有被推薦到首頁T T

之后應該會發幾篇electron開發的文章。

2017.11.30 抽空把vue-koa-demo的ssr版本做了一下。踩了一些ssr的坑。

對比去年給自己立的目標：

**算法****數據結構****Three.js -> 瀏覽器3D建模****回歸JS語言基礎****學會玩Webpack2****持續的項目開源****Python簡單入門** 復制代碼

感覺除了Python沒怎么學之外(尷尬)，其他的目標大致都有所建樹，算是完成地還不錯吧！

期望、目標

依然要寫下2018年需要學習的東西：

• 算法、數據結構
• Parcel
• TypeScript
• Puppeteer自動化測試
• PWA
• 給開源庫提PR
• github robot
• 如果可以，學習一下react

隨筆

這一年來的前端的學習之路，收獲還是不少的。比起去年來說，我自己覺得收獲最大的就是在開源社區跟開發者、使用者的交流更多了。因為自己也有開源項目，所以很多時候一些情況也是第一次見：比如第一次遇到PR（開心不已），第一次給開源庫提issue，第一次跟開發者討論項目細節等等。今年還沒有給開源庫提過PR，所以明年的目標是來一個吧~

今年也是前端框架、庫井噴的一年。各種新的技術涌現、較新的技術逐漸走向成熟、成熟的項目走向穩定。這種感覺似乎從我兩年半前學習前端的時候就有了，不過今年真的特別強烈。也因此才有那篇流傳甚廣的《2017年學JavaScript是怎樣的一種體驗》。前端要學的東西太多了啊。不過我覺得雖然看似多，作為前端工程師，還是要有自己的大體學習路線。

我認為如今前端工程師應當分成兩類，

結合Node的偏向全棧的前端，他們更注重網站的訪問優化、性能提升、毫秒級別的用戶體驗。

結合CSS\JS的偏向用戶端特效的“純”前端工程師。這部分的前端工程師通常來說必須要有自己的設計認知。

很多優秀的前端工程師都是設計師出身。比如TJ，比如尤雨溪。但是卻不是很常聽說優秀的設計師是前端工程師出身。這就是因為現在很多學前端的人還是在認為自己能夠寫個頁面、套個模板，厲害點的還原個頁面就行了。殊不知，你要學習的不僅僅是前端配套的HTML\CSS\JS，你還需要知道結合了Nodejs后帶來的一系列現代開發工具和工程化的流程。不再是只會用個bootstrap+jquery做個頁面就完事的年代了。刀耕火種的年代已經過去，可是還是有人在抓著舊石器不放。

不過還是需要強調一下，基礎真的很重要。我身邊遇到太多半路“出家”，自愿也好，被迫也罷來學前端的同學，他們很多都是草草幾天看完HTML\CSS\JS基礎，然后就直接用上Vue、React來寫項目了。連npm都不知道是什么東西的他們，很多時候寫起前端來非常痛苦。前端不再是以前那樣認為的是一門可以速成的技術了啊，現在而言，至少入門門檻高了不少。

前端圈還是太浮躁了點。還是沉下心來，好好鉆研自己喜歡的技術吧。

另外，由于最近出現的諸如PWA、Electron、RN、微信小程序等由前端主導的新技術，很多人就說了“啊iOS開發要完啦”、“啊安卓開發要完啦”、“要轉行前端啦”等，我覺得其實還沒有必要恐慌到那個程度。誠然如今前端能做的事不少，但是局限性還是很強。PWA由于依賴高版本Chrome在一般安卓機器上體驗依然不怎么樣，想做出像原生一樣的效果還是受限于機能，iOS就更別說了，雖然safari開始支持service worker，但支持PWA還有待時日；Electron雖然能開發跨端應用，不過還有很多的局限，比如應用體積實在大，比如無法獲取外部當前鼠標選中的文件等等。所以對于新技術應該理性看待，自己親手實踐一下，而不應盲目從眾。

總結一下

今年的技術棧成長：

• 更加深入Vue的開發
• 開始學習Three.js
• 開始用上ESLint
• 開始學習TypeScript
• 開始使用前端測試（Jest）
• 開始學習Electron
• 開始練習算法
• 對前端工程化+自動化有更多的實踐和體會
• 持續維護三個開源項目：vue-koa-demo、hexo-theme-melody、PicGo
• 學習持續集成

希望我的2018年能夠繼續有所收獲！

總結

以上是生活随笔為你收集整理的我的2017年前端之路总结的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。