前端软件开发体系

前端软件开发体系

程序员知识框架

前端工程师的技能模型分成三层，最底层的是三大能力「编程能力」、「架构能力」、「工程能力」，第二层是「前端知识」，最上面的则是「领域知识」。

 

 

 知识框架同样也是分为 3 层，最底层应该是「基础知识」，第二层是「工程知识」，最顶层则是「领域知识」。

 

 

 基础知识

程序员最首要的应该是会写程序，比如设计一个控制家庭 IoT 的程序，或者写一个简单网页，处理一些业务的日志。想要做好这些事情就需要对应的基础知识，这些知识是作为工程师都应该具备的。

前端知识

首当其冲的就是学习各种编程语言，对于前端程序员来说这部分是前端独有的领域知识，比如，我们是用 JS 写代码，界面描述用的是 HTML，样式用的是 CSS，还有还原设计稿的能力（这个是后端程序员跨领域最大的难题）等等。

编程能力

掌握了前端知识之后，这时候能写一些简单的程序，但是还写不了几万行的大程序，比如，写一个能够工作的人脸识别程序，因为涉及的方面太多，光会写程序的人是 hold 不住的。要想做到这一点，就需要理解搭建计算机软件的模块 —— 数据结构和算法。可以把数据结构理解为盖房子的钢筋、门窗和大梁，把算法理解为盖房子的结构原理。没有这些很难从沙石盖成一个大厦。

这部分叫做编程能力，编程能力其实就是解决难问题的能力，一个比较难的算法题能不能写出来。当然也不是特指写算法题，应该是综合了算法、数据结构、基本的编程能力等等。

编程能力可以通过刻意练习获得，比如刷 leetcode、参加 ACM 竞赛等。

计算机基础知识

有了前端知识和较好的编程能力之后，应该能用一些半成品很快盖出一座房子。可能又会遇到一些问题。即便在设计软件时可以不受资源的限制，但是世界上任何一台真实的计算机都是资源有限的。

如果想写一个效率高的程序，就需要了解计算机能够提供多少资源，程序在计算机系统结构这个框架内，应该怎么优化。

这时候就需要学习计算机的原理、计算机的系统结构、计算机网络、操作系统（对于前端来说是浏览器）、编译原理等等。

当然这一部分的知识可以对于大部分程序员来说没有那么紧急，并且都是较为难啃的骨头，可以边工作边补齐。

工程知识

工程知识就是解决人多的问题的能力，在软件工程提出来之前都是用人力的手段进行管理（比如，代码的行数、统计 bug 数）。

工程知识基本上只能选择对应的公司，在具体的项目上学习。比如，淘宝前端的架构不复杂，但是工程问题非常复杂。

组件化

组件化的概念可能对于前端开发、Android 开发这种写 UI 页面的程序员更加熟悉，其实就是对于 UI 页面上各种元素的抽象，最主要是为了解决代码复用的问题。比如，可以直接使用业内各种著名的 UI 库 Ant Design、Elements、iView 等等，而不是再去开发一遍。

对于其他领域可能更加熟悉的概念是模块化，虽然可能名词不一样，但是都是计算机领域的核心 —— 解决代码复用的问题。复用前人的经验，利用搭积木的方式才能在几十年内让计算机发展到今天这个地步。

工具链

对于一个工程来说其实也是有对应的生命周期的，可以分为初始化、开发/调试、测试、发布 4 个阶段。

这 4 个阶段是我们前面学到的知识还不够用，但是也能肯定有对应的解决方案。对于前端来说有各种工具，比如 webpack、babel、create-react-app、vue-cli、npm 等等。

大部分的需求可能直接使用对应的工具就能解决了，因此熟悉各种工具的用法是至关重要的。但是总有些需求是现成工具不能满足的，要学会开发自己的工具。当然这些工具还是在计算机软件的范畴内，所以前面学习的基础知识都是通用的。

持续集成

持续集成是近现代软件工程中的一个非常重要的概念。在软件开发过程中，以定期或者实时的方式，集成所有人的工作成果，做统一的构建和测试。

性能

由于计算机的资源是有限的，因此运行的计算机之上的应用程序能够使用的资源也是有限的。只有提供性能更好的软件才能获得用户的青睐。

当然不同的领域对于性能的要求不一样。对于前端可能更多的是看首屏加载时间，而对于后端来说可能是数据的吞吐量、并发数等等。

安全

随着今各种用户信息、用户数据数字化，安全问题也是非常重要的，不仅涉及用户的隐私，还可能涉及企业的商业机密。

领域知识

比如，做电商的、做硬件的都有自己独特的领域知识。

学习领域知识的地方：1. 公司，2. QCon 每年都有优秀的讲师分享他的领域知识。

领域知识基本上需要在实践中学习。

架构能力

架构能力就是解决大问题的能力，包含了对复杂系统进行分析、软件设计、管理多个程序员之间的协同。因为这部分的能力要涉及的知识非常庞杂，需要熟悉各种系统、各种框架，同时还需要对需求有非常深刻的见解，才可能在技术选型时做到最合适。

架构能力应该是对前面所有知识的融会贯通。可以通过读源代码、参与开源项目，学习前人的思想来提高。

学习源代码的方法，先参与项目，读一读 issue，解决一些实际问题，在解决问题的期间读一部分源代码。

学习方法

了解了整个程序员的知识框架，非常庞大，想要学好就需要一定的方式方法。最主要是根据一定关系整理出来一个具有「完备性」的知识脉络，后面碰到不会的知识，能够迅速定位这个知识再学习就事半功倍了。

顺序关系

每一个子节点是父节点的一个步骤，并且子节点之间具有明显的先后关系，顺序不能打乱。比如：

 

组合关系

父节点在描述一个事物，子节点在描述事物的各个属性，父节点由子节点组合而成。比如：

维度关系

从不同角度去看待一个东西，比如，可以从文法、语义、运行时的角度去描述 JavaScript。

 

分类关系

子类是父类的一个子集，比如：

 

 

 追溯法

现在网上的资料非常多，可能有些还是互相冲突的，那么就要使用追溯法去找到这个知识最开始的出处，从源头弄清楚这个知识。

可以根据下面这些线索去查找：