El tablero de materiales NextJS es un material gratuito-UI, NextJS y React Admin con un diseño nuevo y fresco inspirado en el diseño de material de Google. Estamos muy emocionados de presentar nuestra opinión sobre los conceptos materiales a través de un conjunto de componentes fáciles de usar y hermosos. El tablero de materiales NextJS se construyó sobre los marcos populares de material-UI, NextJS y React.
El tablero de materiales de NextJS utiliza la luz, la superficie y el movimiento. El diseño general se asemeja a las hojas de papel después de múltiples capas diferentes, de modo que la profundidad y el orden son obvios. La navegación permanece principalmente en la barra lateral izquierda y el contenido está a la derecha dentro del panel principal.
El tablero de materiales NextJS viene con 5 opciones de filtro de color tanto para la barra lateral como para los encabezados de la tarjeta (azul, verde, naranja, rojo y morado) y una opción para tener una imagen de fondo en la barra lateral.
El tablero de materiales NextJS se creó usando NextJS y utiliza un marco construido por nuestro amigo Olivier: Material -UI, que hizo un trabajo increíble creando la columna vertebral para los efectos de material, las animaciones, las ondas y las transiciones. Muchas gracias a su equipo por el esfuerzo y a la visión del futuro que se pusieron en él.
¡Estamos muy emocionados de compartir este tablero con usted y esperamos escuchar sus comentarios!
Es de código abierto, y su repositorio de GitHub se puede encontrar aquí.
Un agradecimiento especial a:
| Nextjs | Nodejs | Laravado | Vue y Laravel | Vuetificar |
|---|---|---|---|---|
| Html oscuro | Html | Reaccionar | Vue | Angular |
|---|---|---|---|---|
Ver más.
Opciones de inicio rápido:
npm i nextjs-material-dashboardgit clone https://github.com/creativetimofficial/nextjs-material-dashboard.git .La documentación para el tablero de materiales React está alojada en nuestro sitio web.
En la descarga encontrará los siguientes directorios y archivos:
nextjs-material-dashboard
.
├── CHANGELOG.md
├── ISSUE_TEMPLATE.md
├── LICENSE.md
├── README.md
├── assets
│ ├── css
│ │ └── nextjs-material-dashboard.css
│ ├── github
│ │ ├── md-react.gif
│ │ └── react.svg
│ ├── img
│ │ └── faces
│ └── jss
│ ├── nextjs-material-dashboard
│ │ ├── cardImagesStyles.js
│ │ ├── checkboxAdnRadioStyle.js
│ │ ├── components
│ │ │ ├── buttonStyle.js
│ │ │ ├── cardAvatarStyle.js
│ │ │ ├── cardBodyStyle.js
│ │ │ ├── cardFooterStyle.js
│ │ │ ├── cardHeaderStyle.js
│ │ │ ├── cardIconStyle.js
│ │ │ ├── cardStyle.js
│ │ │ ├── customInputStyle.js
│ │ │ ├── customTabsStyle.js
│ │ │ ├── footerStyle.js
│ │ │ ├── headerLinksStyle.js
│ │ │ ├── headerStyle.js
│ │ │ ├── rtlHeaderLinksStyle.js
│ │ │ ├── sidebarStyle.js
│ │ │ ├── snackbarContentStyle.js
│ │ │ ├── tableStyle.js
│ │ │ ├── tasksStyle.js
│ │ │ └── typographyStyle.js
│ │ ├── dropdownStyle.js
│ │ ├── layouts
│ │ │ ├── adminStyle.js
│ │ │ └── rtlStyle.js
│ │ ├── tooltipStyle.js
│ │ └── views
│ │ ├── dashboardStyle.js
│ │ ├── iconsStyle.js
│ │ └── rtlStyle.js
│ └── nextjs-material-dashboard.js
├── components
│ ├── Card
│ │ ├── Card.js
│ │ ├── CardAvatar.js
│ │ ├── CardBody.js
│ │ ├── CardFooter.js
│ │ ├── CardHeader.js
│ │ └── CardIcon.js
│ ├── CustomButtons
│ │ └── Button.js
│ ├── CustomInput
│ │ └── CustomInput.js
│ ├── CustomTabs
│ │ └── CustomTabs.js
│ ├── FixedPlugin
│ │ └── FixedPlugin.js
│ ├── Footer
│ │ └── Footer.js
│ ├── Grid
│ │ ├── GridContainer.js
│ │ └── GridItem.js
│ ├── Navbars
│ │ ├── AdminNavbarLinks.js
│ │ ├── Navbar.js
│ │ └── RTLNavbarLinks.js
│ ├── PageChange
│ │ └── PageChange.js
│ ├── Sidebar
│ │ └── Sidebar.js
│ ├── Snackbar
│ │ ├── Snackbar.js
│ │ └── SnackbarContent.js
│ ├── Table
│ │ └── Table.js
│ ├── Tasks
│ │ └── Tasks.js
│ └── Typography
│ ├── Danger.js
│ ├── Info.js
│ ├── Muted.js
│ ├── Primary.js
│ ├── Quote.js
│ ├── Success.js
│ └── Warning.js
├── documentation
│ ├── assets
│ │ ├── css
│ │ │ ├── bootstrap.min.css
│ │ │ ├── demo-documentation.css
│ │ │ └── material-dashboard.css
│ │ ├── img
│ │ │ └── faces
│ │ └── js
│ │ ├── bootstrap.min.js
│ │ └── jquery-3.2.1.min.js
│ └── tutorial-components.html
├── layouts
│ ├── Admin.js
│ └── RTL.js
├── next.config.js
├── package.json
├── pages
│ ├── _app.js
│ ├── _document.js
│ ├── _error.js
│ ├── admin
│ │ ├── dashboard.js
│ │ ├── icons.js
│ │ ├── maps.js
│ │ ├── notifications.js
│ │ ├── table-list.js
│ │ ├── typography.js
│ │ ├── upgrade-to-pro.js
│ │ └── user-profile.js
│ ├── index.js
│ └── rtl
│ └── rtl-page.js
├── routes.js
└── variables
├── charts.js
└── general.js
En la actualidad, pretendemos oficialmente apoyar las dos últimas versiones de los siguientes navegadores:
| Nextjs | Reaccionar nativo | Vue | Fantasma |
|---|---|---|---|
| Html | Reaccionar |
|---|---|
| Nextjs | Laravado | Vue y Laravel | Vuetificar |
|---|---|---|---|
| Html | Reaccionar | Vue | Angular |
|---|---|---|---|
| Nextjs | Reaccionar nativo | Vue | Laravado |
|---|---|---|---|
| Html | Reaccionar |
|---|---|
Utilizamos problemas de GitHub como el rastreador oficial de errores para el tablero de materiales reaccionan. Aquí hay algunos consejos para nuestros usuarios que desean informar un problema:
Si tiene preguntas o necesita ayuda para integrar el producto, contáctenos en lugar de abrir un problema.
Más productos de Creative Tim: https://www.creative-tim.com/products
Tutoriales: https://www.youtube.com/channel/ucvytg4scw-rovb9ohkzzd1w
Regalos: https://www.creative-tim.com/products
Programa de afiliados (ganar dinero): https://www.creative-tim.com/affiliates/new
Redes sociales:
Twitter: https://twitter.com/creativetim
Facebook: https://www.facebook.com/creativetim
Dribbble: https://dribbble.com/creativetim
Google+: https://plus.google.com/+creativetimpage
Instagram: https://instagram.com/creativetimofficial