« 回到博客列表

一个非著名前端开发者的 2016

Dec 31st, 2016阅读本文大约需要 13 分钟

再见2016

2016年眼看着就要过去了,回顾这一年,感觉还是相当充实的一年,赶上了好时候,收获也不少。

天时:这是最好的时代

自2014年HTML5正式定稿起,前端领域进入了飞速发展阶段,短短两年时间各种轮子、工具、框架先后爆发,前端开发人员的地位也得到了显著的提升,从过去只是个“写写特效、做点美化工作”的小角色,一下子逆袭成为了一个独当一面的狠角色。而我恰好在这样一个时间点进入了这个行业,得到了一份专业对口、符合自己兴趣、前途钱途都还不错的工作,一切都是那么的美好。男怕入错行,很庆幸能够在第四次工业革命的浪潮中成为主力军。

地利:来到魔都

大城市就是大城市,各种机会确实多。这一年参加了不少分享会、展览会,亲眼见到了好些以前只在网上见过的大人物,目睹了一个又一个为梦想而奋斗的案例。看着大街上人们急促的步伐,想不上进都难。身处这样一个环境下,让我更加坚定了凭本事吃饭才是正道,人情社会下所谓的安稳不是我想要的,现在不是,希望将来也不会是。

一片大好的大前端

最早接触前端大概是在大二的时候,厌倦了C++只能运行在命令行没有图形界面,尝试MFC觉得实在不爽后,直到遇上了HTML,感觉得到了救赎,从此便深深地陷在了这个坑里。

从小对艺术、设计就非常感兴趣,学过画画、参加过合唱团,最喜欢的玩具是乐高,有时候买一样东西仅仅是因为它包装好看,或是它广告吸引我。大学专业选择计算机的其中一个原因就是希望能够自己动手做出自己想要的东西。说得高大上一点,就是希望把科技和艺术结合起来。

一度我选择了交互设计方向,想以懂代码的设计师的身份去“改变世界”,然而生不逢时,毕业季时候国内交互设计刚起步,只有顶级互联网公司里才会有用户体验部门,而且优选艺术类专业,被拒过若干次之后只能暂时熄火,回归程序员的老本行。但心里不服,不想因此就改变自己的初衷,因此选择前端几乎是命运中必然的方向。万幸它的发展也没让我失望,作为用户体验和软件开发的交汇处,我能够得以在自己最感兴趣的两个方向上同时走下去,真是幸运。

几乎也正是从我毕业的那一年开始,前端界开始了大爆发,整个圈子开始流行起 MV*、工程化、构建、编译等一大堆 DIV + CSS 时代从未听说过的东西,让我一下子蒙圈了,这还是我认识的前端么。

好在这一切的改变都是在往好的方向去,JS能做的事越来越多,前端设计的范围几乎包含了所有的访问终端,前端工程师越来越受到人们尊重,前途一片大好。

这一年

入行的头一年,我的目标很简单,就是在一年之内把前端圈子了所有之前听说过没见过的东西,尽可能都去尝试一遍,至少能接进大牛们的频道,能听懂他们在说些什么。一年过去了,如今这个计划大概完成了70%吧,至少混迹圈内社群的时候不用什么都靠百度了,偶尔也能插上几句话。

回过头看自己3个月前写的代码,总想着用新学到的内容改写一遍;看半年前的代码,各种看不顺眼,想要改的冲动又来了;看一年前的代码,我的天,为什么会这么写,真笨。想必这是一种好的现象,至少我在不断的前进,获取新的认知,推翻旧的认知。如果有一天,当我回过头看自己几个月前的代码,竟然觉得这段代码写的真好,那就完了。

虽然还远远不够,但这一年真心学了不少东西:

越来越少的 HTML

现在好像已经越来越少直接去写HTML了,动不动就是JSX,或者 ng-x/v-x 这样的强化属性。Jade(现在叫Pug)、EJS 等模板引擎也简单接触了一下,但因为公司技术栈的原因没怎么用过,浅尝辄止,目测未来用到的机会也越来越少了。React 的思想很先进,但或许是有些太极端,但愿 Web Component 能早日到来。

不再手写的 CSS

