很棒的材质-UI

Material-UI 是一个 React 组件库，用于更快、更轻松地进行 Web 开发. 它跟随 Material Design 来自谷歌.

Resources¶

Material-UI Design 的官方项目和资源.

• Material-UI - React 组件可实现更快、更轻松的 Web 开发. 构建您自己的设计系统，或从 Material Design 开始.

Articles¶

• Getting started with Material-UI - 如何在 React Web 应用程序中设置和使用 Material-UI.
• How to autogenerate forms in React and Material-UI with MSON - 在 Material-UI 中使用 JSON 自动生成表单的指南.
• Let's Create a COVID-19 Tracker using React.js - 使用 Material-UI 开发 covid 19 跟踪器应用程序的指南
• Serverless Material UI contact form - 开发 Material-UI 联系表的指南
• Embed Medium as a blog on your React Website — Part 2 - 使用 Material-UI 将媒体作为博客嵌入到您的 React 网站上的指南

Tools¶

这些工具和实用程序可帮助使用 Material-UI Design 构建应用程序.

• Material-UI Snippets - 提供片段的 VSCode 扩展.
• Material-UI Codemorphs - 提供 codemods 的 VSCode 扩展.

Theming¶

以下实用程序可帮助您自定义主题以及在浏览器中更改主题的能力.

• Create Material-UI Theme - 通过 Material Design Color Tool 创建 Material-UI 主题的在线工具.
• Material-UI Theme Generator - Material-UI 主题/调色板生成器.
• Material-UI Theme Editor - 一种工具，只需选择颜色并进行实时预览即可为您的 Material-UI 应用程序生成主题.

Related Projects¶

Material-UI Design 系列项目.

• material-ui-theme-editor - 为具有实时预览功能的 Material UI 应用程序生成主题的工具.
• Material palette generator - 官方 Material Design 调色板生成器可用于为您选择的任何颜色生成调色板.
• Components Extra - 提供一组构建在 Material-UI 之上的“分子”组件，例如页脚、CookiesBanner、BackToTop 按钮和其他高度可定制的复杂元素，以帮助开发人员快速构建其 UI 的宏部分. 这些组件经常跨站点重复 - 这个库解决了这个问题.
• React Admin - 一个前端框架，用于构建在浏览器中运行的管理应用程序，在 REST/GraphQL API 之上，使用 ES6、React 和 Material Design.
• Material UI Snippets - 提供片段的 VSCode 扩展.
• Material UI Codemorphs - 提供 codemods 的 VSCode 扩展.
• Eslint: detect unused classes - 使用“@mui/styles”检测未使用的样式类的 ESLint 插件.

Components¶

使用 Material-UI Design 构建的 UI 组件列表.

• Material-UI Chip Input - 受 Angular Material 芯片输入启发的 Material-UI 芯片输入.
• Material-UI Password field - 使用 Material-UI 的密码字段.
• Fullscreen Dialog - Material-UI 的全屏对话框.
• Material-UI Upload - 使用 FileAPI 上传在 Material-UI 中制作的控件.
• Super Select Field - Material-UI 的多选自动完成下拉组件.
• Material JSON Schema Form - 从 json 生成的 Material-UI 表单.
• Notistack - Material-UI 的简易小吃店（因此您不必处理它们的打开/关闭状态）.
• Material-UI Dropzone - 建立在 react-dropzone 之上的 Material-UI 组件.
• Formik-Material-UI - 将 Material-UI 与 formik 结合使用的绑定.
• Redux-Form-Material-UI - 包装器组件，以方便将 Material-UI 与 Redux Form 一起使用.
• Final-Form-Material-UI - 包装器组件，以方便将 Material-UI 与 Final Form 一起使用.
• Material-UI Auto Rotating Carousel - 材质风格的旋转木马.
• Material-UI Image - 带有加载动画的材料风格图像.
• Material-UI Flat Pagination - 用于 Material-UI 的平面设计分页组件.
• Dx-react-scheduler-Material-UI - Material-UI 的调度程序/日历组件.
• Dx-react-chart-Material-UI - Material-UI 图表，使用各种系列类型可视化数据，包括条形图、线形图、面积图、散点图、饼图等.
• Material-UI Medium Blog - 扩展 Material-UI Card 组件以显示 Medium 博客.
• React Github Repo Cards - 扩展 Material-UI Card 组件以显示 GitHub 存储库.
• React molecule-components - 基于 Material-UI 反应分子组件.
• Material-UI NestedMenuItem - 使用无限嵌套菜单直接替换 MUI 的 MenuItem，并在悬停时打开.
• React-planet - 创建看起来像行星的圆形菜单.

Applications¶

使用 Material-UI Design 构建的成熟应用列表.

• Bethesda.net - Bethesda 的官方网站，Fallout、DOOM、Dishonored、Skyrim、Wolfenstein、The Elder Scrolls 等游戏的发行商.
• TagSpaces - 离线、开源、文件管理器.
• Builder Book - 教您如何构建全栈、生产就绪 Web 应用程序的书籍.
• NPM registry browser - 一个开源 Web 应用程序，可让您搜索 npm 注册表并浏览包详细信息.
• Serverless Permission Policy Generator - 用于生成部署无服务器堆栈所需的 AWS IAM 权限的在线应用程序.

Boilerplates¶

使用 Material-UI Design 构建的入门项目和样板列表.

• Create React App example (mui-org/material-ui) - 从官方 Material-UI 仓库创建 React App 示例.
• Create-react-app-material-ui - 使用 Material-UI 表单提交示例的简单创建 React 应用程序.
• React-materialui-boilerplate - 用于 React 和 Material-UI 的入门套件.
• Gatsby-starter-material-ui - 使用 Material-UI 的 Gatsby 入门模板.
• Saas - 用于构建您自己的 SaaS 产品的样板； 使用 TypeScript、React、Express、Material-UI 构建.
• Create-react-app-material-typescript-redux - 准备好使用样板来启动大型反应项目.

Contributing¶

随时欢迎您的贡献！ Click Here to read the guidelines.