TIP

React 应用架构指南

React 是目前主流的前端框架之一，生态非常丰富，我们平时开发过程中遇到的问题，几乎都可以在 React 的生态系统中找到满足需求的库。

但是硬币都有两个面，丰富的生态有时候也会给开发人员带来困扰，比如如何在两个库之前做选择。同时，React 本身非常灵活，我们可以使用任何喜欢的方式编写 React 应用。因为没有开发人员可以遵循的规范或者预定义框架，随着时间的推移，代码库会变得混乱、不一致或过于复杂。

这个系列尝试用 React 生态系统中最好的工具来创建 React 应用，同时对如何让项目有良好的结构和可扩展性等做一些说明。

• 1.项目初始化配置

  对项目中需要使用的静态检查、代码格式化等工具进行说明，并给出样例。

• 2.项目结构设计

  良好的目录结构设计可以在保证代码功能模块清晰的同时提供很好的扩展性，给项目带来长久的生命力。

• 3.组件和样式

  应用中组件开发的最佳实践，以及优秀的组件库，样式解决方案介绍。

• 4.表单系统

  表单是前端开发的重要组成部分，本篇介绍社区里几个优秀的表单方案。

• 5.API 层最佳实践

  任何页面都需要调用 API 接口，本篇介绍一些 API 层的实践经验。

• 6.状态管理

  状态管理可以分几个层面来讨论，本篇来逐一进行说明，并介绍社区里的优秀实践方案

• 7.认证

  权限管理是应用中非常重要的一环。本文介绍前端应用中如何实现验证与授权。

• 8.API mock 服务

  在约定好接口后，前后端会分头开发。此时，对定义好的接口进行 mock 就显得非常重要。

• 9.测试

  好的测试可以给项目质量带来质的提升。不同的测试方法侧重点不同，本篇介绍常见的测试方法，以及一些可用的测试工具。

• 10.错误处理

  应用在运行过程中难免会遇到错误。好的错误处理机制即可以帮助我们优化在应用出错时的用户体验，又可以帮助我们跟踪解决错误。

• 11.性能

  应用要有好的用户体验，性能是首先需要考虑的问题。本篇介绍几个优化性能的方法。

参考链接：https://github.com/alan2207/bulletproof-react

关注微信公众号，获取最新推送~

加微信，深入交流~