หน้าแรก>การเขียนโปรแกรมที่เกี่ยวข้อง>โค้ดแหล่งที่มา AI
ดาวน์โหลด

แดชบอร์ดวัสดุทำปฏิกิริยา

NextJS Material Dashboard เป็นวัสดุฟรี -ui, nextjs และ React Admin ด้วยการออกแบบใหม่ที่ได้รับแรงบันดาลใจจากการออกแบบวัสดุของ Google เรารู้สึกตื่นเต้นมากที่จะแนะนำแนวคิดเกี่ยวกับวัสดุผ่านชุดส่วนประกอบที่ใช้งานง่ายและสวยงาม แผงควบคุมวัสดุ NextJS ถูกสร้างขึ้นเหนือวัสดุที่ได้รับความนิยม-UI, Nextjs และ React Frameworks

แผงควบคุมวัสดุ NextJS ใช้ประโยชน์จากแสงพื้นผิวและการเคลื่อนไหว เค้าโครงทั่วไปคล้ายแผ่นกระดาษตามหลายชั้นที่แตกต่างกันเพื่อให้ความลึกและคำสั่งชัดเจน การนำทางจะอยู่ที่แถบด้านข้างซ้ายและเนื้อหาอยู่ทางด้านขวาภายในแผงหลัก

แผงควบคุมวัสดุ NextJS มาพร้อมกับตัวเลือกตัวกรองสี 5 ตัวเลือกสำหรับทั้งแถบด้านข้างและส่วนหัวการ์ด (สีน้ำเงิน, เขียว, สีส้ม, สีแดงและสีม่วง) และตัวเลือกที่จะมีภาพพื้นหลังบนแถบด้านข้าง

แผงควบคุมวัสดุ NextJS ถูกสร้างขึ้นโดยใช้ NextJS และใช้เฟรมเวิร์กที่สร้างขึ้นโดยเพื่อนของเรา Olivier - Material -Ui ซึ่งทำงานได้อย่างยอดเยี่ยมในการสร้างกระดูกสันหลังสำหรับเอฟเฟกต์วัสดุภาพเคลื่อนไหวระลอกคลื่นและการเปลี่ยนแปลง ขอบคุณมากสำหรับทีมของเขาสำหรับความพยายามและคิดไปข้างหน้าพวกเขาใส่มัน

เรารู้สึกตื่นเต้นมากที่จะแบ่งปันแดชบอร์ดนี้กับคุณและเราหวังว่าจะได้รับฟังความคิดเห็นของคุณ!

มันเป็นโอเพ่นซอร์สและสามารถพบ GitHub repo ได้ที่นี่

ขอขอบคุณเป็นพิเศษไปที่:

  • NEPCHA Analytics สำหรับเครื่องมือวิเคราะห์ Nepcha ได้รวมเข้ากับแผงควบคุมวัสดุ Next.js แล้ว คุณสามารถใช้มันเพื่อรับข้อมูลเชิงลึกในแหล่งที่มาของการจราจร

สารบัญ

  • รุ่น
  • การสาธิต
  • เริ่มต้นอย่างรวดเร็ว
  • เอกสาร
  • โครงสร้างไฟล์
  • การสนับสนุนเบราว์เซอร์
  • ทรัพยากร
  • ชุดอุปกรณ์
  • รุ่นโปร
  • รุ่น Pro Kit
  • ปัญหาการรายงาน
  • การสนับสนุนทางเทคนิคหรือคำถาม
  • การออกใบอนุญาต
  • ลิงค์ที่มีประโยชน์

รุ่น

nextjs nodejs Laravel Vue & Laravel ทำให้หย่อน
html มืด HTML ตอบโต้ ความเต็ม เชิงมุม

การสาธิต

  • หน้าเริ่มต้น
  • หน้าโปรไฟล์ผู้ใช้
  • หน้าตาราง
  • หน้าแผนที่
  • หน้าการแจ้งเตือน

ดูเพิ่มเติม

