本来没打算这么快写这篇文章的，原本已经做好 “这个系列应该就只有我自己看” 的准备了，不过没想到写完上篇后还有人催更，谢谢大家支持🙏 那就加快这一篇的写作进度～ 没看过上篇的同学可以点 👉这里。

• 原本打算上下两篇就写完这个系列的，但是实际写的过程中发现如果揉在一块，篇幅会十分长😅，所以还是决定拆成 3 篇。
• 这篇文章主要是写给刚毕业，或者刚转行入坑前端的同学，总结了一些经验和学习心得，也算是以自身经历为例子的职业入坑指引吧。
• 由于想写的东西比较多，因此分为上中下三篇。上篇主要介绍当前及未来前端发展的趋势以及高效团队协作的开发配置；中篇主要是职业规划和选厂建议。下篇专门讲讲怎么从零开始搭一个前端项目。
• 文章中涉及到的技术栈和框架不会太深入去讲，主要是介绍一个职业规划和个人成长规划。对文章中某个点感兴趣的同学可以私我。

持续成长

这里说的持续成长，主要指的是技术和专业能力上的成长。我个人的看法就是：无论每行每业，都是需要知识壁垒去支撑的，否则是很难在这个行业或者领域有所建树，甚至很难进步。哪怕是做个微商，做个流量网红，没有营销基础，没有运营知识作支撑，不去规划 ROI，听风就是雨，那也只能算是一颗巨大的移动韭菜而已。更别说理工科这种 会就是会，不会就是不会 的行业了。所以在我看来不断去提高自己的知识壁垒是一件很有必要的事情。无论你是什么年龄，有多少经验，从事什么行业。

而关于前端人的持续成长，我想起大学听一场鹅厂宣讲会的时候，主讲人讲的一句话：

程序员的核心就是一个字：懒

这个 懒 并不是指偷懒，而是码农自骨子里就应该有一种 “把重复的事情交给机器去做” 的魄力。我当时是大三，虽然还不到校招的时候，但我是因为这句话决定入坑前端的。前几天听某大厂一个技术大牛分享的时候，他也说了类似的话。大概总结起来就是：

• 对具象问题抽象化，尽可能复用逻辑
• 重复功能自动化，提高效率减少人为失误
• 架构设计模块化，易于变更与扩展

回过头看自己的码农历程，这三点在我入坑之后感受越来越深。最开始写代码只专注于具体业务的功能实现，跑通即成功；然后会尝试封装代码封装组件，实现“懒”的第一步复用代码；后来慢慢会利用一些脚手架和工程化，能提高一些效率也能减少一些人为失误，实现“懒”的第二步自动化；再后来会开始考虑是否方便后期维护扩展，是否方便其他同事接入开发，又是否需要动态加载多套配置等等，实现“懒”的第三步易于扩展。

学什么

学什么，这几乎是所有入坑的小伙伴最困惑的一个问题，包括我自己在内。这几年前端的发展是十分迅速的，但这同时也意味着前端的知识生态和技能栈非常混乱。这和后端相对稳定的生态不同，前端的学习如果没有选对方向，或者没有一些决心，是很容易被各种五花八门的新兴框架带蹦心态的。

继上篇所述，首先心态要摆平。前端（我指的是入门）说简单不简单，说难也不太难。它既没有网上水军说的那么容易，也没有一些所谓“大神”说的这么高大上牛逼。我建议的选择路径是这样的：

• 首先把基础打扎实
  • HTML + CSS + JS 这三剑客的基础必须啃下来。HTML 至少要熟练掌握 DOM 和 BOM 相关的 API；CSS 至少要熟练常见的布局方式以及合成层的概念；JS 把红宝书（或者同类书籍）啃一遍。
  • 不要忽视计算机基础。计算机网络相关知识（尤其是 http 相关），基础数据结构（不说手写，但至少要知道几种不同结构的概念和用处），简单的操作系统知识（比如线程进程的概念还有 Linux 常用的命令）。
