初级前端工程师如何快速成长和寻求突破

刺骨的言语ヽ痛彻心扉 2022-12-28 11:23 150阅读 0赞

# 前言 #

写这篇文章的初衷，是因为看到很多刚入职同学的迷茫、没有目标感，看到了一些工作 1-2 年的同学疲于业务开发而没有很大的成长， 也看到了一些同学 2~3 年工作时间变成了框架熟练的“打工人”，却没有很好的沉淀和亮点，导致无法进入大厂，实现薪资的大幅提升，于是写下这篇文章，希望能够给这些初中级工程师一些启发。

# 挑选适合的平台 #

## 选择大于努力 ##

如果你拿到下面两个公司的 Offer ，你会如何选择？

![7a11995a08392d0f05039fed545a4772.png][]

我相信大部分人都会选择 A 公司，因为你会认同 A 公司更有成长空间，会积累更多的沉淀，那么我们是为什么要做出这样的选择呢？

## 从哪几方面做选择 ##

1.看行业，2010 年以前的电商，这两年的教育、社区团购等。

2.看公司，公司是否是大厂、行业内的影响力怎么样、公司文化是否吻合。和一群靠谱的人工作，结果肯定不会太差。

3.看岗位，是否是职能部门，是否是职能部门主要就是看组织架构中是否有独立的前端部门。很多公司前端开发很多，但是是分散在不同部门里面，而汇报老板是后端研发。

## 从哪里获取到真实信息 ##

1.找人咨询。现在网络那么发达，多逛逛社区，很容易就能得到行业大佬联系方式，让他们给你一些建议，基本上能够给你判断的七七八八，比如社区较活跃的 Scott 等。

2.网络搜索是下策。网上提问，百度搜索，脉脉等信息繁杂也不一定客观公正，而且回答你的人不一定是和你同一工种。

## 不要在意那两千块 ##

有多个选择的时候，很多人都会说选钱多的就没错。但是职业初期一定要看重成长空间，而不能为了多那两千块钱而选择不适合你的平台。大部分人薪资涨幅最多的是 3~5 年的那段时间，前面基础打好了，有足够的积累，后面就是你挑平台的时候。这个时候的回报远远大于之前的那点钱，甚至是能够影响你职业生涯的选择。

# 融入团队 #

进入新的团队，首先要融入进去。如果你不能快速融入团队，那么必然会被淘汰出局，最严重的甚至还会浪费你至少一年时间，前期每一年都很重要（下文会说到这点）。怎么判断你有没有融入到团队呢？不是看你是不是每天和他们嬉笑喝酒打游戏，有些天生内向不爱说话难道就不能融入团队吗。而是看团队所有人的言行举止是不是一致，文化价值观是不是一致。那么怎么快速融入团队呢？

和你的团队待在一起。职场新人往往喜欢和校友或者一起进来的小伙伴同吃同行，却疏远自己的团队。所谓“相处”之道，如果不时常“处”在一起，总是游离在团队之外，就会比较难以融于到团队中。

积极主动。成熟的团队 Leader 或者师兄肯定会给你提供一些锻炼机会，一般都不会是命令式安排，而是问“这个事情有谁感兴趣”，这个时候要敢于承担，敢于发言，获得锻炼机会的同时，也会获得被直接指导的机会。不要怕给事情搞砸，干就完了。做了不一定有回报，不做永远没有收获。

做个靠谱的人。被人认为靠谱是一个很高的评价，那么怎么做才算靠谱呢？我的理解是事事有反馈，事事有结果，凡事到我为止。不属于我负责的事可以告诉对方谁谁负责，当场不确定的事可以给出明确反馈时间，并及时主动反馈和同步其他人，而不是等别人催着问你，所有自己负责的事需要有明确结果，过程需要及时同步，风险需要及时反馈到对应的人，并推动事情落地解决。

# 快速成长 #

在选择到合适平台并融入到团队之后，我们就有了快速成长的土壤，那么我们如何才能快速成长呢？我理解的成长包括两方面，技术能力的成长和职业能力的成长。

# 如何快速提升技术能力 #

坚持：积少成多，重在坚持，构建自己的知识体系。就我本人而言，现在也都能保持每天至少一篇技术文章阅读。

多写多练多思考：收藏了、看过了、点赞了不等于学到了，前面几年要多写多练，直到“看到需求，脑海中的代码就已经写完了”为止。拒绝无意义的模仿代码，要去思考为什么这么写？背后的设计方案思考？还有没有更好的方案。

谦虚并敢于质疑：要有一个谦虚的态度，高高在上，如果抱有“老子最牛 X 的态度”，很快就会被团队拍死。要善于发现别人的优点和长处。谦虚不代表不发声，讨论阶段要敢于去挑战别人，有想法要敢于表达，别人考虑的不完善要敢于质疑，事前多发声，对事不对人，事后不瞎哔哔。

把事做精：要养成优秀的习惯，每个任务不要因为做完就沾沾自喜，做完是基本要求，是你拿工资该做的事，做好做精是你成长的体现，当优秀成为一种习惯，成长就会很快。

