你好编码员,

本文介绍了 React Dashboards 的候选名单,这可能有助于我们所有人在由开源爱好者(自由职业者和代理机构)制作的现代 UI 套件之上编写新产品。该列表仅包含其供应商积极支持和版本化的免费产品。在文章的最后,我将提到列出 10 多个 React Dashboards 的类似(流行)文章 - 随时查看更多优秀 React 产品的链接。

感谢阅读! - 内容由 App Generator 提供。

---

• 🔥React Node JS Datta Able- 全栈种子项目

• 🔥React Node JS Berry- 全栈种子项目

• (免费)React Material Dashboard- 产品页面

• (免费)Argon Material-UI React- 产品页面

• (免费)React Dashboard Argon- 产品页面

• (免费)NextJS Material- 产品页面

• (免费)Volt React Dashboard- 产品页面

---

Disclosure - 这篇文章包含附属链接。

如果您使用这些链接购买东西(您无需支付额外费用),我可能会获得佣金、产品或服务。 谢谢!

---

🔥React Node JS Datta- 全栈

Datta Able 是一个开源的 React Dashboard,它提供了丰富多彩的现代设计。 Datta Able React Free 是最程式化的 React Free 管理模板,围绕市场上所有其他管理模板。它带有功能丰富的页面和组件,以及完全以开发人员为中心的代码。该产品带有一个简单的 JWT 身份验证流程:登录/注册/注销。

---

• React Nodejs Datta Able- 产品页面

• React Nodejs Datta Able- 源代码

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--TFmNNbcm--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws .com/uploads/articles/v3h9fu3hf0by59psgbzi.gif)

---

🔥React Node JS Berry- 全栈

Berry 是由 CodedThemes 机构使用 Material-UI 构建的无创意 React Dashboard。它旨在通过高度可定制的功能丰富的页面提供最佳用户体验。它是一个完整的改变游戏规则的 React 仪表板模板,具有简单直观的响应式设计,就像在视网膜屏幕或笔记本电脑上一样。该产品带有一个简单的 JWT 身份验证流程:登录/注册/注销。

---

• React Nodejs Berry- 产品页面

• React Nodejs Berry- 现场演示(仅限 UI)

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--eHP-OzHk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3 .amazonaws.com/uploads/articles/l3p1jt4c2ldta4qjg1jt.png)

---

反应材料仪表板

Material Dashboard React是一款免费的 Material-UI Admin,其全新设计灵感来自 Google 的 Material Design。我们很高兴通过一组易于使用且美观的组件来介绍我们对材料概念的看法。 Material Dashboard React 是基于流行的 Material-UI v4.1.0 框架构建的。

---

• Material Dashboard React- 产品页面

• Material Dashboard React PRO - 更多页面和组件

---

---

氩材料-UI React

Argon Dashboard Material-UI 是一个开源的 React 仪表板,采用现代的基于 Material 的设计。 Argon Dashboard Material-UI 由 100 多个独立组件构建而成,让您可以自由选择和组合。所有组件都可以采用颜色变化,您可以使用 JSS 文件轻松修改。

---

• Argon Material-UI React- 产品页面

• Argon Material-UI React PRO - 更多页面和组件

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--BHELyro5--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws .com/uploads/articles/ic1ft9n1hf6lqcwb6n6e.png)

---

NextJS 材料仪表板

NextJS Material Dashboard 是一个免费的 Material-UI、NextJS 和 React Admin,其设计灵感来自 Google 的 Material Design。我们很高兴通过一组易于使用且美观的组件来介绍我们对材料概念的看法。 NextJS Material Dashboard 建立在流行的 Material-UI、NextJS 和 React 框架之上。

---

• NextJS 材料- 产品页面

• NextJS Material PRO- 更多页面和组件

• 更多Next.js 模板- 博客文章

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--_ml6xp4C--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /react-dashboards/master/media/nextjs-material-screen.png)

---

React Dashboard 氩气

React Dashboard Argon 是用于 Bootstrap4 和 Reactstrap 的开源管理仪表板。 React Dashboard Argon 由 100 多个独立组件构建而成,让您可以自由选择和组合。所有组件都可以采用颜色变化,您可以使用 SASS 文件轻松修改。仪表板资源:

---

• React Dashboard Argon- 产品页面

