2018 年娱乐逗比总结：小烜有话说 | 2018 与个人技术之路

提及来这是我真正开始工做的第一年，实习不算，从一个学生要转变成为一个职场人，说实话，个人感受不是那么强烈，多是咱们团队的氛围比较好，我没有感觉到那么多有的没的，今年是很是重要的一年，我本身是这么以为的，从思惟上要从学生的思惟转变成在公司里如何解决问题的思惟方式，固然了，2019 年，我认为对于我本身来讲可能会是一个转折点，至于为何这么说，其实也是本身心里的一股强烈的感受吧。

慢谈 2018

2018 年对于我来讲，分为上半场和下半场，上下半场对于我来讲都有着不小的收获，上半场的我关注点在于如何作好基础设施，如何作框架，为公司的各位研发老哥提供最有力的支持；而下半场个人关注点在业务，理解业务为首要任务，以及如何以最合适的技术去实现功能。

全场概述

热点追踪

React 又爆新闻啦，今年但是看到很多的这样的文章，今年 React 也是出了很多的新的功能。

1. 新的生命周期

   在 React 进入到 16.3 以后，新增了两个生命周期，以及将原有生命周期中的 componentWillMount、componentWillReceiveProps、componentWillUpdate 的三个生命周期标记为 unsafe，这三个生命周期在 16 版本还能继续使用，可是这三个生命周期将会在下一个大版本移除，值得注意的是你不能在一个组件里同时使用新的和旧的生命周期，至于为何要这么作，能够去看一下 React 新的架构模式。

2. 新的 Context

   React 中的 Context API 相信你们都了解，在以前，React 不建议使用 Context，这是一个实验性的 API，但如今它又回来了，成为了一个很是棒的 API，至于为何咱们须要这个 API，以及如何使用，能够看看之前的文章，好比这个。

3. lazy、Suspense、memo

   React.memo 主要是用于函数式组件，做为 PureComponent 的替代解决方案。而 React.lazy 则是配合 Suspense 进行代码分割。

4. Hooks

   在最近几个月，关于 Hooks 的文章也挺多的，获得了不少的反馈，也有不少的开发者喜欢这个东西。它可以让你不须要使用类就能使用 React。那么为何要引入 Hooks 呢？官方给出的答案是，Hooks 解决了 React 中各类看似不相关的问题，这些问题是咱们在开发和维护数以万计的组件时遇到的。

Babel 7 以及 Webpack 4 的发布，最近又了解到 AMP，虽然没有作移动端，可是仍是了解了一波。

这一年的热点一件一件的说其实还真很多，也就不赘述水文了，可是咱们以什么姿式去了解这些东西，我以为是比较重要的，从我我的来讲，我将这些新的知识分红几块，用不一样的标签去对应这些知识，其实看起来就是一个象限，固然了，这也是我我的的见解，也不必定适合你们。

1. 领域相关而且我十分有兴趣的，优先级拔高，优先学习，写 demo 钻研一下
2. 领域相关可是没什么兴趣的，固然仍是要学，毕竟要恰饭
3. 领域不相关可是有兴趣的，利用周末的空闲时间看看
4. 领域不相关而且没有兴趣的，可能我就不怎么会关注了，可能让我学我也没兴趣去搞

贯穿全场的学习

干程序员这行，无论是兴趣也好，被迫也罢，学习二字贯穿整个职业生涯，也就是说咱们要按期的为本身的知识资产进行投资。

那么今年个人学习目标是什么呢？基础、基础、基础，重要的事情说三遍，在繁荣的技术圈，基础才是立身之本，近来，我更是以为这种观点是对的。

在真正的开发过程当中，我相信不少人的体验是按照当前项目已有的代码架构与模式，把本身的代码加进去就能够了，就如同盖房子同样，设计师把图纸弄好，计量人员把哪一块用多少料都搞得清清楚楚，剩下的须要作什么呢？把砖什么的堆上去就 ok 了是么？固然了，也有可能在修的过程当中遇到了一些难题，根据咱们的思考、多年的经验解决了这个问题，可是谁不想去当那个设计师呢？

