引言
- 凡是建设，必有数据：说明趋势、直观化、反馈准确；
- 从场景出发找方案：问题就是机会，问题就是张萝卜的坑；
- 不设限，拓展能力边界：前端可以不只是前端开发；
- 业务的阶段匹配性：不要过度设计；
- 技术的价值体现在于解决业务问题：人的身价，在于解决问题的能力。
系统架构图
基建
提效、体验、稳定性，并帮助业务更好的活在未来。
前端闭环
流程
阻塞点越少，研发效率就越高。
归类和建设
基建建设
前端理想化资产
1. 规范&文档
开发标准，意在严格执行达到团队行为的一致性。特点：
- 是团队的共识、集体的审美、沟通协作的基础；
- 文档内容的有效性，直观输出。
2. 本地工程化环境
工程化套件环境，傻瓜式搞定本地环境的配置和使用。少就是性感。
- gitlab版本管理；
- 自动编译发布Jenkins（纯前端编译发布）；
- 统一脚手架
- Node中间层：需要SEO且前端使用React、vue，或前端介入后端逻辑，直接读取后端服务或者数据库的情况（好处是提高前端的开发效率和对业务的支持能力，缺点是可能导致P0级故障）。
3. 组件开发与管理
工具的价值在于抹平差异，将基础标准一致化。
- 跨屏、跨业务设计标准建设；
- 基于设计标准，基于行为、布局、皮肤等常量和变量，建设底层抽象组件；
- 基于基础组件，开发业务组件；
4. 模板开发与管理
中后台业务常见，表单、列表等居多，基于模板的方式可以省掉很大一部分制作 Demo 和实现交互的成本。因此，基于UI组件库以及标准业务流，可以做模板的开发与管理，高效解决。
- 渐进增强、优雅降级重展示、轻交互可做服务端渲染；
- JSX做页面模板，提供编译预渲染、服务端预渲染等技术；
5. 项目创建与管理
- Mock
- CodeReview流
6. CI/CD自动化构建部署
插件化机制，可以按需配置不同的检测项，如某检测项检测不通过，最终会阻塞发布流程。代码调试、接口调试，代码质量保证，自动化优化，预渲染等。前端环境docker，打包、代理工具；静态资源的CDN等：
- Lint 检测
- 兼容性 API 检测
- HTTPS 检测
- 包检测（黑名单、包版本）
- 合法性检测（域、链接）
- 404 检测
- 基础的 UI 检测（如是否缺少吊顶）
安全管理
- XSS注入：用户输入需转码，禁止使用eval函数；
- https；
- CSRF：要求server端加入CSRF的处理方法；