敢于实践：有些技术文章看完了不等于会了，有好的最佳实践和技术方案要敢于用到项目中，被业务验证过的方案才是好的好方案，同时也能让你快速掌握这些相关技术。当然在实施之前好的做法是先分享并组内讨论下。

适当高调：这个是最简单也是最难的。太多的程序员有个好的 idea 不敢说，或者只和个别人说，做了一个好工具好插件只给自己用或者只给身边的几个人安利。适当的场合要敢于表达自己看到的问题并给出建议，好的工具需要积极地宣传推广到大团队、或者整个研发团队。适当的高调可以让更多人看到你，后面有相关机会别人也会第一时间找到你。对于一个工具来说，当使用的人更多的时候，就会有更多的问题暴露出来，会更加提高你解决复杂问题的能力。当积极主动优秀成为你的标签之后，会给你带来更多的成就感、自信心、动力、挑战和机会。

# 如何快速提升职业能力 #

什么是职业能力？职业能力是人们从事其职业的综合能力，对于研发开发来说，通常指除技术能力之外的综合能力。我认为，职场中比较重要的职业能力包括：沟通能力、业务能力、协作能力、反馈能力、规划能力、总结能力。

这些能力如何提升没有标准答案，天赋不同、性格不同，提升的方式也不同，我这里总结一些个人经验供大家参考。

## 沟通能力 ##

语言一致性：面对不同工种比如测试、后端、产品和业务方首先要语言一致，你的语言表达要使对方能听懂，如果你一直说专业词汇，别人是听不懂的，要将专业词汇转化成别人能听懂的语言。你和老板说 Vue/React 的数据驱动他们大概率听不懂，但是如果你和老板说 Vue/React 是业界主流开发选型，能够比传统开发提升 XX% 的效率，节省多少人力，效果就会不一样。

理解一致性：如果你在说 A，对方听成了 B，你以为对方也在说 A，那么永远只有“沟”而不会“通”，甚至不欢而散。我碰到过多次这种沟通半天不能达成一致、最后来找我协调的事情，最后发现两个人不在一个频道上，最终造成了无效沟通。遇到这种情况，我一般都是先听完，然后给我的理解，同时给对方复述一次，问对方我理解的是不是对的，而不是急于表达我的观点。

多动手少说话：语言在传达过程中会很容易被错误理解，比如我描述一个人的长相，一千个人会画出一千个样子，如果我拿出一张照片，就能够准确的进行信息传递。沟通过程中多画图、多演示、多用白板，能够提高沟通效率。还有就是说的过程中，要说重点，先说结论、再解释。因为也许有些人不 care 解释，只需要你给结论即可。当有太多的解释而没有引出结论时，可能会被认为很啰嗦、说不到重点。

## 业务能力 ##

给自己当“傻子”：一个好的产品是应该学习成本比较低的。给自己当“傻子”，去使用自己负责的业务产品，就会发现太多可优化的点。

多换位思考：不要用技术的角度去看业务，要思考产品的用户是谁，核心是解决用户什么问题，有没有解决，反馈如何。

用公司视角：你负责的业务上下游依赖业务是哪些？在部门中处于什么角色？在公司层面处于什么地位？站在不同视角看待业务就会获得不同的看法。

关注行业竞品：行业趋势是什么样的，竞品的优势在哪里，我们的优势在哪，对行业要保持一定的敏感性。

## 协作能力 ##

找到共同目标：通过良好的沟通能力，寻找到共同目标。放大共同价值会很容易达成合作。

多换位思考：多站在别人的角度考虑问题，多问问对方你的难点是什么、需要我如何协助，了解诉求之后，再针对性地提出解决办法。不是上来就说“我要做什么”，而是多说“我可以给你带来什么”。

## 反馈能力 ##

提高意识：事事有反馈是非常非常非常重要的意识。想象一下这些场景： 1.你负责的开发任务，如果需要负责人每天都问你一次到什么进展了，有没有做完，不问你也不说；2.群里有人反馈你负责的页面出了问题，而你已读未回——其实你可能已经在排查了，或者有更要有的事去处理，但是你没有回，别人就会觉得你不负责任，甚至认为整个团队没有 Owner 意识。

这两种状态都是很不好的，如果我们能够主动汇报事情的进度、如果忙碌的时候能够回一个 “在看”、“开会中，5 分钟后看”，效果就会不一样。

## 规划能力 ##

定目标：没有目标就没有坚持的动力，做之前要先定好目标。目标可以有长期目标，中期目标和短期目标，可以按照自己的规划设定。

定周期：所有的目标都要有明确的时间节点，没有时间节点，很难进展下去。

做拆解：目标拆解的粒度越细，执行的效果就会越好，我们可以一直拆解到不能拆解为止。

## 总结能力 ##

多练：很多开发人员会做不会说，会说不会写。我的经验就是多练，练的多了就会有感觉。我本人上学那会儿，作文都写不到 600 字，现在一口气写上几千字停不下来。平时多写业务文档，技术文章总结，也能锻炼你的总结能力。

