《很高兴我没有猝死》- 前端新人的 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 从新拾起

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

• 护发