ant-design/ant-design-pro

これは何？

主な機能

• 01ダッシュボード、フォーム、一覧、プロフィール、結果ページのテンプレートを用意
• 02React 19、Umi Max 4を基盤とし、Ant Design 6を採用
• 03Tailwind CSS v4とantd-styleによるテーマ設定
• 04i18nと開発用モックデータを標準搭載
• 05ユニットテストとe2eテストのセットアップを同梱
• 061つのコマンドで最小構成に簡素化

ユースケース

• Ant Designを使った社内管理システムやバックオフィスシステムの新規開発
• 一般的なCRUD形式のページを備えた管理ダッシュボードのプロトタイピング
• 本番運用を想定したReactとUmiのプロジェクト構成の学習

クイックスタート

1. 1

   リポジトリをクローンする

   git clone --depth=1 https://github.com/ant-design/ant-design-pro.git myapp
2. 2

   プロジェクトフォルダーに移動する

   cd myapp
3. 3

   依存関係をインストールする

   npm install
4. 4

   開発サーバーを起動する

   npm start

使う前に知っておきたいこと

• !デフォルトで多数のテンプレートページが含まれているため、最小構成にするには元に戻せない `npm run simple` コマンドを実行する必要があります。

トピック

よくある質問

ant-design-pro とは？

Ant Design、Umi Max、TypeScriptを基盤とする、すぐに使えるReact管理画面向けボイラープレート。エンタープライズ向けページテンプレートを備えています。 Ant Design Proは、企業のバックオフィスアプリケーション向けReactスターターキットです。Ant DesignのコンポーネントにUmi MaxフレームワークとTypeScriptを組み合わせており、レイアウトやルーティング、よく使われるページを一から組み立てずに開発を始められます。

ant-design-pro は無料で使えますか？ライセンスは？

ant-design-pro は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

ant-design-pro は今もメンテナンスされていますか？

活発にメンテナンス中。ant-design-pro の最終コミットは 2026年11月4日 です。

ant-design-pro は何に使えますか？

Ant Designを使った社内管理システムやバックオフィスシステムの新規開発 一般的なCRUD形式のページを備えた管理ダッシュボードのプロトタイピング 本番運用を想定したReactとUmiのプロジェクト構成の学習

ant-design-pro のインストール方法は？

リポジトリをクローンする: git clone --depth=1 https://github.com/ant-design/ant-design-pro.git myapp プロジェクトフォルダーに移動する: cd myapp 依存関係をインストールする: npm install 開発サーバーを起動する: npm start

ant-design-pro はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/ant-design/ant-design-pro