再见2020，你好2021

又到了一年回头总结的时候了，刚刚过去的 2020 年，真的是不太平的一年的，这一整年都有新冠疫情，而且在将来的几年里，新冠疫情很有可能成为常态。

1. 回顾下最初定下的目标 #

先回顾下在 2020 年年初定下的目标： 再见 2019，你好 2020 ，看看完成的怎么样了。

1. 熟悉了下 node 中的 crypto 加密模块；不过没有完成 Buffer 模块；
2. 目标是完成 leetcode 上 250 道题目，实际上完成了 274 道题，超额完成 24 道；
3. 公众号的粉丝并没有到达预期，主要是公众号的更新频率太不固定了；
4. 本来想了解和涉及下微信小程序的东西，但因工作原因，并没有接触小程序；
5. 博客数量目标是在 2020 年完成 40 篇，但实际上只完成了 26 篇文章，这里还差着不少，还有很大的进步空间；

梳理完之前在 2020 年年初定下的目标完成情况，再来回顾下把没有完成目标的时间，都浪费（用功）在哪儿了？

2. 完成的成就 #

整个 2020 年算是个比较有成就的一年，从开发和融合一些公共基础组件，到搭建我们前端团队的开发和发布体系；从编写团队的文档，到分享自己的文档；一点点点亮自己身上的技能树！

下面是公司git仓库记录下的提交记录，可以说是诚意满满，一天最多的时候，能有50个贡献：

除开假期外，几乎填满了所有的格子！

2.1 完善团队的基础组件 #

前端的基础公共组件，是一直在迭代中的，不过是 2020 年加快了研发的脚步：

1. 打开和下载 APP 组件：用于打开和下载腾讯新闻等 APP；
2. 分享组件：可以在微信、QQ、新闻客户端中设置分享信息，并且在新闻客户端中还可以单独拉起某个分享渠道，拉起分享面板灯；
3. 保存和分享图片组件：很多活动有分享图片的需求，而图片是根据用户一些信息和行为生成的，封装的这个组件，可以很方便地分享图片；
4. 数据请求组件：我们的活动会在多终端发起接口请求，如在微信、新闻客户端、node 端等，每个终端发起请求的方式都不一样，这里基于 axios 封装了一个通用的数据请求组件，开发者不用再关心请求是从哪个终端发起的；
5. 行为上报组件：为了便于统计活动的流失状况，我封装了一个行为数据上报组件，并接入了多个数据收集系统，后续有时间会将该组件改造成插件的形式；
6. 常用工具组件：封装了一些团队前端开发中常用的工具方法；
7. 登录和获取用户信息组件：封装了一个可以在微信、QQ 和新闻客户端中，登录和获取用户头像、昵称的组件；
8. 前端基本的 UI 组件，不过还很不成熟，目前仅限自己使用中；

每个前端开发者都有一个想拥有自己的 UI 组件库的梦，虽然现在有很多成熟的组件了，但这并妨碍我们开发出一套属于自己的的 UI 库，可以顺便看下我之前的文章 前端工程师如何通过造轮子提高自己。在造轮子的过程中，既培养了我们封装组件的能力，也能让我们了解 UI 组件的开发过程。之后就能更加快速地了解其他成熟的 UI 组件。

2.2 搭建团队的发布体系 #

之前我们是在一个很老的 cms 系统上发布页面，可是这个 cms 系统太老了，所有的操作都是手动操作的，完全没有 CI/CD 的过程中。导致在需要开发和发布一个活动时，全部手工操作。

后来虽然有些人通过抓取 cms 的接口，开发了一些自动化的工具，但依然还不方便。

随着公司在推动上云的趋势，我们也打通了自动化的构建和发布体系。所有的构建和发布过程中，全部在流水线上完成。开发者不用再在本地构建、然后手动复制 html 页面中，再进行发布。

从创建项目到本地启动开发，从发布构建到部署上线，完全实现了自动化的流程。方便快捷，开发者只需要敲几个 git 或者 npm 命令，可以完成一个活动的创建、开发和上线。在发布的过程中只会发布当前已发生变动的项目，其他项目不受影响！

并且上线流程也大大简化，只需要将代码推送到对应的分支上，即可完成构建和部署。同时，测试环境、预发布环境和正式环境，天然地形成了隔离。

最后，基于我们业务的特点，在发布过程中，会自动地为该项目加上前端性能监控体系。每个发布上线的项目，都自带性能监控体系。

2.3 axios 源码的分析 #

今年着重对数据请求库 axios 进行了深入了解和源码分析，梳理出几篇关于 axios 的文档：

• 如何实现 axios 的自定义适配器 adapter；
• axios 源码系列之拦截器的实现;
• 必然会用到的 axios 中自带的工具方法;
• axios 源码系列之如何取消请求;

通过 4 篇文章的剖析，对 axios 也有了更多的认识。

在接下来的 2021 年，我的目标是自己先试着开发一套 UI 组件，然后熟悉 ant.design 源码。

2.4 晋级终于通过啦 #

答辩晋级这件事儿，对我来说，真的是感触颇多。终于在第 N 多次的答辩之后，晋级成功。每一次的答辩，都是一次磨炼，让自己有更多的思考。

平时的工作比较琐碎，那么如何提炼升华，也是对自己的一种要求。而且，用功在平时，看平时有没有特别注意对技术和数据的积累，而不是在答辩时，才临时抱佛脚。

这里也看到了一些所谓的互联网黑话：架构设计、稳定性、高可用、必备知识点&技能，复盘，赋能，沉淀，倒逼，落地，串联，协同，反哺，兼容包装，重组，履约，响应，量化，发力，布局，联动，细分梳理，输出，加速，共建，支撑，融合，聚合，解藕，集成对齐，对标，对焦，抓手，拆解，拉通，抽象，摸索，提炼打通，打透，吃透，迁移，分发，分层，分装，穿梭，辐射围绕，复用，渗透，扩展，开拓，漏斗，中台，闭环，打法拉通，纽带，矩阵，刺激，规模，场景，聚焦，维度，格局形态，生态，话术，体系，认知，玩法，体感，感知，调性心智，战役，合力，心力，赛道，因子，模型，载体，横向通道，补位，链路，试点。颗粒度，感知度，方法论，组合拳，引爆点，点线面，精细化，差异化，平台化，结构化，影响力，耦合性，易用性，一致性，端到端，短平快。 生命周期，价值转化，强化认知，资源倾斜，完善逻辑，抽离透传，复用打法，商业模式，快速响应，定性定量，关键路径，去中心化，结果导向，垂直领域，如何收口，归因分析，体验度量，信息屏障。

使用上这些词汇后，是不是瞬间觉得高大上了许多。

3. 2021 的目标 #

2021 年也要好好加油，争取在新的一年更上一个新的台阶。

1. 了解不同状态管理组件的区别，如 mobx, redux, useContext 等；
2. ES6 的标准已经发布好几年了，但还是有有些东西不太熟悉，在 2021 年多熟悉熟悉，例如 Proxy, Symbol, Reflect 等；
3. 编写几个 UI 组件，并熟悉 ant.design 的源码；
4. 在保证质量的前提下，希望博客的数量能达到 40 篇以上；

感恩一切帮助过我的人，愿大家在新的一年大家顺顺利利，都能发大财。

加油！