2016年工作中做過最自豪的兩件事情：
把 Vue.js 和 Webpack 技術棧引進公司并逐步成為前端規范；
開源iView項目。
初識 Vue
第一次接觸
使用 Vue.js 已經有一年半時間了，在接觸 Vue 之前，有寫過半年多的 Angular，所以剛了解 Vue 時，與很多開發者一樣，認為 Vue 是一個輕量級的或是移動端的 ng，就好比 zepto 之于 jQuery。直到 15 年 10 月，打算用 Vue 開發一個個人項目時，才開始認真地學習它，發現 Vue 的使用方法和 API 設計如此優美簡潔，而且中文文檔甚是詳細，我覺得這也是 Vue 受很多中國開發者喜愛的原因，許多初中級開發者、英文不好的、jQ導向的，在剛接觸 MVVM 時，這點很有價值，再者 Vue 的使用和學習門檻相比 ng 和 React 的要求都要低，概念理解起來也容易。
比起 Angular，Vue 最大的特點就是對數據雙向綁定這件事處理的很優雅。ng 中你需要注入依賴服務，比如 $scope 和 $rootScope，變量寫起來也散落在各處，而且有時候還得用 $apply 來告知，這對于很多初學者來說是很麻煩的事情。我以前是寫 jQuery 的，所以還是喜歡用 jQ 的很多東西，比如 ajax，而 Vue 在數據使用上很靈活，可以引用外部變量，可以在各種情況下直接修改，不需要額外的工作，所以當看到 Vue 雙向綁定這一特性時，就決定嘗試用它了。
一個人搞了一個產品
從 14 年畢業到 15 年底，就一直在兩個規模不大的創業團隊工作，先后做了 5 款產品，都是 App，涉及的面也很廣，比如 Canvas、Hybrid 什么的。在初創團隊工作就像打了雞血一樣，每天早上起床都迫不及待地開始寫代碼，對工作的熱愛絕對不是只把它當做一件賺錢的事情，所有人都是有理想和技術追求的，所以那段時間我做的東西都很用心、精致。
兩年的創業經歷也把我鍛煉成了一個對產品有理解、追求細節、美觀的一個人。
從 15 年中旬開始，由于項目需要，我開始接觸 Python，這也是我第一次接觸后端語言，以前對服務端的開發是一點不懂的。不知道是 Python 本身的原因，還是我理解的快，上手其實并不難，而且沒多久就已經可以熟練的寫起來了（現在接觸的東西多了，覺得那時學習的快，是有一套很好的架構和有人帶，先能寫，然后慢慢了解其中奧妙，這種辦法對于程序員掌握一門新技術還是很有效的）。
我相信但凡寫過 Python 的人，都會用優雅來形容它，比如一行代碼帶有循環的賦值：
user_hash = dict((str(user.id), user.to_base_dict())foruserinusers)
其實寫后端和寫前端，很多地方是想通的，只是概念上有區別。只不過后端專注在數據的獲取、緩存和整理上，加以各種服務，前端則在獲取數據、整理數據、可視化數據。
學會了 Python，發現這個時候可以自己獨立做一點東西了，于是就有了一個人搞了一個產品。不賣關子了，這個產品就是TalkingCoder，從產品、設計、前端、后端、運維、iOS & Android 客戶端，幾乎都是我一人擼的了，只不過在寫移動 App 時，有兩位兄弟幫忙寫了個殼。
從產品和技術復雜度上，TalkingCoder 很接近 知乎 和 Segmentfault，基于關注內容推薦的 Feed 流、文章、提問（最佳實踐）。看一下用到的技術棧：
后端當然是基于 Python 了，主要用Tornado框架提供 Framework 和 WebService 及 APIService（也巧，貌似 知乎 和 Segmentfault 也用的Tornado）。Tornado 是一個單線程、單進程、非阻塞式的 Web框架，性能很不錯。Sqlalchemy提供 ORM（Model層），這東西很好，尤其是對于我這樣不太擅長寫 sql 的人。Celery提供了 worker ，完成一些不影響用戶使用的定時任務（統計）、耗時任務（發郵件）等，通過異步，不阻塞主線程。Redis主要用于存儲用戶的 token，數據庫用的是 MySQL（阿里云RDS），同時還用了下阿里云的 SLB 負載均衡（其實沒有什么好均衡的，量又到不了知乎那級別，主要還是做https的支持和域名綁定，對Nginx不是很熟，17年要學一下了，畢竟 SLB 的費用一年也好幾百呢??）。
前端相對還是比較傳統，沒有完全使用 前后端分離 ，Vue 也沒有用到組件和組件化，主要原因還是剛學 Vue，沒有深入到組件，所以路由和頁面渲染，甚至html模塊都是 Tornado 完成的。任何技術都需要循序漸進，如果現在再寫一遍，肯定不是這套架構，但在當時，這的確是最好的技術方案。但是服務端渲染也是有好處的，比如 SEO、頁面打開速度，前端再怎么優化，也沒有直接服務端渲染好 HTML 來得快。
iOS 和 Android App 是在 web 版全部完成后開發的，當時找了兩個對技術有追求的 iOS 和 Android 的小伙伴幫忙搭了殼，定制了一些 UI 和 Bridge 接口，iOS 用的 UIwebview，本打算用 WKwebview，但測試下來很多地方效果不是很理想，最終還是選擇了較為成熟的 UIwebview。整個移動端開發過程大概2個多月吧，也是基于 Vue + Gulp + Swiper 的，體驗還算不錯，尤其在 iOS 上。
運維是我的短板，Linux 不怎么熟，所以很尷尬的就是一開始只能在自己電腦上玩，到了 ECS 上就蒙了。好在 TalkingData 大牛有的是，折騰了一周，所有的環境和庫都裝好了，找人幫忙寫了個 shell，就這樣上線了，上線后，就再沒斷過。
前前后后開發了有近半年，服務上線也快一年了，這套架構從沒出現過故障和報警，唯獨一次重啟機器把 Redis 數據丟失了。這個項目讓我對 全棧 有了更深的理解，但凡是后端的會點 Angular，前端的會寫寫 Node.js ，都不完全是全棧，全棧應該是能理解整個產品的命脈，并把它最終實現出來，安全運行。
推廣 Vue
我是 15 年雙十一那天加入TalkingData的。TalkingData 仍然還是創業公司，但規模和影響力要比我之前的兩家大很多，在大數據領域，更是領先者。
在這里，前端團隊都統稱為可視化，因為我們是跟數據打交道。其實 TD 幾年前是沒有專門的前端團隊的，由于歷史問題，很多產品線都還是較老的技術，公司的核心技術在大數據處理能力上，前端頁面很多都是寫 Java 的同事做的，用的最多的自然是 Angular（知道 ng 背景的肯定了解其中的原因??）。
我剛來時，做的是一個基于百度地圖 overlay 的大數據地理可視化框架 TDMap（各種原因尚未開源），貼幾張圖感受下吧：
之后就是我的第一個業務類項目了，也是全面運用 TDMap。當時用的是 TD 自研的一套組件引擎和 jQuery。這個項目到最后做權限系統時，才開始接入 Vue.js ，這應該是 TD 首次使用 Vue，不過當時也有限制，只用它做簡單的雙向綁定，但僅此一點，開發效率已經提高很多了。
在一個公司推廣一項技術棧也是有難度和技巧的，因為不同的人思考問題的角度可能會不同。新的東西一方面會增加學習成本，一方面對它潛在的問題是未知的，如果暴露出了問題或性能瓶頸，是否能夠處理或應急方案，尤其是選擇開源框架時，社區影響力、維護和持續開發都是考慮的因素。好在 Vue.js 給我們帶來了很多驚喜，社區反響也不錯，一句話就是用著放心。
既然嘗到了 Vue.js 帶來的甜頭，就要把它推廣起來，提高整個前端團隊的開發效率。
Webpack，又一前端神器
如果只是用 Vue.js 的基本功能，那其實只利用了20%的特性。
推廣 webpack 這一過程是緩慢的，因為開始和很多人一樣，以為又是個和 Gulp 類似的工具，所以有段時間仍然是使用 Vue + Gulp + jQuery 的技術棧，已經開始使用 Vue 的組件，但還沒有組件化。這樣寫的多了，問題就暴露了：
每個組件需要手動拆分html 、 js、 css 部分，維護成本高；
html 需預先加載，所以會看到一個頁面有一大坨的html
業務第一，一開始也就沒有在意工作流，雖然麻煩，但也撐了幾個小項目。直到一個機會開始做MarketingCloud營銷云，才開始徹底學習 webpack，好在項目初期不太緊張，有了一周多過渡時間來搭建。
我覺得 webpack 的難點在于概念，因為你在開發時寫的代碼，并不是最終呈現的代碼。這對于傳統技術棧來說思維切換還是需要成本的，因此有了一個概念：編譯。
說到底，webpack 就是一個 .js 配置文件，你的架構或好或差，都體現在這一個配置里，隨著需求的不斷出現，工程也是逐漸完善的，一口吃不成胖子。這里也分享一下 TalkingData 用到的工程配置：
https://github.com/icarusion/vue-vueRouter-webpack
關于 webpack 的技術介紹就不多扯了，掘金上有很多不錯的文章，不過也推薦我之前寫的幾篇：
Vue+Webpack開發可復用的單頁面富應用教程（配置篇）
Vue+Webpack開發可復用的單頁面富應用教程（組件篇）
Vue+Webpack開發可復用的單頁面富應用教程（技巧篇）
這一年下來，這套架構在多個項目中得到了驗證，工作效率自然是提升了不少，也奠定了我們前端團隊的開發規范，Vue 的推廣，至此算是非常成功了。
iView，把開發效率再提高50%
經常混掘金的小伙伴，應該對 iView 不陌生吧！再貼一下地址：
https://github.com/iview/iview
也感謝大家的關注與支持，iView 的 1.0 工作馬上就結束了，計劃的 43 個組件，現在已經完成 41 個了，我們也承諾過，在 1.0 發布后，會在 17 年初支持到 Vue2.x。
關于 iView 的介紹和使用，這里就不多說了，可以看看下面三篇文章，這里主要還是想說說關于它的一些故事和開源的經歷。
發起這個項目的初衷，是公司舉辦的一次創新項目活動，當時團隊正好也需要一套自己的 UI 組件庫，于是就申請了，從此就信心滿滿地開始了來源之旅，那時是 16 年 7月。
時間過得真是快，都開發 半年 了，也收獲了近 3000 ★。因為是第一次做開源項目，對 Github、npm 的很多東西還不了解，雖然平時都在用，但卻沒發布過。慢慢地知道了什么是.gitattributes、.npmignore、.travis.yml、.eslintrc.json，也了解了 MIT、Apache Licence 2.0 開源協議，漲了不少姿勢。
iView 在一開始時，還是暴露了很多問題，比如必須通過 webpack 才可以使用，而且還得配置 babel，否則無法編譯node_modules/iview下的文件，就這一個簡單的配置，折騰了很久，因為不同平臺不同版本，寫法不一樣。后來在@jingsam的 contribution 下，優化了 iView 編譯過程，最終不再依賴 webpack，也不需要配置 babel，在此特別感謝下 jingsam，雖從未見面，卻對技術有著同樣的追求。
iView 基本是我一個人在開發和維護，不過有一位在美國上大學的同學也多次貢獻代碼，我們的溝通似乎并沒有時差的概念，因為他基本很晚才睡，夜貓子類型的@rijn，在此也特別感謝。
iView 的 contributors 并不多，也借此機會，希望更多對技術有追求的朋友能參與到 iView 2.0 的開發中，把它一起做好。
因為太想把 iView 做好，所以在寫每個組件前，都看了很多別人的實現，比如 Element UI、vue-antd、AntDesign、vue-beauty 等，這個過程學到了很多東西，看別人代碼的確是最快最有效的學習方法，因為有時候思路會被限制，看看別人的實現，才能打開思路，多加對比，也能知道幾者之間的差距。
現在公司最核心的服務 — 應用統計分析已經開始用 iView 重構了，相信在 2017 年，iView 也會像 Vue 和 Webpack 一樣，被很多項目驗證。
后記
16 年可以說是工作以來進步最大的一年了，學習了很多前沿的技術，也做了不少東西，但做技術的就是這樣，接觸的越多，越能感到自己的渺小，17 年繼續加油吧！
作者：梁灝
文章首發于掘金，未經許可，禁止轉載
