如何在9102年，选定你的前端技术方向？

向右看齐 2022-01-11 13:55 296阅读 0赞

很多人接触前端开发这个领域是在学校中，回想那一刻的相遇，就像冥冥中的缘分，妙不可言。而这一次相遇，为你打开了一扇新的大门，尝到了其中的甜品，开始有了浓厚的兴趣，并在接下来的日子里跟随自己的兴趣去学习那些知识。

哇，多么美妙的画面，喜欢一个事物，并为之付诸努力，就好像喜欢一个人，并为之付出一样。

如果能够坚持自己感兴趣的方向，并且将当下的学习热情一直持续下去，一定会有不错的结果，然而世事多舛，总是难免会遇到一些变数，怀疑了自己，犹豫了方向，耽误了前程。

![如何在9102年，选定你的前端技术方向？][9102]

**前端的方向**

行业的发展必然带来职业的细分，在前端领域也一样，目前行业前端有下面这几个方向：界面展现用户体验和可访问性方向、偏后的js/nodejs开发方向、audio/video音视频富媒体方向、SVG/canvas/webGL动效创意表现与数据可视化方向、工具建设文档管理内部站建设的前端运维方向以及会议预定团建组织对外品牌宣传的前端运营方向。

由于每个人的性格特质，成长经历的差异，自然适合的方向也不一样。感性细腻有设计背景可以专注于用户体验，纯逻辑工程化思维浓郁则更适合偏后开发，数学物理强悍可以考虑数据可视化方向，沟通协调能力很强可以朝着前端运营方向努力。

在学生时代，大家都很纯粹，我喜欢这个就学这个，例如，很多女生很喜欢CSS，写页面，做效果。但是，等她开始找工作，还是接触真实的行业圈子的时候，事情就发生了变化。

要知道，虽然前端行业有很多细分的职位，但是这些职位的分布并不是等分的，反而是严重的不平衡。以JavaScript为技能核心的前端开发方向占据了80%以上，而剩下的四五个方向在行业的职位比例不过20%。

这就容易给身在庐山的学生和新人带来严重的误区。你想呀，刚出炉的毛头小子去外面公司面试，10家公司10个面试官问的全是Vue，ES6这些东西，很容易就带来严重的认知偏差，我不会Vue，ES6这些东西就找不到工作。于是，虽然学起来很吃力，虽然兴趣一般般，虽然CSS/ES5基础还有很多东西要学，还是把大量宝贵的时间全部用在了Vue，ES6这些事物上。

最后的结果是不伦不类，自己也搞不清楚自己想要的是什么，嘴上说喜欢用户体验，但身体全朝着偏后的开发走了。人精力总是有限的，前端现在的知识领域如海洋般宽广，若是什么都想涉猎学习，最后必然的结果是各个方面都是浅尝辄止，吸收的只是表面一层薄薄的奶酪，反而松动了基础，不利于日后的发展啊！

![如何在9102年，选定你的前端技术方向？][9102 1]

**专注**

没有哪个新人不想去腾讯，阿里还有阅文这样优秀的互联网企业，薪资高，福利好，同事优秀。如果你想去这样的企业，自己综合背景也一般，则一定一定要坚定自己的技术方向，不断打磨，持续打磨，一直打磨成一个闪闪发亮，尖锐无比的箭矢，才能突破这些大厂坚固的大门，千万不要被主流的噪音干扰。

虽然主流JS方向以外的前端职位只占据了不到20%，但是，这20%的职位可全都出自腾讯，阿里这样优秀的互联网公司啊。因为人多，不差钱，需要也有资本吸收这样一专多长的人才，以达到团队效能产出的最大化。

所以，**你前面的路有这么两条**：

一是跟着主流的声音走，可能有些不喜欢，但还是能找到份工作，虽然砖厂小了点，然后兜兜转转这样走下去。

还有一种是跟着自己的声音走，做自己的喜欢的擅长的方向，持续不断，坚持不懈，虽然过程中会有孤独，有寒冷，但其实你是走在一条别人没有走过的通往理想公司理想职位的捷径上，你要清楚，正式因为路上人少，所以才是捷径！

![如何在9102年，选定你的前端技术方向？][9102 2]

职业的路途有时候就跟这天气一样。当我们朝着一个方向努力的时候，会有刺骨的寒风，会有密集的冰雨，手中保护自己的小伞也弱不禁风，但我们只要坚持下去，突破了那个点，一瞬间，雨没了，风停了，那包裹而来的暖意会让你觉得，一切，真好！

自己是从事了五年的前端工程师，不少人私下问我，2019年前端该怎么学，方法有没有？

没错，年初我花了一个多月的时间整理出来的学习资料，希望能帮助那些想学习前端，却又不知道怎么开始学习的朋友。

> 如果你依然在编程的世界里迷茫，不知道自己的未来规划，可以加入web前端学习交流群：784783012 里面可以与大神一起交流并走出迷茫。新手可免费领取学习资料，看看前辈们是如何在编程的世界里傲然前行不停更新最新的教程和学习方法（详细的前端项目实战教学视频），有想学习web前端的，或是转行，或是大学生，还有工作中想提升自己能力的，正在学习的小伙伴欢迎加入

点击：[加入][Link 1]

转载于:https://blog.51cto.com/14227711/2366281

[9102]: /images/20220110/48a62c8d5a7d4cea8ed422d30e8b38d6.png
[9102 1]: /images/20220110/9ef5d6e2f6b64731b76b301eedfc2f25.png
[9102 2]: /images/20220110/e5a22bd66a6d478580efec79798033ac.png
[Link 1]: http://u6.gg/eUpjy