因此我以为，今年个人思考方向，就是从怎么写好功能，转变为 如何运用我所学的知识去组织出受过培训的人就可以很容易编写和维护的代码。

因此个人学习方向是什么呢？今年的学习在这些方面，设计模式、基础算法以及数据结构，以及如何写出易维护的代码。

React Fiber

除了上面说到的这些，在查阅各类资料的时候，对 Fiber 十分有兴趣的我也学习了一波 Fiber，感谢司徒正美等大神对 Fiber 的剖析，结合他们的剖析以及对源码的研究也算是对其有所理解。

这是一些资料：

• React16.2的fiber架构
• React16.2的fiber架构(2)
• React16.2的fiber架构详解(3)
• React Fiber架构

源码阅读

说到这里，不得不说，在阅读源码的体验上，我我的以为在 React 上的体验不如 Vue 的好，也多是我不太习惯 React 的源码组织方式，读起来有点难受。

对于 Vue 源码的学习，学到了很多的东西，包括数据驱动、响应式原理、组件化、编译等等，Vue 源代码的可读性仍是不错的，你们阅读的话能够结合思惟导图，以及断点调试来学习，我的以为不错。

固然了，关于 React 相关的阅读都没有关注在 React 自己，而是聚焦于 React 周边的各种经常使用库。

好比，redux 的学习，在其中你能够看到 redux 的中间件机制，如何建立 store 等等。配合 redux-thunk 食用更佳，你能够了解到，为何 thunk 支持异步，这可以帮助你更好的学习 redux。

以及结合 react-redux、react-router 等库的源码你可以学到高阶组件、Context API 等等的学习，能够去看一波，仍是有所收获。

好了，下面就来讲说上半场吧。

上半场

对于基础设施来讲，我以为比较重要的几个点，你们能够注意一下。

第一，就是要作一个很是有原则的人，尤为是在代码上，我我的以为斤斤计较也不是个什么坏事，作基础设施必定要注意原则。

第二，要创建本身的知识库，不只仅是如何使用这个基础框架的文档，更重要的是本身内部要有一套关于这个框架的知识库，避免由于人员流失等缘由形成知识丢失，后面维护这一块的代码就至关困难。

第三，必定要有测试，这个东西，至关重要，可以充分的保证咱们的代码质量。

构建高效的开发流程

谈到基础设施搭建，咱们就不得不说说构建开发流程了，咱们要作到代码规范、持续集成、测试等等，咱们一个一个来讲。

1. 代码规范，说到代码规范咱们能想到什么？ESlint、stylelint、Prettier、commitlint 等等，关于代码规范的部分我会在下面谈到。
2. 测试，好的测试可以在咱们后期对代码进行维护修改的时候，将伤害降到最低。这一块我其实也没有作到位，反省一分钟，我使用了 Jest 来进行测试，可是在测试方面，咱们可用的东西其实很是多，好比说 Mocha、Jest、Jasmine、AVA 等等，固然了咱们还拥有像 puppeteer、nightwatch 来作 e2e 的测试。
3. 持续集成，在版本管理方面使用了 lerna，这是一个很是强大的工具，它可以帮助咱们进行版本管理、changelog 生成的工做，固然在后面还有持续部署的问题，这个地方涉及到 docker、Jenkins 等等知识了，这里就不展开了。
4. 文档，Docusaurus 是一个很是优秀的文档管理工具了，固然了，如今也出现了很是多优秀的文档工具了，工具不是关键，关键是你的知识的留存。

优雅的提交 commit

上面说到关于这个开发流程，那么咱们如何在提交时避免这些问题的发生呢？咱们不能只在 CI 流程作 lint 等操做，这样的话，咱们的反馈链太长了，因此咱们将着一系列操做放到了本地。

咱们须要的基本操做是哪些呢？对 commit-msg 的校验、lint、prettier 等等操做。

关于这一部分，我就很少 BB 了，下面有一些资料：

• 用 husky 和 lint-staged 构建超溜的代码检查工做流
• 使用 ESlint、lint-staged 半自动提高项目代码质量
• git commit 提交规范 & 规范校验