CSS3 已经没什么新鲜的了,预/后处理器成了标配。最先是尝试了 LESS,因为相比 SASS 简单些,入门门槛低。后来学了 SASS 之后立马就转投 SASS 了。配合 PostCSS、auto-prefixer等工具之后,兼容性的问题也得到了很好的解决。Stylus 据说也很diao,但是要学的东西太多了,往后排吧。Bootstrap 真心已经烂大街到不想用了,了解了大部分的实现思路后现在已经彻底扔掉了,更加倾向于完全自定义的高度可定制性和可玩性,不过等 v4 正式发布后还是会去试一下的。其他像 Foundation、Material、pure、semantic 之类的其实大同小异,了解了下没去多用。国产方面 Alloy、Alice、NEC 之类的还没去试过,一方面这些比较专精,再者就是时间的问题了。

焕然一新的 JavaScript

近年来 JS 方面最大的改变非 ES2015 莫属了,到现在应该已经快 ES2017 了,Class、Arrow Function、Promise、rest、await/async、import/export 等众多新特性都已经开始投入到生产环境中,除了支持度有点脱节需要一大堆垫片和辅助工具之外,总的来说还是利大于弊的。转码器有不少,但从一开始就选了 Babel,之后的事实也证明人家才是事实上的行业标准。本来想学一下 CoffeeScript 的,但随着 ES6 的普及似乎没什么必要了。因为 Angular 2 的关系打算后面学一下 TypeScript,巨硬和谷歌联手,外加业内广泛好评,多位大牛力荐,感觉很靠谱的样子。

各式各样的模块化方案

CMD、AMD、UMD…… RequireJS、SeaJS、SystemJS…… 都尝试了一圈,但终究还是觉得 ES2015 带来的标准写法才是未来,配合 Webpack 效果还是不错的。之前这些都是标准化之前的产物,因此会有各种各样的方案,各有优劣但又分化严重,现在标准层面上已经做到了很好的模块化,那回归标准一定会是最终的方向。毕竟前端圈子的发展基本都是社区先探路,实践一阵后把好的东西总结出来,成为标准,这个路子应该是没毛病的,虽然过程中坑特别的多。

不可避免的构建工具

伴随着模块化的实践,语言本身的进步,现如今的前端开发流已经不允许代码直接跑在浏览器里了(不考虑 REPL 和客户端转码)。和先 LESS 后 SASS 的原因一样,选择 Gulp 入手也是因为它简单,偏 JS 的流式解决方案更加符合开发者的习惯,而且执行速度上也更快。后来为了学习比较也学了 Grunt,但并没用真正用到项目中,只是作为了解。目前最喜欢的还是 Webpack,虽然严格来说它和 Gulp/Grunt 不属于同类,但是放到“模块化”那一节去说好像也不完全合适,又不想单开一节说打包,所以就丢这里了。相比 Gulp/Grunt,Webpack 没有一个清晰的工作流的概念,但对于常见的构建打包任务,也完全能够跑同一个完整的流程。

包管理

npm 自然是首选,估计很多朋友跟我一样,安装 Node 最初的动力不是因为要学 Node 开发,而是因为要安装依赖。bower 也有用过,比 npm 更专一些,下载的内容更干净一些,比较适合传统方案的部署,但现在也慢慢开始淘汰了。配合 Webpack 之后,就不怕 node_modules 文件数量太多了。前阵子 Facebook 出了 Yarn,试用过后立马倒戈,从此能用 yarn 的坚决不用 npm。

Angular

最先是学了 Angular,倒不是说有多喜欢,而是因为刚进公司时候接手的项目有用到,版本的话是 1.4,托它的福不用管 IE8 了。一开始其实是懵逼的,因为是现用现学的,第一眼看到 ng-x 标签的时候完全不知道这是什么鬼,该从哪里下手,花了一个通宵看完一套视频教程,第二天至少能上手了,万幸官方文档还算全面,之后遇到的问题大部分都能靠文档解决,少数情况大概用法不符合最佳实践吧,还是得靠社区。Angular 2 想学来着,刚开始 RC 的时候简单看了下,据说是设计更加合理、性能更好,但好像文件结构更复杂了,还没时间深入去学,打算搭配着 TypeScript 一起。

React

最近在看 React,整个 2016 年似乎都离不开 React,风头甚至盖过了 Angular 2,Vitual DOM 的思想一下成为了共识。相关的 Redux、react-router、Server Render 等等一条龙那是少不了了,虽然门槛确实是有点,但从中学到的新思路确实挺多,值得研究下。虽然现在生产环境中 React 甚至 React Native 已经普及开了,大量优秀的试水案例,但从主版本号依然还没过 1,看来未来会有大动作。