• 接着熟练掌握一个前端应用框架以及发布应用的全链路
  • Angular，React，Vue 找一个啃下来。不单止会应用，还要把原理和源码啃了。国内环境的话，个人建议 React 或者 Vue。当然他们的全家桶配套生态也是要掌握的。
  • 了解工程化的基本应用以及应用发布的全链路流程。至少要知道诸如 Webpack 之类的构建工具是干嘛用的，打包完之后又是怎么上线的。
  • 当你有一定的前端实践经验之后，可以开始熟悉上下游生态了，没错我指的就是 node。开始了解简单的后端知识，比如 RESTful 的服务器，比如一些数据库的操作。此外 Typescript 也是一个很有必要学的知识点。
• 最后找一个感兴趣的垂直领域深入学习。其实这个板块发散面就很广了，我推荐几个方向，但最终还是取决于你的兴趣爱好
  • 深挖前端性能优化，大多数情况下指的是网络交互和终端渲染能力。比如去了解一下 V8 的原理；比如了解 OSI 七层和 TCP/IP 四层网络协议模型的区别和各层的应用方向；又比如一些 JS runtime 和一些渲染层的通信等等。
  • 架构思路与框架设计能力的提升。比如熟悉各种设计模式，比如对函数封装的认知，比如各类打包工具之间的性能差异和原理。
  • 跨端开发与渲染。大家有没有发现市场对 native 工程师的需求已经越来越少了，甚至许多大团队将整个应用交给大前端来做统一开发。无论是经典的 RN，Weex，还是性能更好的 Flutter，还是桌面端的 Electron 或者轻量级的小程序，都是跨端的一种形式。
  • 进军全栈领域。从 node 开始，逐步熟悉整个全栈研发链路。当然了所谓全栈并不是有些人想的这么简单，不是说会写一个接口就完事了。而是要熟悉大量的数据库操作和优化，要知道怎么捕获错误和统计日志，要知道怎么做好安全和鉴权，甚至涉及网关和接口下发等等。

上述的几个阶段之间的关系，是逐步递进并且后一阶段是对前一阶段的巩固。比如第二阶段你读框架源码的时候，必定会对 JS 会有更深层次的理解。又比如第三阶段当你去研究 node 的时候必定对 Webpack 构建的一些 api 又有更深入的认知。

如果是计算机系的同学，你肯定会发现基础部分其实大多是大学的内容。为什么要学计算机基础，我曾经也觉得这东西这么概念性，对应用没多少帮助。其实越到后面越发现基础的重要性。就举个例子，项目访问慢，领导让你优化。如果你有系统的学习过计算机网络相关的知识，你脑子很自然就会从 DNS 解析，到 TCP 握手到，到 TLS 认证等各个流程去考虑。而如果你没有这方面的概念，一时间你就会陷入懵逼然后去谷歌，可能还不知道怎么搜关键词。😂 此外工作一段时间之后假如你跨领域做后端或者 native 开发，你会发现跨领域之后只剩下计算机基础和架构思维是有用的。

关于一些新兴的冷门应用框架，我是不建议主修的。或许有的人就是觉得冷门的酷，但我的建议是当熟练掌握一门找饭吃的热门框架的时候，再去触及学习其他框架的优势。不然你也只是停留在应用层而已，你也不知道别人为什么要这么设计。而单纯从应用层面出发，冷门框架又不好找工作。

不要纠结于框架应用层面的学习，不需要面面俱到。有些同学老纠结 我到底是学 React 呢，还是 Vue 呢？ 其实应用层很多东西是触类旁通的。你把一个框架吃透了，换一个你也能很快上手。至于停留在应用层其实对自身能力的提升没有多大帮助。意思就是你 学会用 Vue 写个 TodoList 然后又转头去学 React 写个 TodoList 其实是没什么卵用的，相对于此，你更需要关心的是 Vue 的设计理念和核心 API 的原理，对比 React 有什么优劣势。

下面是我推荐一些书。有更多好书推荐也可以在评论留言或者私发我～最近也想看一些高质量的书～

HTML 不作推荐，个人觉得直接看 MDN 或者随便买一本热销的 HTML 的书就足够了。框架级的书也不推荐，我觉得官网就挺好。

