likes
comments
collection
share

回忆2022，这些文章可能会更好的帮助你进阶～

作者站长头像
站长
· 阅读数 42

「回顾2022，展望2023，我正在参与2022年终总结征文大赛活动」

大家好，我是小杜杜，2022年转眼即逝，在这一年中学到了很多，也收获了很多，尤其是认识了好多大佬，我深知与各位大佬的差距很大，但我会尽力去追赶上你们。

最近被🐑弄的身心疲惫，周边有好多人都🐑了，嘴上说着不怕，但还是比较畏惧，愿我爱的人和爱我的人都能健康平安，🐑了的人早日恢复，加油！！

数据概览

在这一年中共写了56篇文章，看似很多，实际上好多文章都是水文，真正质量高的文章却很少，这或许是今年比较遗憾的点，希望明年能写出更加优秀的好文

这里主要介绍两个专栏：深入React，彻底搞懂React 和 前端八股文

一个是React的深入，另一个是有关前端的一些面试知识，感兴趣的小伙伴可以关注下，一起上车学习～

前端八股文

这个专栏主要介绍有关前端的一些杂文，主要作用是地基的作用，可以说是新手玩家必备的装备，打怪升级的辅助道具～

cli

文章：10分钟，打造一个专属于你的cli 和 使用 cli，只需几秒就能出现一个模板？

这两篇主要介绍如何快速的打造一个cli，打造一个属于专属于自己的命令，如何创建，如何发布，如何去下载项目，如何创建一个模版等....

回忆2022，这些文章可能会更好的帮助你进阶～

别看很简单，其实很有趣，而且它可以统计一些数据，属于自动化的工具，笔者也运用在工作之中，还是比较有趣的内容～

ES系列

文章：🔥花一个小时，迅速了解ES6~ES12的全部特性和花十分钟，迅速了解ES13的全部特性

回忆2022，这些文章可能会更好的帮助你进阶～

回忆2022，这些文章可能会更好的帮助你进阶～

这两篇文章详细介绍了ES6～ES13的全部语法，如何使用，扩展应用等，并做了归类，你可能在日常中不使用，但有必要做一个系统的了解，因为这是基础中的基础，还是蛮重要的～

TS

文章：一篇让你完全够用TS的指南

回忆2022，这些文章可能会更好的帮助你进阶～

随着TS的普及，可以说TS是前端必不可缺少的一部分，掌握他们非常重要，我们不说怎么深入ts，但至少要学会基本的使用

git

文章：🔥这些git技巧，你都会了吗？

介绍什么是git，如何去绑定git，以及对应的可视化工具，以及一些常用的操作：

  • 首次提交文件到git
  • 查看分支、切换分支、合并分支
  • 分支提交错了，版本回退
  • 做完了整个需求，但只上部分需求
  • 把分支删了怎么办
  • 提交的commit太多了，最后不方便看到底改了啥
  • 代码冲突了，怎么搞？

其他文章

package.json文件：通过开水果店，帮你全面了解package.json文件的作用

早期的一种尝试，把项目中的字段当开店那样介绍，自认为蛮有趣的，简单易懂，但可能技术文章还是不要整花活好点，算是一种有趣的试验吧～

Nginx： 作为一名前端，该如何理解Nginx？

回忆2022，这些文章可能会更好的帮助你进阶～

感觉这篇没讲什么，但不知道数据出奇的好，很纳闷，搞不懂为啥，可能还是比喻的好😁

CWV：老说性能优化，那么你知道浏览器如何评判网站性能吗？

讲述如何测评网站，当然是对Google而言，CWV分别代表什么，以及如何优化提升，目前的感觉没啥用，跟开发基本没半毛钱关系，只是一种概念，还没听过因为CWV的指标不能这么开发的话语，也有可能是咖位不够吧～

React 百问总结

深入React，彻底搞懂React，这个专栏介绍有关React的源码、核心内容等，如果你面试React，这些文章应该足够了，当然明年也会不断更新，希望大家可以持续关注，我们一起进阶学习。

hooks

文章：搞懂这12个Hooks，保证让你玩转React

回忆2022，这些文章可能会更好的帮助你进阶～

阅读这篇文章，将会获得：

  1. Hooks的由来是什么？
  2. useRef的高级用法是什么？
  3. useMemo 和 useCallback 是怎么做优化的？
  4. 一个好的自定义Hooks该如何设计？
  5. 如何做一个响应式的自定义Hooks？
  6. 如何做一个可以监听任何事件的自定义Hooks？

这篇文章详细的讲解了如何使用自定义hooks，配合案例去讲，这篇内容也确实比较火，也有很多人给我说，一开始认为hooks很简单，看完我这篇后，发现完全不懂。。。。

实际上，笔者也有这种感觉，我也在一直思考一个问题：学会 === 学会？

注意，这里我用了强等于，想想自己是否真的掌握，当你深入后才发现之前所了解的内容不过是皮毛，深度挖寻后才能体验到React的魅力

另外，笔者正在写一本关于hooks的小册，从基本使用的官方Api，到自定义hooks的开发、再到源码，及对应的实战系列，内容将会比这篇更加丰富，更加全面。

同时整个小册会用ts，jest、fiber等辅助知识，让你真正做到：学会 === 学会，所以这本小册适应零基础、初级、中级的React开发者

这本小册是我的第一本小册，不敢说有多好，但绝对保质保量，希望大家能多多支持，希望能在你工作、进阶React上出一点绵薄之力，那么这本小册就是成功的～

