react 怎么获取表格_现代化风格的React应用模板——React Material Admin

最新推荐文章于 2024-08-10 08:03:04 发布
最新推荐文章于 2024-08-10 08:03:04 发布
阅读量271 收藏
点赞数
文章标签： react 怎么获取表格
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_35282085/article/details/112265042
版权

介绍

React Material Admin是一个Github上开源的基于Material-UI的应用模板，使用React，Material-UI，React Router，Redux构建，没有jQuery和Bootstrap！界面相对简洁，富有现代化元素，因为使用的Material-UI作为UI组件库，整体风格也就是Material-UI风格！React版本是16.8.2

db30bebb1934f8ebd53dea7f8aa7fff5.png

如何找到它？

因为是开源项目，你很容易就能够从Gitub获取他，并提供在线的demo进行预览，这里不方便放地址，如果有需要可以自定搜索。

关键字：React Material Admin

433de7e6b1df18159388bec6062cdb05.png

相关特点

下面是Github对其进行的简单特性的介绍

  • React (16.8.2)
  • No jQuery and Bootstrap!
  • Mobile friendly layout (responsive)
  • Create-react-app under the hood
  • React Router
  • Material-UI
  • Modular Architecture
  • CSS-in-JS styles
  • Webpack build
  • Stylish, clean, responsive layout
  • Authentication

页面预览

除了以上特性，模板已经包括以下一些页面，稍后通过截图的方式简单看下效果

  • Dashboard

面板

29d2932cf7dabb2d5257b31811d4426b.png
  • Typography

排版

801190bd41a0b9aec87ebcadf523ead2.png
  • Tables

表格

5b2ceeaa7a03b16c0188e5430b0cfb80.png
16da097d18d3ae649169d87cc9e5ceaf.png
fe9a1021275aef8d1f84ac7ccb9fee5a.png
  • Notifications

通知、消息

b498d249b65230d7cdf28e84fce0555c.png
  • Charts

图表

15e885311cc7500142650e75a22a75a6.png
  • Icons

图标种类非常多，基本上已经足够使用

fb531f82041c51eb10678ccce05644b9.png
7d17cbb59eecbd98404a0d409f4a6fac.png
38635f2adbc03f92a65ebc6071828d02.png
  • Maps

地图集成

不方便展示，可以直接查看相关demo

  • Login

登陆页面

db30bebb1934f8ebd53dea7f8aa7fff5.png
  • Error
d576e5389681c31bb9f34b75ad788d5b.png
  • 折叠菜单等
0cc600e12ee2b20429e876a03e441340.png
8336bda16514e9b2b0af27433331e4e8.png

快速开始

按照常规的做法莫过如下，或者直接下载

$ git clone github地址 MyApp$ cd MyApp
yarn install//oryarn
yarn start
yarn build

其他相关

如果你不满足于React技术栈，你还可以获取Vue相关的模板，可以在Github获取页面的入口，下面是其一些截图，当然其中有不少免费和收费的模板，可以自行选择！

1232819227fa54af55b7aee3bb3a5447.gif

这其中包括NodeJS、HTML5、Angular、React、Vue的模板，可以说非常全面了

总结

React Material Admin相对于其他一些框架模板可能功能上目前还稍逊一些，但是实质上它只是提供一个前端应用的开发模板，页面UI简洁美观，风格现代化，比较适合现代化应用开发，不需要再重复造轮子！