• React Dashboard Argon PRO - 更多页面和组件

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--DioMKvNh--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /react-dashboards/master/media/react-dashboard-argon-screen.png)

---

Volt React 仪表板

Volt React 是一个免费的开源管理仪表板模板,由 React.js 和 Bootstrap 5 提供支持,具有 100 多个 UI 元素、自定义插件和示例页面,可启动您的单页 Web 应用程序。

10 个手工制作的示例页面 - 下载 Volt React Dashboard 后,您将获得 10 个高质量的示例页面,以节省您编写样板代码的时间,并立即设置您的网站或 Web 应用程序的用户界面。

---

• Volt React Free- 产品页面

• Volt React PRO - 更多页面和组件

• React Dashboard教程 - 初学者的良好起点

---

---

React Datta Able

Datta Able React是一个开源管理模板,具有围绕市场上所有其他管理模板的独特 UI。它带有功能丰富的页面和组件,以及完全以开发人员为中心的代码。

在开发Datta Able之前,我们的重点是性能和设计。在开发过程中,我们经历了各种测试和代码优化过程,以制作这个以性能和设计为中心的后端应用程序。

---

• React Datta Able- 产品页面

• React Datta Able PRO - 更多页面和组件

• Datta Able Template - React- 完整文章

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--Dur6b1TZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /react-dashboards/master/media/react-datta-able-screen.png)

---

CoreUI 反应

这可能是在 Material Design 之上制作的最好的免费产品之一。就个人而言,我不喜欢这个 UI 概念,但 CoreUI 看起来不错。

CoreUI 旨在成为 UX 游戏规则的改变者。纯粹透明的代码没有多余的组件,因此应用程序足够轻巧,可以提供终极的用户体验。

---

• CoreUI React- 产品页面

• CoreUI React PRO- 更多页面和组件

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--NNgVB1Nl--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /react-dashboards/master/media/coreui-screen-charts.png)

---

React Star 管理员

Star Admin React Free 模板为用户提供了无限的自定义选项。它使您可以访问各种基本元素,从而为您的 Web 应用程序带来独特的触感。该模板具有精心制作的仪表板,其中包含大量整齐排列和组织的组件,并且能够使数据可视化过程更简单。

---

• Star Admin React- 产品页面

• Star Admin React PRO - 更多页面和组件

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--_DKNxMl0--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /static/master/react-dashboard-star-admin-free/react-dashboard-star-admin-free-screen.png)

---

机身反应

这个现代的 React Dashboard 是由一个单独的开发者构建的:Tomasz Owczarczyk。编写一流的仪表板然后免费发布它是一件很难实现的事情,而这个人做到了。请注意,所有其他产品都是由代理机构在许多开发人员的努力下开发的。

具有极简设计和创新 Light UI 的 Airframe Dashboard 将让您构建具有出色 UI 的惊人而强大的应用程序。专为大规模应用而设计,带有详细的分步文档。

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--a4dnfzrZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /react-dashboards/master/media/airframe-screen.png)

---

AntD反应

基于 Ant Design 和 UmiJS 构建的企业应用程序的优秀前端解决方案。我选择这个产品主要是为了提供令人印象深刻的图表。

• 国际化,从源代码中提取翻译字段,按需加载语言包

• 动态权限,不同菜单的不同权限

• 优雅美观,蚂蚁设计系统

• 模拟数据,本地数据调试

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--nfY4wO5U--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /react-dashboards/master/media/antd-intro.gif)

---

浅蓝色反应

Light Blue React Template 是一个很好的模板,可以快速开始开发 SAAS、CMS、IoT Dashboard、电子商务应用程序等

Light Blue 的精简版包括以下功能和页面:

• 引导程序 4+ & SCSS

• 响应式布局

• 反应 Chart.js

• 简单登录/注销

• 错误页面

• 样式化的引导组件,如按钮、模式等。

---

[](https://res.cloudinary.com/practicaldev/image/fetch/s--wFQBwNBR--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://raw.githubusercontent.com/admin-dashboards /react-dashboards/master/media/light-blue-screen.png)

---

感谢阅读!更多 React Dashboards 请访问:

• 15+ 免费 React 模板| Material-ui.com

• 开源 React Dashboards - 精选列表(Dev.to)

---

顺便说一句,我的(昵称)名字是 Sm0ke,我在Twitter上也很活跃。