如何从前端小白到带团队的技术小牛

正文如下

本文是第十一届 - 前端早早聊女生前端职业发展专场，也是早早聊第 69 场，来自 百度 鳗鱼小姐姐 的分享讲稿简要整理版（完整版含演示请看录播视频和 PPT）：

一、前言

大家好，我是鳗鱼，现在在百度担任前端开发，今天要跟大家分享一下自己的成长历程，先简单的自我介绍一下。我是 14 年在学校就开始接触前端，16 年 4 月的时候在菜鸟实习，17 年 7 月校招进入百度到现在。在百度之后，大概是经历了一年半左右，从 T3 走到 T5，18年底开始负责一些事情，并辅助团队建设，现在是大概带十个人左右。

说实话作为本次直播第一个，有点紧张，特别这是一个妹子专场。自己虽然作为妹子，然而一个踏入职场没多久的妹子，感觉还没经历太多的“男女生差异”，经验也不是太多，所以着重点不在于“女前端的差异”。

不过互联网行业，一般都是女生当男生用，男生当畜生用，所以无论男女，都会有一定的职业发展上的困惑。这里主要会侧重于在成长过程中，我们可能会经历哪些阶段，可以通过哪些维度来理解，结合自己的经历分享一些个人觉得不错的小经验。

本次分享大体包括两部分，一个是自己的成长经历描述，分为适应期，热血期，焦虑期，还有突破期。其次是一些具体的经验分享，后续仔细讲。

二、成长历程

1. 适应期

这是刚进入职场的小萌新的时期，主要是 16 年在菜鸟实习，以及刚进入百度前一两个月的一小段经历，这个时期在我身上，主要是从校园到职场的过程。

这个时期的背景：自己虽然在学校有接触前端，但都是小打小闹的类型，没有系统的做过大项目。而且经历过那个时期的同学可能有感受，当时是出于前端技术混乱的一个阶段，自己还是停留在使用 jQuery 操作 DOM，对于现代前端每天都会用的 npm 都不是很清楚，更别说 Vue 或者 React 了。在沟通合作方面，对项目的一个开发运作流程也不是很清楚，还停留在别人让做什么就做什么的阶段。

然后自己当时进去是在做什么呢？

1. 在业务上，做的是一个快递的电子面单编辑器的东西。当时的技术栈是 Vue +TypeScript，作为一个 npm 是啥都不知道的人，基本上也只是打打辅助，帮忙修修小 Bug；
2. 然后还有个基础建设的任务，说实话现在已经不记得是做了啥了。在被负责的同学催了无数次，只能说照葫芦画瓢，提交上去，后来发现，提交的内容基本上被改得我也不认识了；
3. 另外还有个小工作，作为实习生，一个比较偏打杂类型的东西，就是帮各大业务部门上线各种合同协议上线的功能，很简单，就是 Word 转 HTML 然后帮忙优化优化样式，上线。

现在回过头看，这个经历真的就是平平无奇的，技术上其实也没感受到太大的进步，但是有一些特质是有了一些苗头的，对于自己之后的成长有很大的帮助。

在做合同上线的时候，发现都是机械劳动，秉着偷懒是程序员美德的一个想法，这种事情肯定是说能不自己做就不自己做。但是有过类似想法的同学都知道，想让业务方自己操作，但是去让一个不懂技术的人写几行代码上线真的就太难了。

然后自己经过各种研究，发现当时的淘宝有套 CMS 系统，能直接上线 HTML。这在当时相当于是一个跨部门的调研，在自己尝试几次之后，书写了转换攻略，以及一份 CSS 文件给整成了模版，教相关同学使用后就完全交出去了。后续在其他的业务中也有借鉴这种模式。

说完上面的故事，其实这里有两个特质是值得去沉淀的：

1. 不只是满足于分配的任务，可能还会主动做一些额外的事情，虽然是个简单的实习生还什么都不懂；
2. 能从普通的小事里面发现更优解决方案。

总结下来就是会搞事情，这个特质一直持续到了后面的整个成长过程中。

2. 热血期

在过了一个基本的适应期之后，业务开始逐渐熟悉，然后就进入了下一个阶段热血期，这个时期听名字就知道，是充满激情与热情的一个时期。

