前端团队成长计划(一):基础知识梳理

摘要:
一个月前我开始了前端团队的成长计划,主要主语两方面的考虑:校招应届生能快速进入工作的状态达到一个能支撑业务的技能水平,提前学习主流前端技术,为未来的业务代码重构做储备。5月是整个计划的第一个阶段,主要的任务是,梳理常规前端基础知识和开发技能。好多在校的学生对前端的了解基本上都是靠各种论坛,学校往往不会系统的教授前端相关的知识。

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

5月的计划如下:(偏基础)

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

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

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

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

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

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

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

前端团队成长计划(一):基础知识梳理第1张

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

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

一、“会”的很多

在最开始,还是和今年新入职的校招生简单聊了一下。发现有一个共同的特点,就是简历上“会”的很多,基础不是很扎实,但是会的东西很多。这句话听起来有一些矛盾,但是事实就是如此。好多在校的学生对前端的了解基本上都是靠各种论坛,学校往往不会系统的教授前端相关的知识。努力专研的同学就会,把论坛中出现的各种名词(比如: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月,我期待半年后同学们的绽放!

前端团队成长计划(一):基础知识梳理第2张

免责声明:文章转载自《前端团队成长计划(一):基础知识梳理》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇量化学习 | 配对交易 backtrader实现记一次使用Consul进行服务注册和服务发现下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

用gulp清除、移动、压缩、合并、替换代码

之前前端代码部署时用的是grunt,后来又出了个gulp工具,最近试用了一下,很方便,感觉比grunt简单好用,下面把一些常见的任务列一下,备用。 var gulp = require('gulp'); var sdir = '0.0.1'; var ddir = '0.0.1.release'; var gutil = require('gulp-u...

搭建前端监控系统(备选)用户行为统计和监控篇(如何快速定位线上问题)

背景:市面上的监控系统有很多,大多收费,对于小型前端项目来说,必然是痛点。另一点主要原因是,功能虽然通用,却未必能够满足我们自己的需求, 所以我们自给自足也许是个不错的办法。 这是搭建前端监控系统的第二章,主要是介绍如何统计js报错,跟着我一步步做,你也能搭建出一个属于自己的前端监控系统。 =================================...

前端工程师技能之photoshop巧用系列第二篇——测量篇

前面的话   前端工程师使用photoshop进行的大量工作实际上是测量。本文是photoshop巧用系列第二篇——测量篇 测量信息   在网页制作中需要使用photoshop测量的信息分为两类,分别是尺寸信息和颜色信息   【1】尺寸信息     尺寸信息主要通过矩形选框工具配合信息面板进行测量,共包括以下项目:     1、宽度、高度     2、内边...

DevOps 视角的前后端分离与实战

本文作者:CODING - 廖红坤 前言 随着微前端、微服务等技术理念和架构的蓬勃发展,我们已经没必要去讨论为什么要前后端分离这种话题,前后端分离已成为互联网项目开发的标准模式。前后端在各自的领域发展越来越纵深。 DevOps 视角的前后端分离 今天我们换个视角,从 DevOps 的角度来聊聊前后端分离。 项目协同 DevOps 体系中包含了敏捷开发方法...

用fiddler修改接口返回数据从而实现前端的测试

(1)首先得区分开这个修改返回数据与mock的区别,前者是后端已完成,接口能正常请求到数据,我们做的是修改返回的数据。后者是后端没有完成,无法请求到数据,我们做的是构建一个虚拟的后端,只要前端请求就将事先准备好的数据返回即可,这里会有一个mock的服务 (2)怎么使用fiddler修改返回的数据并让前端显示我们返回的数据 ①首先设置代理:要能抓到https...

前端框架现状调查

转自:前端框架现状调查        Ashley Nolan是来自英国食品速递公司JUST EAT的一名资深Web UI工程师。为了了解整个前端开发社区当前的知识和使用水平,他发起了一个面向前端开发人员的调查,问题涉及CSS、“任务执行器(Task Runner)”、JavaScript等方面。前期,他收到了649份回复。近日,参与者数量达到了1044。...