Mantine Admin下載-Mantine Mantine Admin源代碼下載

Mantine Admin

Ai源碼

1.0.0

下載

Mantine Admin

演示→

只需單擊幾下即可部署自己的模板副本！

介紹

該模板具有許多文件夾，代碼示例和配置。隨意編輯或刪除它們，包括此讀數！

自定義和享受！

？特徵

該項目具有所有最新工具和網絡開發中的良好實踐！

框架

⚛️Annex.js - 混合和服務器渲染的完整反應框架

數據獲取

？ KY-基於瀏覽器Fetch API的微小而優雅的HTTP客戶端
React查詢- 用於獲取，緩存和更新異步數據的掛鉤

國家管理和鉤子

？ Zustand - 使用簡化的通量原理的小型，快速且可擴展的國家管理解決方案
？反應使用- 基本反應鉤的收集

設計系統和動畫

？ Mantine-UI - 一個簡單，模塊化且易於訪問的組件庫，它為您提供構建React應用程序的構建塊
表圖標- 一系列流行的圖標來反應項目

表單驗證

？ React Hook形式- 具有易於使用驗證的性能，靈活和可擴展的形式
ZOD - 使用靜態類型推理的打字稿優先架構驗證

測試

？開玩笑- 令人愉悅的JavaScript測試框架，重點是簡單
？測試庫- 簡單而完整的測試公用事業，鼓勵良好的測試實踐

設計模式

⛔eslint - 在JavaScript代碼中查找並解決問題
？ Prettier - 一種自以為是的代碼格式，支持多種語言和代碼編輯器
？沙啞- 現代本地git掛鉤變得容易
？絨毛段- 運行針對上演的git文件的襯裡，不要放任嗎？滑入您的代碼庫
？ commlint - 幫助您的團隊遵守提交大會
？ ️標準版本- 使用SEMVER和CHAMPELOG生成版本的版本控制的實用程序。

分析

?? ‍♂️為什麼要渲染（可選） - 通知您有關可能避免的重新租賃的信息

▶q入門

？在github上創建新的存儲庫

單擊“使用此模板”按鈕
配置您的新存儲庫，然後單擊“從模板創建存儲庫”按鈕
現在，您可以將生成的存儲庫克隆到本地計算機：

 $ git clone https://github.com/ < YOUR-GITHUB-LOGIN > / < NAME-OF-YOUR-GENERATED-REPOSITORY > .git

安裝

在開始開發超級應用程序之前，您需要安裝項目的依賴項。

將自己移至項目的根源：

$ cd < NAME-OF-YOUR-GENERATED-REPOSITORY >

對於下一步，選擇您選擇的軟件包管理器，然後更改package.json腳本中包含的命令。有關更多信息，請參見他們的文檔：
PNPM（推薦）
NPM

安裝項目的所有依賴性：

 # PNPM
$ pnpm install
# NPM
$ npm install

⌨️發展

一旦安裝了所有依賴項，您就可以運行本地開發服務器：

 # PNPM
$ pnpm dev
# NPM
$ npm run dev

現在只需代碼！

生產

應用更改後，您可以生成構建以測試和/或部署到生產環境中。

製作生產：

 # PNPM
$ pnpm build
# NPM
$ npm run build

然後運行構建：

 # PNPM
$ pnpm start
# NPM
$ npm start

查看更多您可以使用的命令

皮棉

 # PNPM
$ pnpm run lint
# NPM
$ npm run lint

皮棉和修復

 # PNPM
$ pnpm run lint:fix
# NPM
$ npm run lint:fix

測試

 # PNPM
$ pnpm run test # or pnpm run test:watch
# NPM
$ npm run test # or npm run test:watch

類型檢查

 # PNPM
$ pnpm run type-check
# NPM
$ npm run type-check

格式

 # PNPM
$ pnpm run format
# NPM
$ npm run format

交互式更新工具

 # PNPM
$ pnpm run up
# NPM
$ npm run up

更新所有依賴關係

 # PNPM
$ pnpm run up-latest
# NPM
$ npm run up-latest