首先还是说一下大背景，这是在进入百度之后的几个月后，发现团队内部的历史包袱还是比较重的，项目基本是 Riot 框架开发，就是一个过气的小网红，甚至有残留的 jQuery，更别说现代的工程化组件化这些东西了，以及团队对于新人的培养机制也是有待加强的阶段。

那这个时期自己做了什么呢？具体做的业务就不详细说了，也就是一些 Web 端，移动端的开发。当时自己感觉很多东西看得不顺眼。然后在项目中给了一定的任务，但没有太大的约束，就有空间去各种捣鼓。不仅说业务上接触了 PC 端移动端，以及 HyBird 的混合开发，在基础建设层面，也沉淀了不少通用组件，梳理了团队代码规范，还弄了几个脚手架，照着 AntD 的市场弄了个内部的脚手架市场。额外的甚至还玩了玩 Three.js 的 3D 动画，学了学 OC 的基本语法，并给我们 iOS 客户端提交了代码。

总的来说就是一句话，这个时期，不断的基于现有的业务，衍生出了很多可以沉淀的东西，也有去提前调研一些前沿感兴趣的东西，并贡献进了基础建设层面。

回过头看，这个时期，是技能点突飞猛进的阶段。基本内部提交记录每天都是满的，没怎么休息过，每天下班或者周末回家，都是没啥事就开开心心写代码。到现在为止，也是系统记录的加班时间，跟自己每天的代码提交记录是完全对不上的。这个时期的所作所为，为后面把控全局能力提供了一定的视野基础。

总结来看呢，这个时期有两个点自我感觉不错的：

1. 对待项目，是一个主动，积极热情的态度，不光只是应付了事；
2. 专注，虽然刚刚说做的事情多，但是每个事情其实都是一步步，专心的去完成的。

3. 焦虑期

上个时期大概维持了一年多吧，其实也没有太明确的界限之分，然后就进入了下个时期。

随着参与业务的增多，以及逐渐从配角变成主要负责人，什么事情都想亲力亲为，逐渐有些应付不过来。发现之前在热血期虽然捣鼓了很多东西，但是落地的效果比较一般。更加悲惨的是，当时自己的老大离职了，团队人员变动也挺大的，在这个阶段，自然而然的就有些焦虑。

焦虑期，这个时期做了什么东西呢？

首先是一个推进工程化落地的过程，毕竟刚刚说落地效果不佳，就找部门其他团队商量对策不断改进，最终全部门接入。其次是还有些项目，开始承担项目负责人的角色，不光是前端开发，还把控整个项目的进度节奏。以及有一个小小的实验点，就是有一个稍微简单的项目，使用 Node.js 做后台，算是 JS 打入了一个新领域。

现在回过头来看这个时期，实际上就是充满荆棘的。

我相信大家或多或少都体会过，我们的人生可能不会是一直一帆风顺的，我对这个时期的认知，就是职业生涯的焦虑期。比如我自己就遇到了三个经典的挫折：

1. 由于之前热血期像打了鸡血一样，处于一个向前狂奔的状态。很多事情更在意产出，而忽略了整体的质量，以至于累积的技术债开始让自己踩坑；
2. 团队的调整和人员的变动，让大家开始在工作上感觉到迷茫和失落；
3. 负责的东西多了，任务繁杂之后，什么事都想自己做，明显精力不够用，经常就是白天各种扯，晚上回家继续写代码。

幸运的，自己熬过了这个焦虑期，感觉不用多久，就会升职加薪、迎娶白富美、走上人生巅峰，想想还有点小激动呢。

说回正题，走出焦虑期的关键所在，可能不在于你做什么事，而在于你怎么去做事，以及如何去看待事情，一句话概括，就是软技能。以我自己为例，感觉主要有三个点：

1. 对于技术债，通过每次项目的复盘，不断总结反思，去看到自己的不足并快速改正；
2. 对于团队的变动，可以去调整自己的心态，以及用积极的心态进一步影响周围的同学；
3. 在面对事情过多的情况，这个其实就是时间管理的范畴，市面上有很多文章书籍可以参考，自己的经验就是每天花十分钟整理好自己的 TODO 系统，分清优先级，再开始工作。

4. 突破期

最后一个阶段突破期，这个时期感觉是从 19 年的 6 月开始的，但也还是目前的一个时期。

这个时期的一个大背景就是，自己在技术上已经有一定的沉淀了，但是缺乏整体的规划。团队上经过不断的招聘，开始趋于稳定，自己也有一定的精力开始思考更多的东西。在协同方面目前充当一个技术管理的角色，当然还是会实际参与一些业务开发，但是通过经验的积累有了更高层面的视野。