下半场

下半场更多的感悟其实不是纯技术上的，虽然也有技术相关的东西，可是我以为对于我来讲这几点很是重要。

工做中的思考

下半场在项目里进行了几个月的开发，在开发的过程当中，我也有很多的心得体会，虽然不知对不对，分享给你们，共勉。

第1、交流，交流真的很是重要，我记得我组长看过的一本书 《非暴力沟通》，书很是好，推荐给你们，咱们在沟通中少了很多争执，沟通的效率就不同了。

第2、不要一路狂奔，停下来思考思考。我不知道你们有没有和我同样的感觉，项目比较紧张的时候可能就全身心的投入到功能开发、bug 修复上去了，都没有时间来想一想本身的工做，进行复盘、评估，形成的结果是，等一段时间过去后，再回首已然一片狼藉，再想要把项目拉回正轨要耗费很是多的时间，因此个人想法是，就算再忙也要停下来想想，避免给本身之后挖坑。

其实还有很多的想法，可是篇幅有限，我就列了两个我以为很是重要的点。

破窗户

这是《程序员修炼之道–从小工到专家》中的一段，这是一本很是经典的书，推荐。

说的是，这个理论是认为一个环境中的不良现象若是被听任存在，那么就会诱导人效仿，甚至变本加厉。在代码中，这一点尤其常见，当第一段很差的代码出如今你仓库里，就可能打开了潘多拉魔盒，这也就是为何我说作基础设施的必定要谨慎，要较真，若是你的代码规范执行的很完全，那么相信谁也不会想去当提交第一段烂代码的人。

知识丢失

知识丢失对于一个项目来讲很是的致命，会形成咱们的项目失控。什么状况下会形成知识丢失呢？

只是提交了代码，忘记了保留知识，包括注释、文档等等，又或者是作这个模块的同窗离职了，又或者是掉到其余岗位去了，一旦没有把知识传递到位，形成的结果就是知识丢失，新接手的同窗看不懂、不敢删、不敢改，就像一个泥潭同样，让人越陷越深，最后变成让人感到绝望的祖传代码。

对于这个问题，我想优秀的代码规范、有迹可循的注释与文档可能能够解决一部分，可是到底该如何解决这样的问题，我也没有找到什么方案，不知道各位有什么有效的方法。

厉害了个人 2019

好了，大概说完了 2018，就要说说这个厉害的 2019 了。

整理一下我本身的单子：

• linux 命令：只了解 ls、cd、lsof 等基本经常使用命令，其余命令还得现查现用，好比我讨厌的 tar，我必定要征服它
• webAssembly：准备学习一波，可是优先级可能不是那么高
• Node：会用，会写，可是不深刻，用大神的话来讲，你很不错，仍需努力
• 算法：好像在不少人眼里，前端和算法好像关系不大，可是在个人认知里，算法、数据结构等等就是一个程序员的内功，决定了你的武功能练到哪一种层次，因此要扎实，明年重点
• GraphQL：今年的遗憾可能就是没有用 GraphQL 去试试水，在我看来它很是合适某些项目
• TypeScript：明年准备上到项目，因此是个重点，优先级极高
• Electron：听过，玩过 Hello World，挺有兴趣，明年可能会玩一玩的玩具

我想到的大概就这么多，毕竟明年啥样我如今也无法预测，前端圈瞬息万变，我就静观其变，打好基础，迎接时代的冲击吧！

立个 Flag

喜闻乐见的 flag 环节，固然了，这是在给明年的总结留打脸证据的。

• 读 20 本书，而且以文字的形式输出
• DIY 一个玩具，React 组件库（多方参考，只为学习）
• 算法和数据结构的 flag 必定要立，但愿边学习边输出
• 能有一个本身的公众号，坚持输出

其余的 flag 也就不立了，感受说的有点杂，有点多，就当我跟你们唠唠嗑吧，祝你们新年快乐，新年新气象，升职加薪，走上人生巅峰。

偷偷在下面立个小 flag，女友说我瘦到 140，她才和我结婚，这个 flag 悄悄的立，大家就当没看见好了。