Vue

前端的同事有在用,我也简单看了些,但还没有深入,正如作者自己所说的,Vue 1.x 相当于是 Angular 1 Lite,Vue 2.x 更像是 Angular/React 两者一番云雨后生出来的孩子,自发布以来关注度一直很高,轻量级高性能,国产优秀作品,加上 Weex、微信小程序又带了两波节奏,感觉对于一些中小型的项目会比 Angular/React 更适合。哎~明年吧。

微信小程序

2017年的当头炮估计就是它了,内侧没赶上,公测阶段体验了下,基本就是 Vue 的翻版没错了,不过好像又有原生的成分在里面,谣传底子是拿 React Native 改的,具体就不清楚了,等正式发布了再看吧。WeUI 早在这之前就有关注,当时以为就只是开源了一套样式,没想到原来早有安排。以微信的体量,即便你对这货不感兴趣,那也得学啊。官方文档看了一半多点,等年底正式上线之后观望下吧,起得来就继续,起不来那就专心 Vue 好了。

明年干点啥

以上差不多就是这一年学的内容了,不算多,也没什么黑科技,但也算充实,至少最初的目标“听懂大牛们在说些什么”还是达到了。说实话自我感觉还是不够的,还有好多非常值得学习的东西没来得及去好好了解,但这一年发展的实在太快,真心赶不上,只能是明年继续了。

React

React 不光是一个视图层的新技术,而是一整套的生态圈,要么别入这个坑,一旦入坑那相关的一整套都得是它的,都得去学,而且如果想要达到 Facebook 官方宣称的性能,优化方面还需要下很大的功夫。继续努力吧。先前看到社区里已经出现了 React 的替代品了,原因是 React 本身体积太大,后来者做了精简会更快?

Node

虽说一直有在用,但更多的只是作为工程化工具的运行环境来用,真正作为后端去用的还没完整深入过,只是抓了点皮毛,除了 fs、http 说实话别的基本没碰过,简单学了点 Express 但用得少有点生疏了。前阵子跟公司技术总监谈了,计划开始往生产环境部署 Node 做中间层推进前后端分离,所以这是必然要学的了。框架方面好像现在更加流行 KOA,简单看了下是个 Express 的改进版,看司徒大大也有在研究,而且好像还挺看好,如果靠谱的话打算跳过 Express 直接上 KOA 了。还有就是想尝试自己写一些命令行工具,实践 Gulp/Webpack 的过程中发现总有些流程走得不是很顺,看了下别人的做法感觉要么不解决问题,要么方式太简单粗暴,如果在我学成之前没有更好的方案出来的话那我就只能自己来了。

Vue

Vue 还是非常值得关注的一个框架,不管是为了学习微信小程序、支持国产支持尤大、多了解一种设计思路,都是很值得一学的,况且国内环境对 Vue 的支持度还是很高的,今后免不了会用到。

Web Component / Shadow DOM

Web 组件化的标准化工作一直没什么进展,不管是 Angular 的 HTML 流还是 React 的 JSX 流都有各自的侧重和利弊,从长远来看,或许 Web Component 的方案才是终极的办法。但愿 2017 年能够看到这套标准的落地吧。

React Native

Hybrid App 的大趋势下,RN 应该是目前最好的方案了,JS 进军原生 App 的首选。话说今年 Facebook 带了好多节奏啊,React、React Native、Yarn、GraphQL 都是他们家的,感觉年度最佳贡献奖非他莫属了呢。还有个 NativeScript 好像也挺有一番阵势,有时间也可以去尝试下。

MongoDB / GraphQL

数据库方面 MongoDB 已然是首选了,搭配 Node 实现全 JS 技术栈很是适合,早先也是看到 MEAN 这套技术栈才有的这个想法。GraphQL 势头也很强劲,打算了解下。

WebVR

今年,淘宝通过造物节和双十一的 H5 页两次 VR 试水,引起的关注度自然是不会低的,three.js、D3.js,Echart.js 等的话题热度越来越好,早晚也得看一下。

Electron

用于开发跨平台桌面应用的JS框架,关注了很久,看过不少优秀的作品,很有吸引力,但一直没时间去学。

PWA