發布作為主要版本

 # PNPM
$ pnpm run release-as-major
# NPM
$ npm run release-as-major

以次要版本發布

 # PNPM
$ pnpm run release-as-minor
# NPM
$ npm run release-as-minor

發布作為補丁版本

 # PNPM
$ pnpm run release-as-patch
# NPM
$ npm run release-as-patch

發布發布

 # PNPM
$ pnpm run push-release
# NPM
$ npm run push-release

從遠程獲取更新並維護當前更改

 # PNPM
$ pnpm run pull
# NPM
$ npm run pull

額外的配置

你為什麼渲染

如何激活

將babel.config.js文件（位於路徑src/scripts中的Path SRC/腳本中）放在項目root和DELETE .babelrc文件中。

刪除pages/_app.tsx上的wdyr導入線。

就是這樣！現在，您可以Monitore React Recreders！

如何卸載

只需刪除babel.config.js和wdyr.ts文件，刪除wdyr import Line在pages/_app.tsx上，然後卸載IT：

 # PNPM
$ pnpm uninstall @welldone-software/why-did-you-render
# NPM
$ npm uninstall @welldone-software/why-did-you-render

？文件樹

請參閱下面的文件樹以了解項目結構。

查看文件樹

標記為（ ** ）的文件夾和文件是可選的，因此您可以刪除。

 mantine-admin/
┣  .github/                   # GitHub's folder configs **
┣  .husky/                    # Husky's folder
┃ ┣ ? commit-msg               # Commitlint git hook
┃ ┗ ? pre-commit               # Lint-staged git hook
┣  .vscode/                   # VSCode's workspace **
┣  public/                    # Public folder
┃ ┣  static/                  # Static files folder **
┃ ┃ ┣  icons/                 # Icons folder **
┃ ┃ ┣  images/                # Images folder **
┃ ┃ ┣  sounds/                # Sounds folder **
┃ ┃ ┗  videos/                # Videos folder **
┃ ┣  docs/                    # Documentation folder **
┃ ┃ ┣  demo/                  # Demonstrations project **
┃ ┃ ┗  translations/          # Translations folder **
┃ ┣ ? favicon.ico              # Icon tab browser
┣  src/
┃ ┣  app/                   # App pages
┃ ┣  components/              # App Components
┃ ┃ ┗  Motion/                # Mantine-UI components **
┃ ┣  hooks/                   # React Hooks **
┃ ┃ ┗ ? useFetch.ts            # SWR fetch hook (optional) **
┃ ┣  interfaces/              # TypeScript Interfaces
┃ ┣  scripts/                 # Additional scripts **
┃ ┃ ┣ ? babel.config.js        # Babel config with WDYR **
┃ ┃ ┗ ? wdyr.ts                # WDYR file **
┃ ┣  services/                # Services
┃ ┃ ┗  users/
┃ ┃   ┣ ? index.ts             # React Query Configuration
┃ ┃   ┗ ? keys.ts              # React Query Key
┃ ┣  stores/                  # Zustand stores
┃ ┣  styles/                  # Styles folder
┃ ┃ ┣ ? bgImages.ts            # SVG background images **
┃ ┃ ┗ ? theme.ts               # Mantine-UI theme
┃ ┗  utils/                   # Useful functions **
┣ ? .babelrc                   # Default Babel config
┣ ? .editorconfig              # Editor config
┣ ? .eslintignore              # ESLint ignore
┣ ? .eslintrc                  # ESLint config
┣ ? .gitignore                 # Git ignore
┣ ? .versionrc                 # Versioning config
┣ ? .commitlintrc              # Commitlint config
┣ ? jest.config.js             # Jest config
┣ ? jest.setup.js              # Jest setup
┣ ? LICENSE                    # License of the project
┣ ? next-env.d.ts              # Next.js types to TypeScript
┣ ? next.config.js             # Next.js config
┣ ? .prettierrc                # Prettier config
┣ ? README.md                  # Main README
┣ ? renovate.json              # Renovate Bot config **
┣ ? tsconfig.json              # TypeScript config