# 一、什么是工程化
所有能降低成本，并且能提高效率的事情的总称为工程化。
对于目前（2018-12-03 23:21:22）的前端开发，需要了解以下几个内容
- 主流框架 React 、 Vue 等
- 主流构建工具 Webpack
- 版本控制工具 Git
- 自动化部署 GitLab + Ci
- Eslint + 约定代码规范
- Nodejs
- TypeScript 了解一下
# 二、一路过来
# 2.1 代码层面
jquery => react
14 年开始接触前端，刚开始就是使用 jquery + 前端三板斧（HTML+CSS+JS），上面就是干。
16 年初，后面就直接开始使用 React 了， 中间还有一些 MVC 框架， backbone，ember，angular 这些了解一点，但是没有实际的项目经验。
# 2.2 模块化层面
script 引入 =》 requireJs ,seajs => grunt => gulp => webpack, parcel
刚开始代码都是用 script 引入，然后一个项目，引入十几个 js 文件， requrejs 只有在自己的小项目里面用户， grunt 和 gulp 工作中用的就是用来处理 css预处理，图片压缩，代码压缩，雪碧图，上传七牛，svg处理，文件hash处理），后面框架优化处理，统一使用 webpack 来进行处理。
# 2.3 自动化部署
代码 SVN 管理，手动打包代码，生成到 window server 服务器，用 IIS 进行部署
前端 jquery / flex3，后端.NET
代码 SVN 管理，运维同学通过 jenkins 拉取代码，进行部署
此时已经用 react，后端 java
代码 GitLab 管理，前端使用 CI + docker + k8s 自动化打包上线
# 2.4 前后端分离的历程
有合在一起的开发经历，也有分开后的开发经历。
如果项目的页面都很简单，没有什么交互，可以合在一起开发，用模板渲染，对 SEO 有好处，项目维护也还行。
如果项目交互很多，类似后台管理系统，商品购买的流程，有比较多的交互，则前后端分离开发会舒服点。
前后端分离后，请求接口跨域问题如何解决？ 如果开发的时候分开，部署的时候合在一起
- nginx 代理
- webpack-dev-server proxy 代理
- 关闭浏览器安全沙箱
这种方式会携带 cookie，对需要携带 cookie 的友好， 简单粗暴. 仅仅使用于本地开发跨域处理 可以参考：https://www.cnblogs.com/zhongxia/p/5416024.html
- 后端 CROS
这种方式需要后端支持, 如果后面部署在一起，加这个就没有必要。