书名	知识领域	说明
CSS 世界	CSS	前端基础，张鑫旭老师写的非常好
CSS 揭秘	CSS	有一些常见的应用案例
Javascript 高级程序设计	JS	买最新版，俗称红宝书，前端必备
Javascript 忍者秘籍	JS	jQuery 作者出品，能让你对 js 的理解上一个层次，比如我至今还记得书中对闭包和词法环境生动形象的介绍。
你不知道的 JavaScript	JS	有上中下 3 册，我觉得都不错，当作知识补充
学习 JavaScript 数据结构与算法	计算机基础	数据结构基础，算法知识入门
图解 http	计算机基础	http 入门，有时间的同学我更推荐计算机网络，就是你上大学那本砖头
狼书	node	全系列，写的非常好的书

最后再列一下知识体系

	前端技术深度	生态技术广度
应用层	前端基础，性能优化，typescript，node	Linux 基础，数据结构，docker，数据库
原理层	深入精读一个框架源码，v8，深入js	计算机网络，工程化（代码健壮性），算法

怎么学

首先给大家看一个图：

应该有不少小伙伴是看过这玩意的，也就是 devops。这里不是想细说这东西，而是想说整个学习的思路，我觉得就围绕这个图就好了。当你没思路的时候，看看这个图，哪个环节薄弱的，就去找相关学习资料搞起。简单介绍一下：

• Dev 即 development，对应开发流程
  • plan 就是计划阶段，包括产品方案，思路产出
  • code 是开发阶段，怎么去实现你的产品。在这个阶段学习应用层的框架
  • build 是构建阶段，在这个阶段学习打包构建，环境区分，配置文件等
  • test 是测试阶段，可以学习单元测试，端对端测试等
• Ops 即 operations，对应上线后的运营阶段
  • release 就是发布，可以学习 ci / cd 等持续集成的知识，比如怎么更自动化的推包等
  • deploy 就是部署，涉及到部分运维知识，比如 nginx 怎么配，安全证书怎么配
  • operate 就是上线后怎么运营
  • monitor 指的是监控，怎么捕获线上的信息，用户行为埋点，错误日志监控等等，给开发者一个反馈

根据这张图，应该就慢慢会形成一个知识网络体系。这是很关键的。你可以不懂某个技术，但是如果你脑海中没有一点方向的话，意味着你甚至没有机会去学习它。因为你压根就不会想到去学它。

整个研发生涯中，最可怕的是什么？我认为最可怕的不是不懂，而是没有意识到自己不懂，然后也不知道如何去收集信息和搜索资料。有的时候会听到一些同学自嘲：面向谷歌开发，cv工程师。但有没想过一个很可怕的问题，那就是你不知道怎么去搜。这也是为什么越来越多的面试官会问：“你怎么学习新技术”的原因，也是为什么喜欢考算法的原因之一。

如果你对整个研发体系没有一个抽象的认知，给你谷歌你搜啥呢？举个🌰，比如现在开发完你不知道怎么上线。如果你没有任何想法，你可能是搜 “前端如何上线”。不用看搜索结果也能猜到答案肯定很不靠谱。而对研发知识体系有一定认知的同学可能会搜 “nginx 反向代理”，这就相当有针对性了，效率也高很多。

算法也是类似的道理。举个🌰，如果你在开发过程中遇到某个 API 不会用，直接搜这个 API 文档就好了。但如果你现在要做一个多层级的树状侧边栏，要把数组组合成树，这就不好搜了。

最后给大家几个学习建议：

1. 重视基础，除了前端知识之外，抽空把计算机基础补了，最好数学也补了
2. 敢于看源码，耐心慢慢看，别觉得很难或者枯燥就放弃了
3. 多逛论坛，这对知识体系的积累有很大帮助
4. 尝试写博客，目的不是为了公开，而是养成记录的好习惯。比如我写的记录有上百篇，但是基本都不公开。一旦开发过程中遇到问题或者想要跳槽，就很方便定位和复习。
5. 尝试开源，当然这得有一定能力之后。比如写一个简单的插件。比如我写 nuxt 的时候发现 markdown 渲染有点问题，干脆就自己写了个 markdown 流程图渲染的插件。
6. 买一个服务器，自己设计一款应用，遵循上面的 devops，从设计到研发，从构建到部署，从运维到监控全链路走通，这能极大提升自己对研发链路的理解。

职业规划与选厂

首先问清楚自己：你是想走科研路线还是走企业应用路线。

科研路线其实没啥捷径的，老老实实读研读博。你需要的是更多的研究资源和平台资源，给行业应用做一些理论支撑。

