我的前端学习路线


为什么要学习前端

前端开发,开发的到底是什么呢?严格来说是运行于浏览器(或者与 Native 结合的混合式架构)之上的图形化交互页面(GUI)。可以是一个网站,也可以是一个单页面应用(如 Worlde),基于 WegGL 还能做出很炫酷的效果,或者接近 Native 的体验(如 Figma),借助跨平台框架(如 React NativeElectron, Tarui)能够让前端页面与 Native 深度结合。

所以前端开发有较多的落地场景,相比其他的编程类别,前端开发更贴近用户,门槛也相对低一些(仅仅是门槛,要做到出类拔萃难度还是挺高的),这让那些对创作有热情,但计算机基础又不是那么牢固的人(比如我)可以有一个不错的创作空间。除此之外以下几点也是选择前端开发的重要原因:

开发体验佳

得益于 IDE、包管理工具、浏览器及其他开发工具的持续迭代和优化,前端的开发体验已越发舒适。比如 vite 让代码改动(即使代码量很大)能实时反映在浏览器(这不仅能提高开发效率,对于保持心流状态也很重要),VS Code 良好的代码编写体验和丰富的插件,pnpmnode_modules (如包的平行罗列,文件夹 size 大等)的改善,Chrome 在性能和调试能力上的不断优化和改进,TypeScript 也降低了编写易维护代码的门槛。

天然跨平台

只要一个 URL,就能在不同的设备访问,而且保持相同的体验,这个感觉太棒了。

上线快且不会被卡

如果是移动端 App,不可避免地要与审核人员打交道,被打回也是常事。如果线上出了问题,iOS 平台只能重新发版走审核流程,前端则没有这个问题。

发展蓬勃

经常会看到有人吐槽前端开发变化太快了,一个工具还没玩明白,新的工具又出来了。我觉得这是好事,说明有活力又尚未完全成熟,这不就是进入这个行业的好时机么?

故障影响小

当然这是相对的,前端也可以出现很严重的故障,只是相比后端,跟用户的数据打交道,前端犯错的可容忍性和可恢复性会高一些。我甚至觉得同是编程,前端和后端是两种类型的人,前者更 Creative,后者则更需要考虑细致和沉稳。

我的前端学习路线

前端涉及到的内容会很多,如果没有 Roadmap 很容易迷失(尤其是对刚入门的新手),以下是我整理的一张表格,作为自己的 Roadmap。

划分为 7 大板块:

  • Computer Science (基础,无论从事哪类编程都要了解)
  • Software Engineering(软件工程,也属于基础,但更贴近实战)
  • Nice to Have(Optional,如果掌握这些技能可以加分)
  • Frontend Tooling(前端的工具集)
  • Framework & Libraries(前端相关的开发框架和类库)
  • Web Related(Web 相关的知识点)
  • Toolkit(开发环境相关)

然后根据 Know in General(知道大概原理),Familiarity with Usage(熟练使用)和 Know in Detail(了解实现细节)来设置每一块的学习目标,比如对于 Computer Science 来说,知道大概原理即可,不需要牢记细节。而对于日常会使用的 Framework 和 Library 则需要深入了解实现,甚至能手动写一个。

每个板块里的内容,会按照我自己的喜好来学习,比如包管理工具我更喜欢 pnpm,Computer Science 里学习操作系统相关的内容会选择 OSTEP 这本书等等。

有了这张图,学习起来会更有底:自己目前大概到了哪个阶段,哪块需要重点补强一下,优先学习哪个(感觉跟「皇室战争」升级建筑一样一样的 😂)。