Refine:无头架构 高度解耦 中后台系统开源框架

科技   2024-11-26 19:56   湖北  


文章底部获取项目地址



Refine 是一个为 CRUD 密集型 Web 应用程序设计的 React 开源框架。适用于多种企业级用例,包括内部工具、管理系统等,Refine 提供了核心钩子和组件,涵盖了项目的关键项,包括权限控制、路由、网络请求、状态管理和国际化。Refine 允许通过将业务逻辑与 UI 和路由解耦来构建高度可定制的应用程序。
无头概念:
Refine 提供了一系列的帮助函数 Hooks、UI 组件 Components 和 API 数据源,而不是仅限于一组预样式的组件。由于完全解耦,你可以自由定制想要的技术栈架构系统。
Refine 模板:
使用 Refine 安装项目:
方式一:使用 cli 脚手架命令构建,过程中可选择所需的技术栈来初始化项目。
npm create refine-app@latest
方式二:使用官方可视化的方式构建项目。
1. 选择构建框架;
2. 选择 UI 组件库;
3. 选择后台 API 数据提供程序;
4. 选择用户认证和授权方式,可以选无;
5. 完成构建:左侧支持设置项目名称、Logo、主题颜色,点击 Build & Download 完成构建并下载项目代码。
数据源管理:
你可以使用 Refine 提供的内置数据源,也可以根据自己的 API 轻松创建数据源。支持使用 Refine 的数据钩子,如 useOne、useList、useUpdate 来轻松管理各种源,包括 REST、GraphQL、RPC 和 SOAP。
功能和特性:
核心钩子和组件: Refine 提供了核心钩子和组件,通过提供行业标准的解决方案来简化开发过程,这些解决方案涵盖了项目的关键方面,包括认证、访问控制、路由、网络、状态管理和国际化 i18n。
无头架构: Refine 的无头架构允许通过将业务逻辑与 UI 和路由解耦来构建高度可定制的应用程序。这使得它能够与任何自定义设计或 UI 框架集成,如 TailwindCSS,并且内置支持 Ant Design、Material UI、Mantine 和 Chakra UI。
平台集成: Refine 可以轻松集成到各种平台中,包括 Next.js、Remix、React Native、Electron 等,通过简单的路由接口,无需额外的设置步骤。
开发方法: Refine 在传统的从零开始开发方法和低代码/无代码解决方案之间占据了一个独特的位置。它提供了两者的优点,同时避免了长期风险,如项目延迟、维护问题和标准化问题。
状态管理:Refine 利用 React Query 进行数据获取和缓存,增强了应用程序的性能和用户体验。

《前端资源推荐》公众号收集各种前端组件 UI 框架、JS 插件工具、中后台系统模板、动画库、低代码、可视化资源、开源项目、学习资源、特效源码等,如有其他优秀资源,欢迎发消息投稿,感谢点赞、在看、转发、关注!!!

其他推荐


Uppy:支持断点续传 模块化的文件上传库

kkFileView:支持数十种文件格式预览开源工具库

Arco Design Mobile:字节新开源移动端 UI 组件库

V3 Admin Vite:低成本上手 中后台管理系统模板

Vue Fabric Editor:Vue3 Web端可视化图片编辑器

Vxe Table:Vue3 支持超大数据量渲染的表格组件

TinyMCE:支持 Word 导入 无限插件扩展 富文本编辑器

F2:蚂蚁开源 跨平台多端可视化图表

项目地址


GitHub:https://github.com/refinedev/refine

官方文档:https://refine.dev/

前端资源推荐
推荐分享各种前端组件UI、插件工具、中后台系统、低代码、可视化、开源项目、学习资源、特效源码等
 最新文章