我想大部分人和我一样，还是想走企业应用路线的。关于这部分的职业规划，我给自己的目标是这样的：

• 先把前端基础学好，能独立完成前端方面的工作
• 然后熟悉整个研发链路流程，也就是上面说的 devops 的流程
• 提高自己的抽象能力，注重团队协作与框架搭建（其实我觉得到这一阶段的话，已经有点架构师那味了，当然我自己距离这一阶段还是有很大差距的）

关于选厂

如果算上实习，我自己呆过 4 个公司。大三还是愣头青的时候，去的小作坊一心想着能积累经验。大四正式实习（也算是校招），去了一个国企。然后发现国企的养鱼悠哉悠哉的风格自己实在是喜欢不起来，就去了一家蚂蚁投资的 D 轮互联网公司。工作满一年后发现已经满足不了自己的成长规划了，就跳槽去了一家大厂一直到现在。

从我自己的经历来说，我呆过小作坊，呆过中型创业公司，呆过国企，呆过大厂，我觉得还是有点感触的，分享给大家。

• 首先绝对不要去系列：小作坊。啥叫小作坊呢，就是三五个人，十来个人，注册了一个公司，然后随便招一些人。这种对自身成长几乎是 0 帮助的。一开始我还想，没关系呀我去积累经验。其实在那根本就是浪费时间。先不说能不能学到东西，搞不好还会成为你发展路上的绊脚石。

极度不规范的开发环境，对一个啥都不知道的新人来说，很容易让新人养成错误的开发习惯，甚至一些奇葩的开发观念。然后没有任何的新人培训计划，你懵逼，组内研发也懵逼。你不知道要学什么，正式员工不知道要教什么。到头来自己都不知道发生了什么事就实习结束了。

• 根据自己情况选择系列：中型创业公司，国企，大型传统企业。其实大部分同学还是在这个区间内的。当然我自己不是什么超一流名校，也没什么超牛逼的企业过来校招，我也不太清楚特别牛逼的学校是什么样的就业情况。对于这些公司，要看自己的性格和喜好做选择，并没有哪类就一定比哪类好这一说。

如果你是个特老实的，安于现状也不太想和别人比什么的性格，去国企或者是大型传统企业都是不错的选择。国企的工作方式和职业发展给我的感觉是十分平稳的，简单来说就是你什么资历就做什么资历的事情。不过我不太喜欢这样的工作方式，很无聊沉闷不说，自己也要做很多很奇葩的东西。比如疯狂叫你去盖章之类的。也有联通的同学说必须先去发手机卡...银行的同学说必须先坐柜台...格力的同学说必须下车间体验。总之就是很多莫名其妙的东西。

如果你是比较喜欢接触新鲜事物，比较喜欢充满活力的工作环境，那就去中大型互联网创业公司。这类公司虽没有大厂这么庞大的体系，也没有大厂这么完善的新人培训，但是至少是有一套比较规范的开发流程，同事之间的相处一般也比较有活力。

• 拿到 offer 就去系列：互联网大厂。大厂有完善的新人培训课程，业内领先的技术支撑，完全不需要担心的薪资福利体系。

先说大家最关心的福利，大厂的薪资是没得说的，除了薪资之外还有很多隐形的福利，比如包三餐，比如各种下午茶，比如比较丰富的团建，比如住房补贴等等，综合起来无形间多了三五千工资。然后对自身成长也是很不错的，你能接触到业内比较完善的开发和发布体验，一般大厂内有很多分享会和内部课程，报名上课也能学习到很多不同的知识。

最后说说简历。亲身经历，千万千万不要把只懂一点皮毛的东西写上去。如果你面小公司小作坊，反正大家都不懂嘛可能还能成为加分项。但是大厂就不是了。只要你简历上有的东西，都能把你问出 💩 来。千万别以为自己看过一些知识或者稍微了解一点，就往简历上怼，到时候问到你尴尬。另外不要轻易写全栈，除非你真的十分精通。一样的你要是只会写一两个 API 就写全栈的话，直接问到你怀疑人生。

下篇预告

原本是计划写两篇就完结这个系列的，但是实际写的时候发现篇幅太长了，于是打算把 搭建前端项目 相关的内容单独做一期。在下篇中我会讲讲如何从零开始搭建一个前端项目。

2020.10.18