前端团队如何打造

4,667 阅读7分钟

前端团队如何打造

前言

据我了解,大多数公司里面的前端团队的状态,发展的并不好,在团队中,可能属于一个页面开发者的角色。

与此同时,衍生了一些不得不关注的问题,比如前端团队如何具有更高的价值,团队成员如何在整个团队中获得成长,甚至于对团队个人而言,如何突破个人发展的职业瓶颈。

在一些大公司,好的前端团队一般有一个特质——高效。还有担任着一个重要职责——业务创新!

理解这个问题,首先得从前端的优势说起:

1、相比于其他开发人员,前端是同时离产品和数据最近的地方。前端的本职工作,是做出高效且美观的展示,而前端也能知道数据从哪里来。(比如通过node操作数据库、比如通过node进行接口数据转发)

2、高效的问题,是每一个高级前端,都在思考的问题。从市场上来看,慢慢的,很多公司的前端慢慢成为了业务发展的瓶颈,随着5G技术的发展,以后还会有越来越多的前端应用。

3、前端的边界一直在扩展,以前认为的前端是dom操作,jQuery。现在的主流是单页面应用(三大框架),慢慢的一些原生应用也开始用前端来写,比如我们现在市面上的weex、react-native、flutter等等。同时你会发现,桌面应用也可以用前端来写,比如electron。在node的发展过程中,前端也可以写服务端应用。

前端看起来这么美好,可是为什么优秀的前端团队还是那么少?有时候我想说,其实是我们懂得太少,针对业务发展的问题,我们也做的少,导致现在大多数团队,还是以后端为主的发展模式。

本人想通过文字的方式,把自己对前端在技术上的一些理解,记录下来,并且分享给其他人。目的就是为中小型公司在技术层面,提供一些好的实践的思考,为前端团队赋能。

怎么做

首先申明的是,团队的建设牵扯的面很广,这些仅仅提供一些技术方面的视野,来通过技术改造团队。至于其他方面,不在讨论范围。

从技术角度看,目前大多数公司的前端团队都或多或少的存在这么一些问题,极大的影响着效率的提升。

1、缺少规范,比如Git规范、编码规范、代码的review规范、工作流问题等等。

有没有发现,有些时候,我们的代码,不知道是谁改的,或者合并的时候,怎么就代码冲突了,有时候,我们多个需求同时开发,但是一些需求需要上线,一些需求不需要上线,分支管理的不规范让很多人精疲力尽!

每个人的编码风格不同,高手和菜鸟的代码差异,让每个人看别人都很不爽,甚至有些团队的日常,就是评价某些人的代码怎么怎么样。。

每个的技术水平不一样,特别对于初中级的前端开发,在实现一些比较复杂的业务的时候,按照自己自认为的方式写代码,导致了严重的代码质量问题。为后期的代码维护,造成了严重的障碍,代码的可读性非常的低!

2、缺少沉淀,比如在技术栈上的沉淀,公用组件库的沉淀、公共的工具库的沉淀、模板仓库的沉淀等等。

大家都知道,antd为我们提供了大量的基础组件,解决了我们在react项目开发中的一些问题。element-ui也提供了类似的功能,方面了我们的vue项目开发。

试想一下,如果没有这些ui组件库,我们的效率要降低多少?甚至没有这些组件库,很多初中级的前端开发,都不会写项目了。按照个人的理解,如果一些react项目的开发周期是20天,如果没有这样的ui组件库,我们的开发周期至少要多加5天。

基础组件库,解决了我们的一部分问题,但是还有一些问题没有解决,因为每个公司的业务都不一样,我们可以根据自己的业务,做一些定制化的开发,做一些集成度更高的业务组件库。比如复制组件、上传组件、搜索域组件、高级表单组件等等。

这样,之前我们开发一些页面,可能是由搜索框、表格、分页等等基础组件拼接起来的页面,现在我们有了业务组件库,可能这些基本功能都是可配置的,以前需要3个小时的开发工作量,现在可能只需要半个小时。

模板仓库,又是另外一个主题,模板仓库的意义,在于集成公用的东西,比如公用的css、公用的项目配置、公用的组件集成、监控的集成、埋点的集成等等。

3、缺少合格的技术领袖

首先要明白,什么是技术领袖,技术领袖是一种创造良好的技术团队氛围的人,敢于向技术痛点难点攻关,形成最佳实践的人。

一般而言,一个团队的TeamLeader,应该充当这样的一个角色。

举个例子,假如我们现在的团队问题是开发效率低,TeamLeader的作用就是给这些问题找方案,而不是让大家拼命加班,要想是什么阻碍了效率的提升。

至少,我们可以从好几个方向上提升开发效率,比如针对团队内部,制定开发流程,推动前后端,统一接口格式。针对一些项目,做一些技术沉淀,让开发就像复制粘贴一样。做一些技术分享,推动团队成员的技术学习氛围。做一些代码review,防止重大的代码质量问题。

具体的实践上,要结合自身团队,具体问题,使用不同的方式方法。

文章探讨和分享

以上基本上属于一些比较大的空,没有具体实践意义的话,本人的意思,会分享一些系列文章,提炼出可以在公司内部使用的一些方案,下面的每一篇文章,都会针对其中的一个点,进行分析,总结输出。

会分为两部分,一部分是基础工程篇,我个人觉得是通用的,每个团队都用得着。另一部分是进阶篇,主要是针对前端团队自身业务,做一些技术上的创新和业务上的创新。

基础工程篇

前端团队如何做Git规范

介绍:主要关于Git分支的管理、Git命令提交的message格式校验等等。

链接地址:juejin.cn/post/685705…

前端团队如何做lint规范

介绍:主要关于eslint配置、stylelint配置、自动命令修复等等。

链接地址:juejin.cn/post/685819…

前端团队如何做代码review

介绍:主要是自身在代码review上的一些实践和经历。

链接地址:juejin.cn/post/686036…

前端团队的模板仓库

介绍:一个好的模板仓库,到底该怎么弄?

链接地址:juejin.cn/post/685889…

前端团队的脚手架开发

介绍:主要介绍两种简单的脚手架开发的示例,结合模板仓库,让开发和命令行一样简单。

链接地址:juejin.cn/post/684490…

前端团队工具库

介绍:针对团队内部,常用工具方法的集成。

前端团队的监控和埋点

介绍:作为小公司,如何快速高效的做埋点监控

链接地址:juejin.cn/post/687258…

LowCode和NoCode思考和实践

介绍:如何在业务中,尽可能的少写代码!

自动发布集成

介绍:解放与开发无关人力损耗,让效率飞起来。

进阶篇

ProComponents介绍和思考

feature-owner机制

技术 && 业务双轨制

自研项目的创新实践

以上文章,会一一发布到掘金上,持续的进行更新。