喵仔冲鸭
关注
react的模板
liuuuy_7的博客
06-04 187
tsx文件的模板 与js区别，需要定义数据类型（tsx 就是 使用 typescript 书写 jsx） import React from 'react'; import styles from './index.less'; interface Props { } interface State { } class WorkOrder extends React.PureComponent<Props, State> { constructor(props: Props) {
React_NextJS_MaterialUI_Admin_DashBoard
04-30
React_NextJS_MaterialUI_Admin_DashBoard It's a simple SSR (server side rendering) admin dashboard thats made by using following frontend technologies - ReactJS - NextJS - MaterialUI 怎么跑 1. ...
react-ReactMaterialAdmin是一个使用MaterialUI构建的仪表板React模板
08-15
☄️React Material Admin是一个使用Material-UI构建的仪表板React模板
有了这 18 个免费的React模板以后，也太省事了吧！！
热门推荐
零一的博客
05-12 1万+
前端哪需要自己设计页面？用现成的不就好了？
React Material Admin 项目教程
最新发布
gitblog_01025的博客
08-10 357
React Material Admin 项目教程 react-material-admin☄️React Material Admin is a React template built with Material-UI项目地址:https://gitcode.com/gh_mirrors/re/react-material-admin 1. 项目的目录结构及介绍 React Material...
material-dashboard-react-v1.4.1 后台模板 前端模板
08-15
最新版本 material-dashboard-react-v1.4.1 后台模板 前端模板
React模板
02-12
React模板 演示React App 特色 节点应用 MongoDB JSS 当地建筑 远程部署 本机React Redux 指示 安装Mongo（如果需要） 安装brew /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)" 安装MongoDB brew tap mongodb/brew 安装MongoDB社区$ brew install mongodb-community brew services start mongodb-community@4.4z mongod --config /usr/local/etc/mongod.conf 创建数据库 运行Mongo Shell mongo use react-templat
react-admin_client.rar
02-27
在本文中，我们将深入探讨React Admin以及如何与Ant Design库结合使用，这主要基于您提供的压缩包文件"react-admin_client.rar"。React Admin是一个流行的开源框架，用于构建管理界面，而Ant Design则是一个广泛使用...
material-kit-react:最小仪表板 - 使用 React Material UI 组件构建
08-04
使用 Material-UI 组件和 React 制作的免费 React Admin Dashboard。 7演示页面 40 个演示页面 —— ✓ 多语言 —— ✓ 暗/亮模式 :first_quarter_moon: —— ✓ —— ✓ 打字稿版本 —— ✓ 设计文件（Figma...
react-materialui-boilerplate:React + Material UI 样板
05-29
React材料 UI 样板 React和材料 UI 的入门套件。 客户端由创建，服务器端由支持。 特征 材质 UI ( ) Redux ( ) 快递 ( ) React Router（ ） 待办事项 不同类型的工作环境设置（stage、dev、prod） 服务器端 API...
Admin-dashboard-React-Material-ui:使用React，Redux和Material-UI的管理仪表板
05-03
cd react-material-dashboard 3，安装依赖项 yarn install 或者 npm install 4.启动应用程序： yarn start 或者 npm start 要做的事 使用钩子代替this.setState; 创建侧边栏链接； :check_mark: 使用Jest和...
react-template：样板React模板
02-26
React样板模板 一个样板的React模板。 使用 签出此仓库，安装依赖项，然后在终端中运行以下命令。 > git clone https://github.com/iknowhtml/react-template.git > cd react-template > yarn install 然后运行yarn start以开发模式启动该应用程序。
轻量级React模板React-templates.zip
07-18
React-templates 是轻量级的 React 模板。没有运行时间库。没有 magic。只是简单地以预编译的方式来清除 React 代码。像 HTML 一样容易的语法，被大多数 IDE 所支持。清晰地分离了演示和逻辑 -组件文件中的 HTML 几乎为零。描述性编码，确保您编写的 HTML 和你检查的 HTML 几乎相同。支持 AMD， CommonJS， ES6， Typescript 和 globals。 标签：React
material-react-blog-template:用Material-ui制作的ReactJS博客模板
05-05
物质React博客模板 一个博客网站模板，该模板使用和此模板使用create-react-app渐进式Web应用程序模板。 在此处结帐实时预览 开始吧 要开始运行以下命令 git clone https://github.com/aadityasiva/material-react-blog-template.git my-blog cd my-blog yarn install :copyright:2021制造 :red_heart: 来自Aadityasiva和贡献者
react-React大数据平台模板
08-15
这是一个大数据应用平台前端项目模板，本项目基于react-create-app搭建，为了保存脚手架的可升级性，不暴露react-scripts，用react-app-rewired进行配置修改，主要用到可视化图表库bizcharts，地图用的百度地图，封装了一些自己常用到的组件
module-admin-react-pro：模块化Material Admin + React：使用MaterialUI + TypeScript构建的免费仪表板主题| 专业版
02-03
模块化材料管理+ React 免费仪表盘的主题实现为通过使用ReactJS +打字稿+终极版+复赛+阵营鱼钩 （开发中） 入门 在项目目录中，可以运行： npm start 在开发模式下运行应用程序。 打开在浏览器中查看。 如果进行编辑，页面将重新加载。 您还将在控制台中看到任何棉绒错误。 npm test 在交互式监视模式下启动测试运行程序。 有关更多信息，请参见关于的部分。 npm run build 构建生产到应用程序build文件夹。 它在生产模式下正确捆绑了React，并优化了构建以获得最佳性能。 最小化构建，文件名包含哈希。 您的应用已准备好进行部署！ 有关更多信息，请参见有关的部分。 了解更多 您可以在了解更多。 要学习React，请查看。
推荐使用：React Material Admin - 现代化React管理后台模板
gitblog_00011的博客
05-13 300
推荐使用：React Material Admin - 现代化React管理后台模板 react-material-admin☄️React Material Admin is a React template built with Material-UI项目地址:https://gitcode.com/gh_mirrors/re/react-material-admin 基于React和Mat...
React精简模板
m0_56195392的博客
05-10 253
//有一个type状态 1 2 3 //1 -> h1 //2 -> h2 //3 -> h3 //原则：模板中的逻辑尽量保持精简 //复杂的多分枝的逻辑，收敛为一个函数 通过专门的函数来写分支逻辑 模板中只负责调用即可 const getHtag = (type) => { if (type === 1) { return <h1> this is h1 </h1> } if (type === 2) { retur..
React 学习之基本模板
小傲哥哥的博客
07-22 459
import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import * as serviceWorker from './serviceWorker'; let bg = { background:"skyblue", borderBottom:"4px solid red" } let element = ( <
react 项目模板
07-27
此外，还有"React Blur admin"这个模板\[3\]，它适用于构建React应用程序的管理界面，提供了表格、表单、地图、图表、UI特性、配色方案等功能。 最后，还可以考虑"NextJS Material Dashboard"这个模板\[3\]，它是一...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值