React v18 API

文章：「React 深入」一文吃透React v18全部Api（1.3w+）

回忆2022，这些文章可能会更好的帮助你进阶～

工欲善其事必先利其器，我们不说要多么掌握，但至少要知道有哪些API，这相当于提升了思维广度，在一些特定的场景中能发挥意想不到的效果。

文章共包括：组件类、工具类、生命周期、react-hooks、react-dom五大板块，涵盖了v16～v18的所有API如何使用，以及扩展用法，想要熟悉React的小伙伴，可以收藏看看

HOC

文章：作为一名React，我是这样理解HOC的 、花三个小时，完全掌握分片渲染和虚拟列表～

回忆2022，这些文章可能会更好的帮助你进阶～

HOC为高阶组件，它的重要度想必不再多说，大家也能明白，跟hooks一样，你真的了解HOC，阅读完这两篇你将会获得：

  • 什么是高阶组件，它的作用是什么？
  • 高阶组件的编写结构是什么？
  • 高阶组件如何编写，如何发挥应有的作用？
  • 高阶组件可以做什么，如何制定一个公共化的高阶组件？
  • 如何通过高阶组件封装一个虚拟列表？

比较偏向于class，相比于hooks，比较弱势，但掌握HOC是任何一个React开发者必备的技能

虚拟DOM和diff算法

文章：「React深入」一文吃透虚拟DOM和diff算法

回忆2022，这些文章可能会更好的帮助你进阶～

虚拟DOM和diff算法是React中最为核心的部分，虚拟DOM通过；结构、操作、流程与真实DOM对比，diff算法通过与传统的diff做对比，以及diff策略，全面解读，阅读完后你将会获得：

  • 虚拟DOM到底是什么，它与真实的DOM有什么不同？
  • 在React中，为什么自定义组件的首字母要大写？
  • 有了虚拟DOM，性能就一定能够得到提升吗？
  • React的diff算法与传统的diff算法有什么区别？为什么受到吹捧？
  • diff策略有哪些？它们是如何比较的？
  • 为什么在循环中不要用索引（index）做key值呢？
  • ...

Jest单元测试之hooks

文章：花一个小时，迅速掌握Jest的全部知识点~、「React 深入」一文玩转React Hooks的单元测试

单元测试重要吗？答案是肯定的，但对工作有用吗？不一定，因为单元测试是一个很大的模块，同时它是保证我们代码质量的利器，对业务代码而言，单元测试并不会普及，原因是太过耗时，但对于一款开源产品，单元测试则是必不可需。只能说对技术有追求的小伙伴有用，如果只是为了混口饭，建议不用涉及，因为确实用不到

学习完这两篇，你将会获得到：

  • 如何做一个简单的单元测试？
  • Jest 有哪些语法，Jest 的报告包含哪些信息？
  • 如何与ts兼容，需要哪些配置？
  • Hooks该如何进行单元测试？
  • 如何模拟各种场景，创造div，模拟点击等？

实际上关于hooks的模拟并不是很全面，剩余的内容会在新的小册中全部体现出来，还请期待～

React事件系统

文章：「React 深入」React事件系统与原生事件系统究竟有何区别？、「React深入」一文吃透React v16事件系统、「React 深入」畅聊React 事件系统（v17、v18版本）

回忆2022，这些文章可能会更好的帮助你进阶～

这三篇文章可以说是详细讲解了React中不同版本对应的事件系统，对比原生的事件系统，React有何区别，通过源码、一些案例，详细说明了，阅读完你将获得：

  • React为什么要单独整一套虚拟的事件系统，这样做有什么好处？
  • React的事件系统，与原生的事件系统有什么区别？
  • 什么是合成事件？
  • React中是如何模拟冒泡和捕获阶段的？
  • 所有的事件真的绑定在真实DOM上吗？如果不是，那么绑定在哪里？
  • React中的阻止冒泡与原生事件系统的阻止冒泡一样吗，为什么？
  • React是如何绑定事件的，又是如何触发事件的？
  • 为什么绑定onChange事件后，document会多出很多监听器？
  • onChange是对应的原生事件的change吗？
  • 什么是事件池？它又是如何进行工作的？
  • 什么是事件插件机制，合成事件和原生事件都是一一对应的吗？
  • 如何进行批量更新的？
  • 为什么在不使用箭头函数的情况下，要通过bind绑定this？
  • React中的捕获事件，走的真是捕获阶段吗？
  • Reactv17、v18在v16的基础上做了哪些该改变？
  • 在v17中事件系统又是如何绑定，如何收集，如何触发的？
  • 对比与原生事件的捕获、冒泡，不同的版本，执行的顺序是什么？
  • 为什么要取消事件池？
  • ...

可以看到，概念还是比较多的，建议熟读哦，因为面试，可是经常会问到哦～

fiber

文章：「React 深入」知悉Fiber，方能百战不殆～

回忆2022，这些文章可能会更好的帮助你进阶～

fiber是一个非常大的概念，是整个 React 核心，但这篇没有涉及到任何难懂的点，可以说是是一篇入门文章，阅读完后你会对整个fiber有一个明显的概念，自认为还是蛮不错的，感兴趣的可以看看

总结

一起加油，一起共勉，愿疫情早日过去，永远不要当神雕大侠，加油！！

转载自:https://juejin.cn/post/7178393682352029751
评论
请登录