这个时期，不仅是技术上的成长，有更加丰富解决问题的能力，日常任务工作开始感觉到能够更好的应对。这个时期具体是做了什么呢？

在业务上，自己主要负责对一个历史性大型项目梳理出了一套渐进式重构方案，然后呢在新人项目由于进度把控不当，也会当当救火队员，参与开发。另外更多的可能是一些自己捣鼓的事情，比如说团队的规章制度的完善，去规范项目的开发流程，以及在部门层面推进 Code Review，和文档沉淀之类的东西，并参与部门层面的基础建设。

因为这就是目前的时期，所以其实也没有回过头看的环节了。最开始，感觉到很多事情都趋于稳定，没有太大的挑战，这时候想起了大家常说的一个词，舒适区。这里思考一下，我们讨论的舒适区到底是什么？个人感觉舒适区有两个特点：

1. 你当下做的事情能够应付自如；
2. 你被动接触新的挑战的机会变少。

那么我们应该如何去走出舒适区，大家应该都听说过一句话，温故而知新。这里稍微改动一下，就是我们的答案了，温故，和知新。

温故，其实就是一个厚积薄发的过程。举个例子，比如 CI 的处理，基本上看到的问题都知道怎么做，但是这还是处于遇到问题解决问题的状态，甚至有一小部分问题只是停留在表层，没有触及到问题的根源。然而有些同学就止步不前，进入了舒适区。

这里有几个走出舒适区的建议：

1. 系统化的去看待问题；
2. 追溯根源；
3. 多沉淀。

再送大家一句话，华罗庚说的：读书最好状态，先把书读厚，再把书读薄。实际在工作过程中也是一样。

刚才说的是温故，现在说一下知新，顾名思义就是探索新的领域。通常来说大家在一段环境呆久了，可能就会稍微有麻木，看不到新的方向，这个时候，可以看看外面的世界。具体呢，可能需要自己感悟。

其实刚刚跟大家扯了那么久，感觉我自己也并没有突破这个阶段，只是说在不断探索的过程中，有了一些感悟，并给大家简单分享分享。

总的来看，自己一路走来经历的几个阶段：

1. 适应期，主要是能力提升；
2. 热血期，开始分辨优劣，形成个人主张的一个过程；
3. 焦虑期，主要是出现一些现实跟预期不符的一些冲突管理，并在冲突解决中寻求自我成长；
4. 最后是，在一切趋于稳定的状态，懂得怎么去走出舒适区。

比如说对于工作任务上，在适应期的时候是被指派的，在热血期就开始能对任务做一个自我把控，在焦虑期的时候学会了整体的项目排期，并开始知道和指派其他同学，在突破期的时候，就开始负责多项目的排期，当然有一些细节层面的排期会委托给其他同学负责跟进。

基本上就是一个能力提升，到形成个人主张，到冲突出现，以及后续稳定求变的过程。另外还有个人主张，业务能力，技术设计，团队协作这几个维度，都有一定的变化，这里就不做赘述。

三、经验分享

上面的自我故事已经讲完了，可能每个阶段已经都有一些小回顾总结，有心的同学可能已经发现了，那里的经验也有不少。然后让我们整理再来看，总结总结升华升华，上述所有经历贯穿的有几个点。

1. 方向

首先呢，方向。可能大家初入职场，有时候有很多不适应的地方，会出现迷茫，找不到自己的方向。或者在职场中期，一直埋头写业务，觉得自己没有任何进步，想努力又不知道怎么做。

这里呢，先抛出一个问题，思考一下，作为一名前端工程师，我们平时在做啥?

这里引用王兴的一句话，他认为 “互联网改变了生活的方方面面，最重要的是衣食住行，生老病死。”

个人感觉其实这就是我们的所有产品需求的根源。

为了满足上述的需求，总结下来，产品做的主要也就三件事。把线下的变成线上的，把手动的变成自动的，把一些繁琐的变成智能的。即电子化，自动化，智能化。

然后在看回我们的前端，前端做的工作，主要是负责产品的界面，流程，数据这几方面，他作为一个人机交互的粘合剂的存在的。往下拆分，最简单的有界面的渲染，交互体验优化，基础业务逻辑的开发，动画动效的探索。有些业务为了更好的用户体验，可能需要进行多端支持，比如说移动端，小程序，React Native 等。然后我们为了提升开发体验，我们有中台服务，需要了解构建部署，需要跟不同的人协调，需要处理研发交付的流程等。