Google IO 上推广的东西一直都是由于某种神秘的力量没能在国内流行开,但这货尽然在国内谈论的挺多,稍微了解了下原来这货不依赖 Google 的服务,更多的是浏览器和系统层面的支持,以及程序设计方面的内容,所以才不受限。也是好事,值得关注。

FIS / Rollup

百度的这个构建工具好像在国内环境反响还不错,尝试看看能不能填补实践 Gulp、Webpack 过程中遇到的坑,OK的话就不用我自己去填了,好也不好。Rollup 据说是个不错的后起之秀,效率高打出的包还小,不过 Webpack 2 加入了 tree shaking 之后也不赖,对比着看下吧。

函数式编程

最近这个概念提的也非常多,虽然还不是很理解为什么,也不清楚要怎么做,但既然这么多人都在提,应该也是有它的道理的吧,有必要去了解下。

测试

随着前端能做的事越来越多,应用场景也越来越多,对前端代码的测试也显得越来越重要。Karma、Jasmine、Mocha、Protractor、Chai 等大量的测试工具和框架应运而生,值得引起重视。

“全栈”的野望

作为终极目标来说“全栈”是肯定的,但是并不是说要抢别人饭碗,或是用 JS 统治世界,我的核心肯定还是围绕前端、围绕JS的,至少未来3-5年内是这么打算的,万金油不是我的目标。但是毕竟大前端现在涉及的面太多,传统网页前端、服务器端、移动App、桌面程序、甚至物联网、智能硬件、VR/AR……都有所涉及,基本上所有的显示终端都有相应的方案,所以多了解一些后台和平台原生的内容总是好的。

Android / Dart

之前其实学过一点,但仅仅是入了个门,而且好久不用了,生疏了。刚学那时候 Eclipse + ADT 还是主流,Android 版本还在 4.4,Android Studio 还在预览版,Material Design 也才刚出。Dart 是 Google 一度想推的玩意儿,在 Angular 2 中也有支持,虽然只是作为一个选项并且没有强推,一直也没什么大动静,但了解下总没坏处。

iOS / Swift

学生时代一直都没有 Mac 的环境,因此选择了从 Android 入手,但长期来讲,还是有必要了解下 iOS 的具体原理的。尤其工作之后 Macbook 成了标配,环境的理由不再成立了。打算直接从 Swift 入手,不知道完全跳过 Objective-C 会不会步子迈太大,不行再回来吧,听 iOS 开发同时说 Swift 本身也是一个版本一个样,挺多坑的,嗯,感觉不会容易的。

PHP 7

之所以选择 PHP ,一方面是因为目前公司的后台主力是 PHP,业务原因。另一方面早前学过一点 PHP 5.x,PHP 7 的性能被广泛宣传和印证后,还是想找时间感受一下新的特性,而且除去 Java,PHP 依然是目前最流行的后台开发语言。框架方面个人比较看好 Laravel,但国内好像 ThinkPHP 影响力更大些,不知道为什么,待我一探究竟。

Python / Ruby

Python 其实一直想学来着,作为一门胶水语言,以及众多科学计算、网络爬虫的首选开发工具,其通用性不言而喻,配合 Django 也是一剂猛药。Ruby on Rail 现在流行度也不错,看到不少公司的招聘信息上都提到了熟悉 Ruby 的优先,SASS 生态等也把 Ruby 带进了前端的视野中,当然这个就目前而言优先级还是得往后放,毕竟前面已经那么多东西在排队了。

继续吧,少年

2017 年依然还是继续按照计划让技能树开枝散叶吧,今年搭了基础架子,明年就该开始在上面添砖加瓦了。不是什么大神,也没有什么捷径,一步步来,不着急起飞,该来的终究会来的。

哦对了,这个博客我准备大改版了,从视觉到代码都会重构,响应式的设计会继续保留,排版会更适合阅读,也会加入对高分屏的支持,配色方面会更加的“我”一些,我已经看好几个想抄的样式了,哈哈。(干什么,我又不是专业设计,别要求那么多嘛)代码方面依然保持自己写的传统,打算全面改用 SCSS + ES6,希望是能做到脱离 jQuery 了,真心不想再写 jQuery 了,可能会用 Vue 吧,但博客好像并不适合 SPA,这个还没想好,再说。功能方面会加入分类和站内搜索,看情况也许会接个评论系统进来。

该系列的其他文章