Awesome Ant Design

Ant Designを扱う資料や関連プロジェクトをまとめたAwesomeリストです。

リソース

Ant Designの公式プロジェクトとリソースです。

Ant Design - エンタープライズクラスのUI設計言語とReactベースの実装
Ant Design Pro - 企業向けアプリケーション向けの標準搭載UIソリューション。 :fire: :fire: :fire:
Ant Design Mobile - カスタマイズ可能なモバイルUI仕様とReactベースの実装
Ant Design of React - Reactに基づいた即時利用可能なスムーズなUIコンポーネント
Ant Design SVG Icons - 通常のアイコンフォントをSVGフォーマットに変換するプロジェクト、Ant Designのアイコンフォントをサポート

記事

ツール

Ant Designを使ったアプリ構築を支援するツールとユーティリティです。

Antd Init - Ant Designのボイラープレート生成ツール（デモ用のみ、dva-cliを使用）
Dva Cli - Dva.jsに基づくAnt Designプロジェクトを作成します。 Dva.jsはReduxとReactを基盤とし、ElmとChooに着想を得た軽量フロントエンドフレームワークです。
Antd Tools - Ant Design用の非常に有用なツール一覧：ドキュメンテーション作成、新コンポーネント作成、ビルドツールなど
Antd Tools Docs - Ant Toolsのドキュメンテーション
iConfig Ant Design - 有用な変換を用いて、新しいプロジェクトを迅速に立ち上げるためのボイラープレート
vscode-antd-rush - VS CodeでのAnt Designへの迅速な導入
Antd Snippets for VS Code
Generator Antd Pro - Ant Design Proアプリケーションを簡単に構築する方法
formik-antd - 人気のフォームステート管理ライブラリFormik向けの宣言型バインディング
Zaku - JSXベースのUIエディタ、ページを作成し、AntDコードを生成するための簡単な方法
Antd-Pro-Generator for VS Code Swagger2.0またはOpenApi3.xドキュメントからサービス/モック/モデルを生成するためのAnt Design Pro用ツール
Ruyi Design Assistant Ruyi Design Assistant は、Figma でのデザインにおいて、React コンポーネントライブラリ（AntDesign）およびデザイントークンを効率的に活用し、生産レベルのコンポーネントコードを簡単に取得できるようにします。

テーマ設定

テーマのカスタマイズやブラウザー上での切り替えを支援するユーティリティです。

antd-theme-webpack-plugin - カスタムテーマファイルを生成するwebpackプラグインです。
antd-theme-generator - 環境に応じて使用できるテーマに特化した Less ファイルを生成するシンプルなスクリプト。
dynamic-antd-theme - Less または CSS で使用できる Ant Design のテーマを動的に変更するためのシンプルなプラグイン。
storybook-addon-customize-antd-theme - Storybook のアドオンで、Ant Design のテーマを視覚的にカスタマイズできます。

テーマ

ant-design-dark-theme - Ant Design のダークテーマ変数。
ant-design-aliyun-theme - Aliyun コンソールのテーマ変数（Ant Design）。
ant-dark-theme - Ant Design のダークテーマ変数。

Angular

AngularとAnt Designで構築されたプロジェクトです。

NG-ZORRO - Angular での Ant Design。
NG-ZORRO-Mobile - Angular向けのAnt Design Mobile。
ng-alain - ng-zorro-antdの管理パネルフロントエンドフレームワーク

Vue.js

Vue.jsとAnt Designで構築されたプロジェクトです。

ant-design-vue - Vue.js 2.5.0以降のAnt Design
Vue.js Beauty - Vue.jsとAnt Designで構築された美しいUIコンポーネント
Vue.js Ant UI - Vue.jsで構築されたAnt DesignのUIコンポーネント
Ant Design Vue - Vue.js版のAnt Design
antue - 完全にAnt Design規格に従ったエンタープライズ向けVue UIコンポーネントセット
vue-antd-admin - Ant Design ProのVue実装

Blazor

Blazor WebAssemblyとAnt Designで構築されたプロジェクトです。

ant-design-blazor - Blazor（サーバーサイドおよびWebAssembly）用のAnt Design
Blazorise - BlazoriseおよびBlazorにAntDesignをサポートする Demo

コンポーネント

Ant Designで構築されたUIコンポーネントの一覧です。

antd-group-slider - 複数の範囲と説明を含むデータ入力用スライダーのグループ。スライダー間のデータ同期によりUXを向上させ、範囲データ入力時に誤った範囲の欠落を回避
antd-table-infinity - ant designテーブルに基づく無限スクロールコンポーネント。仮想スクロールと高性能をサポート
react-lz-editor - draft-Jsおよびant designに基づくオープンソースの豊かなReactエディタ
React Grid [廃止] - Ant Designに基づくグリッドReact UIコンポーネント
Antd Kit - 高度なAnt Designコンポーネント
antd-data-table - Ant DesignのTableとFormを組み合わせたコンポーネントで、データの検索、表示、操作を行うもの。
ngx-recursive-form - Ant DesignをベースにしたJSON入力に基づくAngularの再帰形式。
antd-amplify-react - AWS Amplify用の認証向けAnt Designコンポーネントのコレクション。
antd-password-input-strength - AntDの入力コンポーネントにパスワード強度表示機能を備えたもの。
antd-amiya - ページレベルのコンポーネントで、テーブルとフォームを用いたもの。
antd-phone-input - Ant Design向けの高度で高度にカスタマイズ可能な電話番号入力コンポーネント。

React Hooks

Sunflower(🌻) React Hooksで返されるAntDコンポーネントのコレクション。
use-antd-resizable-header - React HookでAnt Designのテーブルヘッダーをリサイズできるようにするもの。