这些每个点再往下拆分，又能有很多很多的小点，这里要表明的一个点就是，前端不简单，对于一些不知道方向，不知道做什么，是一件很正常的事情。

个人的建议来说，一开始，迷茫的时候，不用被市面上的各种资料给吓到，不用想着面面俱到，什么都想深入研究。初入职场，作为新鲜血液，很多东西跟你认知的不一样，因为这个时候是难得的，没有麻木的惯性的理念束缚，所以可以优先的去接触不同的东西，不断探索。然后把所有看不爽的东西都可以记下来，后面等时机成熟了，所有令你不爽的，都是优化空间。

然后当你看的东西多了之后，可能才能找到你所喜欢的方向，然后深耕下去。其实这个的专业术语叫， T 字型人才，具体细节可以自己查找。

这个是乔布斯在 05 年斯坦福演讲说的话：“You can't connect the dots looking forward; you can only connect them looking backwards. So you have to trust that the dots will somehow connect in your future.”

对英语不大好的同学，简单翻译一下：虽然你现在可能看不见未来，但在未来的某个时刻回头看，你生命的点点滴滴都是有联系的，你目前的所作所为都构成了你的未来。

2. 态度

可能我们在职场生活中，都会遇到一些不如意的事。比如一个凡是有规模的，存在了一定时间的公司，基本都会有历史债的存在，也可能会有其他沟通协调你觉得不舒服的地方。这个时候，就是传说中的，丰满的理想和骨感的现实不一样，你的态度是怎样的，不同的态度导致出来的结果肯定是不一样的。这里我们看个小例子。

有小 A 和小 B 两个同学，他们进了同一家公司，发现，这里还是一个刀耕火种的时代，老板每天只是看着你的系统做完了没上线了没，公司盈利多少。这是一个很常见的场景，然后两个同学他们不同的态度。

小A：进来开始吐槽，这公司怎么这样啊，跟我想象的一点都不一样，垃圾公司毁我青春。然后他出去跟之前同学吃饭，也这么吐槽没想到他们是这样的，遇到一个人吐槽一次，然后就没有然后了。

小B：他感觉，这家公司虽然说基础建设差了点，但是整体业务还是不错的。所以他就不断的思考怎么去优化，结合实际手头上的业务，积极贡献，并跟自己的负责人不断讨论规划。

然后这个故事就到这里截止了，假设 小 A 和小 B 后续还在这家公司，那一年后，三年后他们的发展会是一个怎样的效果，大家可以自行脑补一下。

3. 格局

下一个点，就是格局，格局这东西说起来比较虚，但是不同格局的人，看到的东西是不一样的。还是举例子的形式来看看。

假设有一个问题，就大家在业务之中经常可能遇到的一个现象，页面加载时间长。然后不同人他们看到的东西可能就是不一样的。

对于初级同学，他可能觉得，我代码写成这样了，感觉还行也没什么办法，不知道应该做什么，然后就放哪里了表示搞不定。

对于中级同学，他可能会从前端层面分析，尝试优化资源体积，或者从体验层，加个 Loading 动画或者写个骨架图之类的。

对于高级同学，他可能会尝试从全链路去分析，比如我假设这是一个在客户端打开的前端页面，从 Webview 初始化的时间，到前端资源请求速度，接口拉取时间等各个地方去看，并推动不同角色协助优化这事。

对于进阶同学，他觉得光全链路的分析完了解决了这个问题还不够，可能还会思考为什么会有这个问题，其他业务有没有遇到。从全局来看怎么去避免他，比如说增加一些开发规范，完善数据监控等。

这里说的这个例子，也许还有更高的层次，但是刚刚说的这些大家可能也能感受到不一样的处理方式，那我们应该怎么去提升自己的格局呢？

我们经常自己调侃自己，别人问你是干嘛的，可能就会说，自己是搬砖的，所以我们这里就以搬砖为例子。大家初入职场，都是从搬砖开始。

但是对于不同的人呢，他可能会有不同的发展路线。比如有的人，刚进入的时候在搬砖，过了三年还是在搬砖，所以他还是从前的那个搬砖工。

