前端团队成长计划：基础知识梳理

Posted 2020-09-21 前端—郭瑞

　　一个月前我开始了前端团队的成长计划，主要主语两方面的考虑：校招应届生能快速进入工作的状态达到一个能支撑业务的技能水平，提前学习主流前端技术，为未来的业务代码重构做储备。5月是整个计划的第一个阶段，主要的任务是，梳理常规前端基础知识和开发技能。

5月的计划如下：（偏基础）

　　1、js和css的一些规范以及常规功能如何实现；

　　2、了解现有业务工程的开发，部署，上线流程以及原理，做到可交叉维护；

　　3、初步了解gulp，为下一阶段做准备。

　　4、了解PC开发中常见的问题以及IE浏览器的兼容方式（IE8+）

　　5、了解wap开发常见问题（比如meta的意义，常见的屏幕自适应方案）

　　6、了解常用的CSS布局技巧，比如圣杯布局、BFC（了解负边距的使用方法、盒模型的特点、margin折叠）

　　7、掌握js闭包、this指向，学会传入回调的函数书写方式。

　                          　

　　

　　这部分的计划对于很多人来说应该是比较简单的，或者说应该是招人的最低门槛。但是在实际的校招中，我们不一定会亲自去招人。往往会出现碍于招聘政策的原因，招到很多教育背景还不错，但是实际开发能力不是很强的人，或者是能力有偏向（一方面强、另一方面很弱）。我才会特地的设计这么一个计划，尽可能的修补团队短板，使大家快速达到能够参与日常开发的状态。

　　接下来简单说说这一个月以来我们一起做了哪些？有什么感悟？

一、“会”的很多

　　在最开始，还是和今年新入职的校招生简单聊了一下。发现有一个共同的特点，就是简历上“会”的很多，基础不是很扎实，但是会的东西很多。这句话听起来有一些矛盾，但是事实就是如此。好多在校的学生对前端的了解基本上都是靠各种论坛，学校往往不会系统的教授前端相关的知识。努力专研的同学就会，把论坛中出现的各种名词（比如：node、gulp、webpack、es6、react）都研究个遍，单单看简历的话，就会觉得会的东西比一个工作一两年的人都多。但是真的是这样吗？

　　我在长期的校招甚至是社招面试中发现简历上提到的技术，有可能只是他们看过文档而已。有的甚至连demo都没有写过。一个很简单的问题就能暴露出来。我不是说这样做不对，因为“会这么多技能的人”太多了，你的简历上没有这些东西，简历很难通过初筛。但是你说他不懂，其实也不是，毕竟还能和你简单介绍介绍这个技术，而且在我看来在学校没人教的情况下，能主动自觉的了解这么多知识，已经是很可贵了。

　　我们需要人这个“会”变成真正的会，毕竟曾经自学了解过有过感官认识，如果能够系统化的学习，会比普通人学习的快一些，这也是我的计划的目的。考虑到其他几个知识点需要循序渐进的学习，我打算在第一阶段只加入gulp的初级使用。主要原因是：1、gulp的学习和其他的东西关系不大。2、node的系统庞大，直接开始node server的学习可能比较陡峭，用gulp作为node环境的入门会比较有趣味性、同时在第一阶段会有比较好的成就感。3、学会了gulp在下一阶段学习less、es6这些，就可以自行搭建工程环境了，gulp会是一个比较好的铺垫。4、很多知识比较基础，对于新员工来说，会觉得很枯燥（即使他们不是很会），gulp是他们听说过的主流技术，容易引起他们的兴趣。所以我第一次的培训就选择了gulp，让他们有一个区别于官网文档的系统学习。培训结束后在找一个工作中需要的场景写一个小工具，并在之后的学习中不断的迭代。

二、“会”的很少

　　刚刚说到简历上“会”的很多，但是简历上没有的，往往会使实际工作中常常用到的。比如：IE的兼容性处理、常用的布局方式、编码习惯、wap屏幕自适应、盒模型、闭包、this指向等，这些才是前端开发的基本功、甚至是“内功”。这些东西需要完整的学习、时间的积累，由于求职的原因，往往校招生对这些不是很重视，尤其是涉猎了那些“高大上的东西”后，就更是看不上这些粗茶淡饭，但是哪些“高级”的东西又能用到几回，工程搭建好了以后就很少改动了，大多数时间，我们在写业务代码，也就是切图+逻辑。我尝尝听到一些同学说我js学的多，不会切图。我也是很无奈，不会切图我招的还是前端吗？不会切图的话你的js估计也写不了多好。我在第一个月主要做的就是把这70%的场景用到的知识教明白。至少能说自己是个初级的前端工程师。我这阶段的分享主要集中在这些基础知识，包括浏览器调试技巧、常见的坑有哪些等等。

三、不是很规范

　　其实这一点是难免的，对于应届生，能把功能写明白就不错了，还哪里有精力去估计编码规范、可读性、复用性这些“代码礼仪”。对于基本的通用规范，我们交给jslint去完成，正好这个阶段要学习gulp，那就不妨用gulp写一个检查项目中各个模块的jslint的小工具。从最初的几行代码调几个gulp插件到后来逐渐丰富的动态读取日志导出等功能。工具已经不仅仅是一开始的那么单一了。

　　而代码的优雅和最佳实现，就要做coding review了。大家一起坐在会议室，投影仪上是某个同学的commit，我们一行一行的追问问什么这样写？可不可以写的更优化？逐渐的能感觉到后期再想挑毛病就难了。后期也只是抽查。

四、交互实现思路不清晰

　　一般来说，新手很难有较好的交互实现的思维，尤其前端这种偏重表现的。往往是网上搜一段，就填补到代码中，发现和需求不是很贴合，就再找一段。比如轮播，无限循环、页码组件、搜索联想等常用的功能就应该是心中有数。这个就要靠一些小作业针对性的强化。

　　

　　这一个月以来，由于我的感冒稍稍耽误了进度。但好在同学们都按照计划推进了。夯实基础的5月结束了，下面是进阶基础的6月，我期待半年后同学们的绽放！