前端工程化，其实是软件工程在前端方面的应用。什么是软件工程？来看一下百度百科的定义：
软件工程是一门研究用工程化方法构建和维护有效的、实用的和高质量的软件的学科
换句话说，工程化的目的就是为了提升团队的开发效率。例如大家所熟悉的构建打包、性能优化、自动化部署等知识，都属于工程化的内容。
我写这本小书的原因，是想对过去两年的工程化实践经验和学习心得做一个总结。希望能全面地、系统地对前端工程化知识做一个总结。
小书大部分的内容都是以理论知识 + 代码示例 + 图片的方式来讲解的，努力争取让读者更容易理解。另外还有小部分的章节在讲解完理论知识后，还有相应的实践教程。例如前端监控这一节，在讲解完前端监控原理后，将会教你如何利用现有的监控工具对项目实行监控。
可能有人会问，什么时候开始做工程化？我认为在需求评审阶段就可以做工程化了，根据需求选用适当的技术栈（技术选型），然后制定相关规范...
下载或克隆项目后，在项目根目录下执行命令：
npm i
npm run dev
然后访问 http://localhost:8080
- 技术选型：如何进行技术选型？
- 统一规范：如何制订规范并利用工具保证规范被严格执行？
- 前端组件化：什么是模块化、组件化？
- 测试：如何写单元测试和 E2E（端到端） 测试？
- 构建工具：构建工具有哪些？都有哪些功能和优势？
- 自动化部署：如何利用 Jenkins、Github Actions 自动化部署项目？
- 前端监控：讲解前端监控原理及如何利用 sentry 对项目实行监控。
- 性能优化（一）：如何检测网站性能？有哪些实用的性能优化规则？
- 性能优化（二）：如何检测网站性能？有哪些实用的性能优化规则？
- 重构：为什么做重构？重构有哪些手法？
- 微服务：微服务是什么？如何搭建微服务项目？
- Severless：Severless 是什么？如何使用 Severless？
微服务、Severless 按理说不属于工程化的内容，但从提升开发效率的角度来看，也可以归纳到这一范围。
目录的顺序是以一个项目的生命周期来分配的：
- 接到新需求，进行需求评审后根据具体情况做技术选型。
- 开发前需要统一规范。
- 学会模块化、组件化，对于写代码很有好处。
- 开发完，需要对代码进行测试。
- 构建打包。
- 部署上线。
- 对项目进行监控，随时发现问题。
- 根据项目运行情况决定是否要做性能优化。
- 项目越来越复杂，需要重构以提高可维护性。
- 项目越来越大，可以考虑是否用微服务对其进行拆分（或者使用 git submodule 和 monorepo 的方式管理项目）。
- 不想自己管理服务器或数据库，可以考虑使用 Serverless。
本书的定位是入门级教程，主要对前端能接触到的工程知识做一个较全面的介绍。适合对前端工程化不了解或了解得不多的“菜鸟”同学。如果你是个“老鸟”，那本书可能不太适合你。
另外，建议读者在阅读本书时，能够配合书本的实践部分去做实践。如果读者能够严格按照指示去做实践，在阅读完本书后，不仅会收获前端工程化的理论知识，还会获得对应的实践经验。
- 对前端工程化有一个全面、清晰的了解
- 为架构师之路打下扎实的基础
- 想学习工程化的前端
- 具备基础的 HTML、CSS、JavaScript 知识
由于这本小书主要就是针对一个技术点讲解它是什么？怎么做？对于更细的点不会有深入的讲解。为了弥补这一点，我写了一些其他文章来对此做为补充：
- 前端规范
- 前端监控 SDK 的一些技术要点原理分析
- 手把手教你写一个脚手架
- 深入了解 webpack 模块加载原理
- 实现一个 webpack loader 和 webpack plugin
- 从 rollup 初版源码学习打包原理
MIT
如果你觉得本项目对你的帮助很大，可以请作者喝一杯奶茶🎁😉。