而有的人可能在进去半年的之后就发明了推板车，可以一次性搬更多砖，后面过了一年买了台拖拉机，再过两年又搞起了楼房 3D 打印，这个时候他也可能从搬砖工到了技术总监，然后到区域经理的级别。

这个例子可能知道说明，不同的人会产生的结果不一样。我们在平时遇到问题的时候，有时候可以尝试从更高的角度去看问题，想想如果他是你，他会怎么做，都站到下一个高度去思考，慢慢的，你的格局应该就会有所提升了。

4. 软技能

第四个点，软技能。当达到一定程度之后，可能会是限制技术人员发展的一个因素了。有时候，不光光说你的代码写得多牛逼就行，可能还需要一点点，代码之外的生存指南。

简单解释一下，什么是软技能？

这里自己画了几幅画。首先，我们大家在日常生活工作中，除了面对自己的电脑写代码，还会要接触各种不同的人，去沟通协调，也要去处理各种五花八门的事情。你怎么把这些东西处理好，就是软技能的体现了。

所谓软技能，无非是几个点：

1. 处理人与人之间的关系，即沟通能力；
2. 处理任务任务之间的关系，怎么把他们串起来，即时间任务管理能力；
3. 怎么去处理人和事混杂的项目，就是组织协调能力。

具体怎么提升，市面上有很多很多的书可以学习，很多也都是道理都懂系列，具体肯定是要自己不断的实践感悟练习出来的。这里强调的一个点，软技能不容忽视，但是具体要怎么做，需要自己自行体会。

5. 可复制性

可复制性，这是一个可能听得比较少的一个词，具体的一个思想呢，就是：你能力很强，终究只是一个人能力很强，你怎么让你的能力，转移到其他人身上，甚至再从其他人转移到其他人身上。

继续举个栗子?：你可能觉得 Code Review 很重要，你每天辛辛苦苦的帮 ABC 三个同学去做 Code Review，提出各种意见思路。但是呢，如果你是一个带二十个人的 Leader，如果你每天帮每个人看半小时，加起来就是十个小时，那你一天就不用干别的事了。

这个时候，你可能要做的，不仅是停留在努力的给别人做 Code Review，而是要让你做 Code Review 的能力，复制到被你 Review 的同学的身上。对 ABC 同学，Code Review 的同时，告诉他们这事很重要，以及应该怎么去做，等到一定程度之后，可能 ABC 已经得到了你的真传，这个时候，他们也能代替你，去给 甲乙丙丁 做 Code Review，但是这样还不够。

可复制性的这件事，应该是个递归的过程。作为一个 Team Leader，你不仅自己要强，你还要能够培养其他同学变强，还要培养其他变强的同学，有培养其他的同学变强的能力。这里可能比较绕，再重复一遍：你还要培养其他变强的同学，有培养其他的同学变强的能力。

比如上述的 ABC 学会了怎么去给别人 Code Reivew，你还要思考，如何让 ABC 有能力教别人去做 Code Review 这就是所谓的可复制性，这个是在大家后期带团队的时候可能需要具备的一个能力。

6. 兴趣

上面我们罗列了五个点：方向，态度，格局，软技能，和可复制性。肯定还有很多其他的点我们需要去思考，但是呢，还有一个最最最重要的，就是兴趣。

无论说你有再强力的外部支持，比如说有很多的资源素材，在很牛逼的团队，或者你有再好的方法工具，甚至你有再高的报酬，都比不上你自己对技术的一个兴趣和热情，这才是支撑你快速成长的一个必备特性。 ** **

四、推荐的书

《软技能--代码之外的生存指南》，这是一本面向技术人员的职场书籍，对于初入职场或者有困惑的同学可以看看，它的优点是全面，你很少会在一本介绍职场的书籍里面看到对你健身的建议。缺点：涉及的话题多但是不深入，但是的确是很多道理都懂系列，自行取舍。

五、广告时间

大家有兴趣或者有问题的，可以加早早聊专场的微信群，或者说直接加个人微信(加微信 codingdreamer 邀请进 Group，直接加鳗鱼小姐姐微信)。

目前是招 T4 T5 的同学，地点在北京和上海都是处于一个正在招聘的状态。对于深圳的小伙伴可以观望观望，应该七月份就会启动了。具体介绍可见：

谢谢大家～

扫码关注公众号，订阅更多精彩内容。

给个[在看]，是对达达最大的支持！