逼自己：总结不是记流水账，要化繁为简，很多人会说不能再精简了。我的经验就是逼自己做下去，比如 5 分钟总结一下上半年的工作亮点、只选择一件事你认为是最需要给老板说的、总结字数不超过 100 字等，慢慢就会清楚如何做总结。

# 如何寻求突破 #

技术能力的持续提升、职业能力越来越强，那么我们怎么才能突破到下一阶段呢？

## 技术反哺业务 ##

从场景找方案：技术能力一定要能反哺业务，才能体现技术的价值，学到的新技术新知识如果不能运用到项目中，那么永远就只是个 Demo 样品。所以不要为技术寻找场景，而是应该从场景中找解决方案（技术方案）。

聪明的“偷懒”：可以试着问自己：如何既能少干活又能满足业务场景？这就需要你在理解业务的前提下，提出更合理的技术方案。将技术合理的运用到业务中，既能提高自己的技术设计能力，又能更好的支撑业务发展。当然，这里的“少干活”不一定是说这次少干活，而是长远的角度去考虑如何扩展节省人力。

## 寻找机会并快速落地 ##

有些人一直抱怨自己怀才不遇，做的事情没有空间没有机会，好的机会都被别人霸占着插不上手。其实不是机会少，而是你缺少发现机会的眼睛。

找难受点：让人难受都是机会，多留意别人的抱怨，多留意你觉得很烂的地方，多问协作方他们哪里难受，只要是难受的点就是机会。比如：团队脚手架工具好不好用、有没有监控系统、有没有需要所有人肉去升级或者排查的事情、测试是不是需要自动化工具、产品需不需要业务报表系统、运维是不是需要部署管理系统。留意身边的不满，碰到不满不要总是躲避，而是留意是不是有机会来了。

## 如何判断你成长了 ##

如何判断自己是否成长了呢？是开发了多少组件、实现了多少页面、发了多少版本、加了多少天的班吗？

我的逻辑是看看你改变了什么。比如——因为你协助更顺畅了，因为你线上故障少了 50%，因为你开发效率提高了 30%，因为你团队氛围更好了，因为你身边人也成长了。你带来了哪些改变，自然就在某些方面获得了成长。

# 常见误区 #

一年一跳：很多人频繁跳槽，到哪都觉得自己“怀才不遇”，而经常跳槽会导致新的用人单位也觉得你稳定性差、在我这里是不是也最多待一年？一年一跳能够沉淀积累的可能性也不大。所以要慎重选择你的平台，清楚自己要什么，不要为了一时多两三千块钱而冲动。

把业务成果当成自己成果：这个是最常见的误区。业务 KPI 年年达成、年年是明星业务，却误认为是自己的成果，造成自己年年成长的错觉。试着问下自己：你在里面起到的作用是什么？如果只是把交互实现，是不是可以认为你这两年一直在机械性的做执行。还是要回到上面说的，问下自己改变了什么。

依赖平台：有些人离开了平台就搞不定事情，要做与平台无关的人。在不同阶段可以自由选择大厂或者中小厂，可以选择纵向发展，也可以选择横向操盘空间。

# 总结 #

成长就像爬山一样，一开始大家都在同一起跑线，有说有笑并肩出发，过程中有人坚持下来到达了山顶，有人停在了半山腰看着别人陆陆续续超过自己，有人选择了错误道路、永远到不了山顶，有人选择了适合的道路、很快就到达了山顶……成长的过程中肯定存在很多坎坷，但是每一次突破自身所带来的的成就感会成为你坚持下去的动力。坚持加上选择再需要一点运气，回报自然就会水到渠成。

加油吧，打工人！

# 最后 #

说个题外话，我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。

我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在IT学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。

我可以将最近整理的前端面试题免费分享出来，其中包含**HTML、CSS、JavaScript、服务端与网络、Vue、浏览器、数据结构与算法**等等，还在持续整理更新中，希望大家都能找到心仪的工作。

### 有需要的朋友[**点击这里免费领取题目+解析PDF。**][PDF] ###

**篇幅有限，仅展示部分截图：**

![2f92c1b128ca1264e599ce539eb59dca.png][]

![1b5b633d05e5041185bf9ab695629696.png][]

![29569a9d684a8f72aad2d8cc905ed3c3.png][]

## [**点击这里免费领取题目+解析PDF。**][PDF] ##

[7a11995a08392d0f05039fed545a4772.png]: /images/20221120/5c566c2132e84614a5a9fd5ce521e776.png
[PDF]: https://links.jianshu.com/go?to=https%3A%2F%2Fjq.qq.com%2F%3F_wv%3D1027%26k%3DhCLQP3CQ
[2f92c1b128ca1264e599ce539eb59dca.png]: /images/20221120/5b09964e8d7345028b66f5ff08614703.png
[1b5b633d05e5041185bf9ab695629696.png]: /images/20221120/ce687956c2664cbc8f2314a8d80d48eb.png
[29569a9d684a8f72aad2d8cc905ed3c3.png]: /images/20221120/2953bdf46d8f45969a46a36a5b76b4a0.png