เริ่มต้นอย่างรวดเร็ว

ตัวเลือกการเริ่มต้นอย่างรวดเร็ว:

  • npm i nextjs-material-dashboard
  • โคลน repo: git clone https://github.com/creativetimofficial/nextjs-material-dashboard.git
  • ดาวน์โหลดจาก GitHub
  • ดาวน์โหลดจาก Creative Tim

เอกสาร

เอกสารประกอบสำหรับแผงควบคุมวัสดุ React เป็นโฮสต์ที่เว็บไซต์ของเรา

โครงสร้างไฟล์

ภายในการดาวน์โหลดคุณจะพบไดเรกทอรีและไฟล์ต่อไปนี้: 

 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

การสนับสนุนเบราว์เซอร์

ในปัจจุบันเรามุ่งมั่นอย่างเป็นทางการที่จะสนับสนุนเบราว์เซอร์สองเวอร์ชันสุดท้าย:

ทรัพยากร

  • ตัวอย่าง: https://demos.creative-tim.com/nextjs-material-dashboard
  • ดาวน์โหลดหน้า: https://www.creative-tim.com/product/nextjs-material-dashboard
  • เอกสาร: https://www.creative-tim.com/learning-lab/nextjs/overview/material-dashboard
  • ข้อตกลงใบอนุญาต: https://www.creative-tim.com/license
  • การสนับสนุน: https://www.creative-tim.com/contact-us
  • ปัญหา: หน้าปัญหา GitHub
  • Nepcha Analytics - เครื่องมือวิเคราะห์สำหรับเว็บไซต์ของคุณ

ชุดอุปกรณ์

nextjs ตอบสนองพื้นเมือง ความเต็ม ผี
HTML ตอบโต้

รุ่นโปร

nextjs Laravel Vue & Laravel ทำให้หย่อน
HTML ตอบโต้ ความเต็ม เชิงมุม

รุ่น Pro Kit

nextjs ตอบสนองพื้นเมือง ความเต็ม Laravel
HTML ตอบโต้

ปัญหาการรายงาน

เราใช้ปัญหา GitHub เป็นตัวติดตามข้อผิดพลาดอย่างเป็นทางการสำหรับแผงควบคุมวัสดุตอบสนอง นี่คือคำแนะนำบางประการสำหรับผู้ใช้ของเราที่ต้องการรายงานปัญหา:

  1. ตรวจสอบให้แน่ใจว่าคุณใช้แผงควบคุมวัสดุเวอร์ชันล่าสุด ตรวจสอบ Changelog จากแดชบอร์ดของคุณบนเว็บไซต์ของเรา
  2. การจัดทำขั้นตอนที่ทำซ้ำได้สำหรับเราจะทำให้เวลาที่จะได้รับการแก้ไข
  3. ปัญหาบางอย่างอาจเป็นของเบราว์เซอร์เฉพาะดังนั้นการระบุในเบราว์เซอร์ที่คุณพบปัญหาอาจช่วยได้

การสนับสนุนทางเทคนิคหรือคำถาม

หากคุณมีคำถามหรือต้องการความช่วยเหลือในการรวมผลิตภัณฑ์โปรดติดต่อเราแทนที่จะเปิดปัญหา

การออกใบอนุญาต

  • ลิขสิทธิ์ 2021 Creative Tim (https://www.creative-tim.com)
  • ได้รับใบอนุญาตภายใต้ MIT (https://github.com/creativetimofficial/nextjs-material-dashboard/blob/master/license.md)

ลิงค์ที่มีประโยชน์

ผลิตภัณฑ์เพิ่มเติมจาก Creative Tim: https://www.creative-tim.com/products

บทเรียน: https://www.youtube.com/channel/ucvytg4scw-rovb9ohkzzd1w

Freebies: https://www.creative-tim.com/products

โปรแกรมพันธมิตร (รับเงิน): https://www.creative-tim.com/affiliates/new

โซเชียลมีเดีย:

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

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด