mantine analytics dashboard下載-Mantine mantine analytics dashboard源代碼下載

mantine analytics dashboard

Ai源碼

UI updates and bug fixes

下載

公告

添加了文件管理器頁面UI
更新到最新7.14.3
新的黑暗模式變體
新的側邊欄版本，現在我們有了完整的，迷你和完整的崩潰模式

實時預覽
組件預覽
中等的
產品路線圖 *新*

關於

使用Mantine 7上構建的專業管理員和儀表板模板，配備了數百個UI組件，表單，表，圖表，頁面和圖標。該模板是使用Next V14，React，Apex圖表，Mantine DataTable和Storybook構建的。

預覽圖像

先前的版本

儀表板模板的先前版本，支持下一個頁面路由器和Mantine 6。要查看實時演示，請使用此鏈接 - 預覽 - 簽約fork repo使用此鏈接 - 版本1

特徵

可自定義：您無需成為專家即可自定義模板。我們的代碼非常可讀且有據可查。
完全響應：使用移動，平板電腦和桌面支持，您使用的設備都無關緊要。 ANTD儀表板在所有瀏覽器中都響應敏感。
跨瀏覽器：我們的主題與Chrome，Firefox，Opera和Edge完美合作。我們正在努力支持他們。
乾淨的代碼：我們嚴格遵循Ant Design的指南，使您的集成盡可能容易。所有代碼都是手寫的。
定期更新：時不時會收到一個更新，其中包含新組件，改進和錯誤修復。

技術堆棧

為了使此模板很棒，我使用了以下包：

核

Next JS V14： Next.js是一個由私人公司Vercel創建的開源Web開發框架，該框架可提供基於React的Web應用程序，並使用服務器端渲染和靜態網站生成。
Mantine V7： Mantine是React UI組件庫。它建立在React和TypeScript之上，並為構建高性能Web應用程序提供了各種組件和鉤子。
React V18： React是一個免費的開源前端JavaScript庫，用於基於組件構建用戶界面。
TypeScript V5： Typescript是Microsoft開發的一種免費的開源高級編程語言，可在JavaScript中添加帶有可選類型註釋的靜態鍵入。
Storybook V7： Storybook是一種免費的開源工具，用於隔離開發UI組件。 Web開發人員使用它來改善其UI開發工作流程並構建更好的Web應用程序。
更改集CLI V2： Changeet是一個包裝，有助於管理我的版本和更改。
NextAuth v4： NextAuth.js是一個靈活且安全的身份驗證庫，可用於Next.js中的客戶端身份驗證。
表圖標V2：表圖標是一個免費的開源圖標庫，具有超過4,700個圖標。這些圖標的設計具有現代美感，適用於廣泛的應用。
Mantine DataTable V7： Mantine DataTable是一種可用於創建數據豐富的用戶界面的React組件。它是一個表明黑暗主題並為曼丁UI設計的表組件。
Lodash V4： JavaScript實用程序庫提供一致性，模塊化，性能和附加功能。
Apex Chart V3：S ApexCharts是一個免費的開源JavaScript圖表庫，允許開發人員為網頁創建交互式數據可視化。它可用於商業和非商業項目。
Dayjs v1： Day.js是一個處理日期和時間的JavaScript庫。
Tiptap V2：基於Prosemirror的無頭，框架敏捷且可擴展的文本編輯器。
FullCalendar V6 ：FullCalendar是一個JavaScript事件日曆，具有超過300個設置。它是開源的，有一個自由核心。
DND-KIT V6： DND-KIT是一種輕巧，模塊化和可擴展的拖放工具包，用於React。它也可以訪問和表現。
Embla Carousel V7： Embla Carousel是一個輕巧的旋轉木製庫，具有流暢的運動和精確的刷卡。
React Simple Maps V3：使用和為React構建的SVG地圖圖組件。
文員/nextjs v4：店員next.js是圍繞店員的包裝紙。它允許用戶使用店員React提供的鉤子。
React Countup V6： countup.js周圍的React組件包裝器。

開發

Prettier V3： Prettier是一種自動格式化代碼的代碼格式，以確保其一致且易於閱讀。
HUSKY V8： Husky是一種工具，可以更輕鬆地使用Git鉤。 Prettier是代碼格式。
皮棉上演的V15：皮棉階層將自動在提交中添加任何修改，只要沒有錯誤。
PostCSS V8： PostCSS是一個JavaScript庫，使用插件來轉換CSS。它將CSS轉移到抽象語法樹中，然後由JavaScript對象表示。

快速開始

下載

克隆此倉庫git克隆https://github.com/design-sparx/mantine-analytics-dashboard.git
從Github下載

構建工具

您需要安裝node.js。安裝Node.js後，運行NPM安裝以安裝模板的其餘依賴項。所有依賴項將下載到node_modules目錄。

npm install

現在，您可以修改源文件並生成新文件。要自動檢測文件更改並在http：// localhost：3000啟動本地Web服務器，請運行以下命令。

npm run dev

編譯，優化，縮小和uglify所有源文件以構建/

npm run build

文件結構

在Zip-File內部，您會找到以下目錄和文件。在ZIP文件中，您都會找到以下目錄和文件。包裝和縮小的分發文件以及源文件都包含在軟件包中。

 mantine-analytics-dashboard/
├── .changeset
├── .github
├── .gitignore
├── .editorconfig
├── .prettierignore
├── .prettierrc
├── README.md
├── CHANGELOG.md
├── LICENSE
├── index.html
├── package.json
├── tsconfig.json
├── next.config.js
├── postcss.config.cjs
├── clerkMiddleware.ts
├── yarn.lock
├── public/
│   ├── mocks/
│   ├── _redirects
│   ├── favicon.ico
├── src/
│   ├── .changeset/
│   ├── .github/
│   ├── .husty/
│   ├── .storybook/
│   ├── .yarn/
│   ├── app/
├────── api/
├────── error.tsx
├────── error.module.css
├────── global.css
├────── layout.tsx
├────── loading.tsx
├────── not-found.tsx
├────── page.module.css
├────── page.tsx
│   ├── components/
│   ├── hooks/
│   ├── layout/
│   ├── providers/
│   ├── public/
│   ├── routes/
│   ├── styles/
│   ├── theme/
│   ├── types/
│   ├── utils/
└──