mcpField
M
mantis-react-admin

mantis-react-admin

github.com/rebyteai-template開発1783 回インストール19 週間前に更新
リポジトリ

mantis-react-admin について

Material UI v7、React 19、Vite 7、MUI X Chartsを採用したReact管理ダッシュボードのテンプレートです。既存のフロントエンド基盤から管理画面を構築する開発者向けです。

主な機能

  1. 01React 19とVite 7
  2. 02Material UI v7コンポーネント
  3. 03MUI X Chartsの可視化
  4. 04React Router v7のルーティング
  5. 05SWRによるデータ取得

活用シーン

  1. 01管理画面のフロントエンドを開始
  2. 02チャート付き管理ダッシュボードの構築
  3. 03React Routerによるページ遷移の設定

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/rebyteai-template/rebyte-skills --skill mantis-react-admin

インストール後、Claude Code で/mantis-react-adminを入力して読み込まれたか確認します。

詳細

Mantis React Admin

Material UI v7、React 19、Vite 7、MUI X Charts を使用した無料の React 管理ダッシュボードです。

技術スタック

  • フレームワーク：React 19
  • ビルドツール：Vite 7
  • UI ライブラリ：Material UI v7、MUI X Charts
  • スタイリング：Emotion CSS-in-JS
  • ルーティング：React Router v7
  • 状態管理：データ取得に SWR を使用
  • パッケージマネージャー：yarn
  • 出力先：dist ディレクトリ
  • 開発ポート：5173

セットアップ

1. テンプレートをクローンする
git clone --depth 1 https://github.com/Eng0AI/mantis-react-admin-template.git .

ディレクトリが空でない場合：

git clone --depth 1 https://github.com/Eng0AI/mantis-react-admin-template.git _temp_template
mv _temp_template/* _temp_template/.* . 2>/dev/null || true
rm -rf _temp_template
2. Git 履歴を削除する（任意）
rm -rf .git
git init
3. 依存関係をインストールする
yarn install

ビルド

yarn build

デプロイ

Vercel（推奨）
vercel pull --yes -t $VERCEL_TOKEN
vercel build --prod -t $VERCEL_TOKEN
vercel deploy --prebuilt --prod --yes -t $VERCEL_TOKEN
Netlify
netlify deploy --prod --dir=dist

開発

yarn start

http://localhost:5173 で開きます

リント

yarn lint        # Check for issues
yarn lint:fix    # Auto-fix issues
yarn prettier    # Format code

コメント

Markdown 対応