《很高興我沒有猝死》- 前端新人的 2016 年總結和感悟

如今是 2016 年 12 月 31 日晚，很高興我沒有猝死。

想彌補耽擱的幾年，過去一年裏，我幾乎一直堅持着 9117（週一至週五天天 9 點半至 11 點半，周6、日 12 點 至 24 點）。

開始前端之旅

2015 年 8 月 1 日，剛入職南通一家船舶製造國企的第三天，我就決定作改行的準備，開始前端學習之旅。每晚下班後學習兩個小時，用了一個月，把最基礎的 HTML, CSS, JavaScript，到 Git, Gulp, Less, Node(Express) 過了一遍。9 月初投了 5 份簡歷試試水，很幸運的獲得了兩個面試機會並拿到了 offer。

入行一年

晃盪了一個月以後，2015 年 10 月 27 日，正式入職。

試用期早已計劃好瘋狂學習一個月。主動堅持着 9117。這段時間裏，除了熟悉業務，我補充了一些基礎知識，學習了 Angular。

試用期事後，以爲本身有限的知識，應付工做仍然吃力，因而又自覺地堅持 9117 兩個月。春節後我參與了一個全新的項目，使用 Vue + PostCSS + Webpack。做爲一位初學者，我很是珍惜此次機會。

3, 4 月，嘗試着寫一個監測屬性變化的庫和一個簡單的 MVVM 框架。這段時間我找到了造輪子的快樂，因而決定 9117 制度延長至一年。

5 月，參與了另外一個使用 Vue 的項目。業餘時間，我開始學習 Vue 的源碼，主要是響應系統。爲了方便單獨學習和使用，我把 Vue 的響應系統剝離了出來（地址: smart-observe）。

6 月，開始學習 Virtual-DOM，並但願嘗試結合 JavaScript 表達式和 JsonML ，實現跨平臺渲染（地址: eJsonML）。幸運的是，這個項目很快收到了 JsonML 做者 Stephen McKamey 的 star 。

好景不長，8 月初，因工做須要，我負責獨立開發一款 Android 掃碼軟件。以前並無 Android 或 Java 基礎，因而中斷了 eJsonML 和 Vexil 的開發。拿出所有精力，學了 1 天的 Java，2 天的 Kotlin，3 天的 Android，一週的 RxJava, Dagger2, Firebase 等，作了個在線記事本的 Demo，第三週開始開發，第五週上線，成就感瞬間爆棚。

9 月和 10 月，作着修修補補的工做，休了個假，過了個十一。

2016 年 10 月 26 日工做恰好滿一年，決定再也不續簽。

目前

本來計劃瘋狂的玩耍半個月，而後再開始找工做。但沒有工做時，才發現根本無意玩耍，因而開始瘋狂的投簡歷。

阿里二面被淘汰，雖有些難過，但對將來仍充滿信心，畢竟前端之旅我纔開始一年。

目前在一家作性能加速、監控的公司作數據可視化方面的前端開發，偶爾寫寫服務端。

感悟

感悟太多，隨便挑幾條吧

入行要學好 Git

工做中 Git 真的很重要。就在前幾日，一剛入行的博士生同事在轉正報告中，闡述了他沒有解決好衝突就上線的悲劇，並總結了一句話，「Git 不學好，上線上到老」。Git 不難學，網上教程也不少。建議本地建個專門學習 Git 的 repo，針對教程多多練習。工做中若是遇到拿不許的場景，也能夠用來模擬一下。在熟悉以後，建議設置一套適合本身的 alias。

初學者要珍惜參與全新項目的機會

參與新項目能夠直面不少問題，拿 CSS 來講，垂直居中、封閉浮動、高度根據寬度等比例自適應、多行文本尾部自動省略……這些問題網上有不少介紹，但真正遇到並親自解決掉時，會有着更加深入的體會。

若是隻是直接參與項目的維護，這些問題可能都已經被解決好了，對於初學者，看着別人寫好的解決方案，可能就不會有那麼多的感觸了。

用好 Webpack，以及 Babel 和 PostCSS 等

Webpack 是一個神器，可是「官方文檔是一坨屎」（注：引用來源找不到了）。初學者能夠多看看國內的教程，多研究研究 Github 上的 Demo。此外，對只有 JavaScript 的項目，也能夠試試 Rollup。

Babel 重要性不用多說，使用 Chrome 最新瀏覽器開發時，能夠裸 Babel 運行，這意味什麼……？

我真的很是喜歡 PostCSS 搭配 CSSNext，配置好插件，就可使用自定義變量、自定義屬性集、自動加前綴等等，喜歡上標準，會讓你從心底放棄 SASS，LESS。

Vue

Vue 的官方教程很 nice，入門首選。

工做中建議多思考：如何劃分 Vue 組件（提取公用組件、肯定組件層級）、提取組件的共享狀態（vuex）和業務邏輯（使用純 JS）、Vue 組件 和 CSS 模塊如何搭配等問題。

當前 MVVM 框架核心是「綁定」，作的事情主要是監測變化和響應變化，在 Vue 中它們分別對應着響應系統（源碼學習推薦 smart-observe）和 Virtual-DOM，相信業餘時間學習一下會頗有收穫。

個人 2017 年

• 大量地作讀書筆記

• 把 eJsonML，Vexil 從新拾起

• 平衡工做和生活，確保不猝死

• 護髮