推荐一个React的管理后台框架

转载请注明文章出处： https://tlanyan.me/recommond-a-react-based-admin-framework/

引言

jQuery 时代， jQuery +后端模板+ Bootstrap/Semantic 就可轻松完成前后端开发。进入 React/Angular/Vue 年代，前后端生态渐行渐远（编程方式上却有殊途同归的感觉），标榜为“全栈”的人更多是从前端通过 Nodejs 向服务端渗透。前端框架和工具日新月异，专业前端尚且学不动，更不用说业余的后端。定位为服务端开发，所以一直不太愿意写前端页面。

但很多时候需要一个人做前后端开发，写HTML/JavaScript/CSS势在必行。这时候有一个好用的前端模板/库/框架可大幅节省后端的生命。熟悉 React 的开发人员，遇到后台开发需求时，推荐使用 marmelab 的 react-admin 。

react-admin

在GitHub上搜”react admin”，排名第二位就是 react-admin ，star数达到5k。排名第一的 ReactJS-AdminLTE 本人也使用过，其与 react admin 的区别是：前者是前端模板，后者是前端开发框架。划重点： 前端开发框架 。根据实际使用，此言不虚。

react-admin 是基于 React 和 Material Design 的管理后台前端开发框架，官方网址是： http://marmelab.com/react-admin ，Github项目地址： https://github.com/marmelab/react-admin ，演示地址： https://marmelab.com/react-admin-demo/#/login 。其前身是 admini-on-rest ，2.x版本后改名为 react-admin 。

作为开发框架， react-admin 重点不是华丽、漂亮的页面示例，而是适用于后台开发的一整套解决方案。其重要特性包括：

1. 认证和授权（Authentication and Authorization），对用户身份和权限进行检查，通过 authProvider 提供；
2. 后端通信，支持 REST/SOAP 等，由 dataProvider 提供；
3. 数据更新和删除操作回滚（有限制）;
4. 支持排序、分页、搜索的 Datagrid 视图；
5. 前端数据校验；
6. 国际化支持，由 i18nProvider 提供；
7. 主题支持。

react-admin 有完整详细的文档，根据官网的”15分钟”教程( https://marmelab.com/react-admin/Tutorial.html )，可迅速开发出带有登录、对数据表CRUD的管理后台，非常实用。深入框架的各方面，需要继续阅读各专题文档。文档完整详细，并有示例代码，熟悉 React 的开发能在一两天内摸清框架各方面，得心应手的开发后台各种功能。

结论

作为一个基于React的管理后台SPA开发框架， react-admin 几乎覆盖了前端开发中的方方面面，功能强大且实用。界面风格基于 Material Design ，根据文档中开发出的界面比较简洁。如果需要比较美观的界面（图表、表单、列表等），可参考其他前端模板，例如 AdminLTE 。