アプリケーション

Ant Designで構築された成熟したアプリケーションの一覧です。

Eevee - GitHubのオンライン編集ブログプラットフォームに基づくプロジェクト。React、Ant Design、GitHub APIをベースにしている。
Productivity Application - Kanbanスタイル、Trelloをインスピレーションに受けて開発されたプロダクティビティアプリケーション。React、Ant Design、その他素晴らしいモジュールを使用。
IDURAR ERP/CRM - IDURARは、Mernスタック（Node.js / Express.js / MongoDb / React.js）に基づくオープンソースERP/CRM（請求書 / 在庫 / 会計 / HR）で、Ant Design（AntD）とReduxを使用。

ボイラープレート

Ant Designで構築されたスタータープロジェクトとボイラープレートの一覧です。

Ant Design Pro - 企業向けアプリケーション向けの標準搭載UIソリューション。 :fire: :fire: :fire:
Scaffold Market - Ant Designを用いたスケルトンとボイラープレートのコレクション。
Antd Admin - Ant DesignとDva.jsをベースにした管理ダッシュボードアプリケーションのデモ。
Meteor Antd Boilerplate - AntdとMeteorを用いて構築された基本的なソーシャルネットワーク。 Example
React SPA - React、Router、ES6、Fetch、Babel、Webpack、Npm、MockJs、FontAwesome、AnimateCSS、Ant Design、LESS および jQuery を使用した SPA の構築
React Redux - Ant Design を使用した CMS／エンタープライズクラスアプリ（ERP／Admin）向け React Redux
React Antd Starter - Ant Design と Redux を使用したウェブサイト／ウェブアプリの開発を目的としたプロジェクト
Webbf - Maven を使用して Spring、Spring MVC および Mybatis でバックエンドを構築する Java デモ。React、Reflux、Eebpack、jQuery、React-bootstrap および Ant Design を使用
React Redux Antd Starter - React、Redux および Ant Design を使用したフロントエンドのベースコード
Koa - React、Ant Design および Koa を使用した Admin UI を構築する例アプリ
Star Admin - React、Ant Design、Redux、React-router、Webpack および Babel を使用したデモアプリ
React Redux Intro - Ant Design を使用したデモアプリで、Redux の依存関係を初期化できるように設定可能
React Start Kit - React、Webpack、ES6+、Redux、Router、Babel、Express、Ant Design を使用した SPA ベースコード
CL React - エンタープライズバックオフィスソフトウェア向けの Ant Design フロントエンドフレームワーク構造に基づいたもの
TODO MVC - React および Ant Design を使用したタスク管理リスト
React Boilerplate - Ant Design を使用した React Admin フロントエンドベースコード
Dva Antd Starter - Dva.js と Ant Design を使って始めましょう
Dva Antd Mobile Starter - Dva.js と Ant Design Mobile を使って始めましょう
Dva Ant Admin - Dva、Ant-Design を使用したフロントエンドベースコード
Aspnet Core Antd Boilerplate - アスペル.NETコアを用いたサーバーサイドレンダリング
React Redux Universal - React Router 4とWebPack 2.5+を用いたユニバーサル／同質的なボイラプレート。すべての最新パッケージを含む
CRA-TS-Antd - Create-React-App + TypeScript + Ant-Design（エジェクトなし）
Ng-Alain - Ant Designを基盤とし、ng-zorro-antdを使用するAngular管理UIです。
Typescript React With Mobx Starter - TypeScript、React、MobX、AntDおよびWebPackを用いたスタートテンプレート
React-PWA, PawJS and AntDesign - SEO、PWA、SSR、スケルトン、プレースホルダーなど、多くの機能を備えたプラグイン可能なボイラプレート
Create React App + Ant Design - Create-React-AppでエジェクトせずにAnt-Designを使用
ScaffoldHub.io - MongoDB、SQLまたはFirebase Firestoreを用いたフルスタックReact＋Ant Designアプリケーションの生成
The Green Meal - TypeScriptで書かれたNext.js、PostgreSQLデモアプリ
react-vite-admin - React、Recoil、React Query、React Hooks、TypeScript、Axios

JavaScript以外のライブラリ

JavaScript以外の言語向けに書かれたライブラリの一覧です。

Antizer - Ant Designライブラリ for ClojureScript、それは不変かつ関数型の言語でJavaScriptにクロスコンパイルされる
syn-antd - Ant Designを用いたClojureScriptおよびReagentのラッパー。shadow-cljsを用いており、ツリーシッキングをサポート。他のClojureScriptライブラリと同様にJavaScriptにクロスコンパイルされる

Electron

StarCabinet - React、ElectronおよびAnt Designをベースとした、スター数に基づくクロスプラットフォームツール
Nowa - WebPackをベースとしたフロントエンドプラグインのスケルトングおよび開発ソリューション

アイコン

Official Ant Design Icons
Ant Design Icons - Ant DesignおよびAnt Design Mobileから提供されるプレミアムアイコンフォント
Material Design Icons Ant Design 用 Material Design Icons

デザインツールとリソース

Kitchen - スケッチプラグイン。デザイナーをサポートする機能のセット
Ant Design Library - Ant Design Axure ライブラリ
Ant UX - OG、スケッチ、Axure、Affinity、Adobe XD でのUX設計用のサイトマップテンプレート
Ant Design Design Resources - スケッチシンボル

その他

Ant Design of Ember - Ant Design と Emberjs をベースにしたエンタープライズクラスUIフレームワーク
Fable Ant Design - Fable Elmish 用の Ant Design バインディング

貢献

貢献はいつでも歓迎します。ガイドラインはこちらです。

ライセンス

この作品はCreative Commons Attribution 4.0 International Licenseの下で提供されています。