UILibHubは、React、Vue、そしてミニプログラム用のコンポーネントライブラリに関する高品質なリソースの収集と共有に特化したサイトです。UILibHubは、最新かつ最も包括的なコンポーネントライブラリの推奨を提供し、開発者が現代的なアプリケーションを効率的に構築するのを支援します。このウェブサイトは、David DahanのオープンソースプロジェクトUI Libsを基に開発されており、ここに感謝の意を表します。UI Libsに対して主に以下の改良を加えています:
- ライブラリ収録範囲の拡大:React、モバイル、ミニプログラム関連のUIライブラリを新たに追加し、現在30以上の高品質UIライブラリを収録しています。
- 多言語サポート:現在、中国語と英語の2言語をサポートしており、将来的にはさらに多くの言語をサポートする予定です。
- 利用可能なコンポーネント統計パネルの削除。理由は2つあります:
- 実際の開発では、コンポーネントの選択は、テーマの見た目、フォームサポートの有無、モバイル対応の有無などのフィルター項目に基づいて考慮する方が良く、コンポーネントAがライブラリAにあってBにないといったことにこだわる必要はありません。
- 利用可能なコンポーネント統計パネルのデータメンテナンスが困難です。
- ページネーション機能:大量のデータをブラウジングする際の体験を向上させます。
- 詳細ページの改善:ライブラリの詳細ページを新設し、機能紹介、コンポーネントプレビュー、関連リンクなどを含めました。
主要機能によるコンポーネントのフィルタリングでは、以下のオプションを提供しています:
- React:Reactで使用可能なコンポーネントライブラリ。
- Vue:Vueで使用可能なコンポーネントライブラリ。
- Mini Program ミニプログラム:ミニプログラム用のコンポーネントライブラリ。
- Mobile モバイル:モバイルフレンドリーなコンポーネントライブラリ。
- Tailwind CSS:Tailwind CSSで書かれ、Tailwind CSSでカスタマイズ可能なライブラリ。
- Styled スタイル付き:固定スタイルを持つスタイル付きコンポーネント。通常、これらのスタイルを上書きしてカスタマイズできます。
- Unstyled スタイルなし:スタイルのないコンポーネント。スタイルは自分で書く必要があります。
- Imported インポート:コンポーネントを使用するには依存関係をインストールする必要があります(コードはnode_modules内)。ライブラリの更新が容易ですが、コードは自分のものではないため、コンポーネントコードを変更できません。
- Pasted 貼り付け:外部ライブラリに依存しません(コードはnode_modulesにありません)。コンポーネントコードをプロジェクトにコピー&ペーストする必要があります。ペーストした後はそのコードは自分のものとなり、自由にカスタマイズできます。ただし、NPM経由での更新はできません。
- Components コンポーネント:ロジックとスタイルを提供します(スタイルなしコンポーネントの場合はロジックのみ)。Vue/Reactフレームワークと密接に結合しています。
- CSS only CSSのみ:自分のコンポーネントに注入するCSSクラスのみを提供します。UIライブラリはロジックを提供しませんが、任意のフレームワークで使用できます。
- Free 無料:すべてのコンポーネントが完全に無料のUIライブラリ。
その他の二次的な機能によるフィルタリングでは、以下のオプションを提供しています:
- Fully Accessible 完全アクセシビリティ:すべてのコンポーネントが完全なアクセシビリティを考慮しています。
- Built-in Themes 内蔵テーマ:すぐに使用できる異なるテーマを提供します。
- Theme Generator テーマジェネレーター:開発者が簡単に新しいテーマを生成できるツールを提供します。
- Dark Mode ダークモード:明るいバージョンと暗いバージョンの両方をサポートするコンポーネントデザイン。
- Semantic Colors セマンティックカラー:色が「primary」「secondary」などの特定の意味と関連付けられています。
- Figma files Figmaファイル:Figmaは主要なデザインツールです。FigmaファイルにはUIライブラリと同じコンポーネントが含まれており、コーディングスキルがなくてもデザイナーがデザインを作成できます。
- Official 公式:フレームワーク自体を管理するチームによって作成されたもの。
- Public Roadmap 公開ロードマップ:ライブラリの次の機能を確認できる公開ロードマップを提供しています。
- RTL support RTLサポート:右から左へのテキスト表示(アラビア語、ヘブライ語など)をサポートしています。
- Fully Typed 完全型付け:提供されるコンポーネントはすべて型付けされており、開発者の自動補完を支援し、潜在的なエラーを回避します。
- Form Helpers フォームヘルパー:フォーム管理ライブラリ(Vee-Validate、Zod、Yupなど)との統合のためのツールや例を提供します。
コンポーネント数、GitHubのスター数、NPMの週間ダウンロード数によるフィルタリングが可能です。
UILibHubへのコンテンツ貢献を歓迎します!以下のことができます:
- UIライブラリの推奨または自薦
- 本サイトに収録されているUIライブラリを使用したウェブサイトの提出(UIライブラリの例として表示)
プロジェクトの提出については提出ガイドラインを参照してください。
Q:UILibHubのデータ更新頻度は?
A: GitHubのスター数とNPMの週間ダウンロード数は毎月1日に更新され、コンポーネント数は3ヶ月ごとに更新されます。
Xで私に連絡できます(Twitter): https://x.com/luobogooooo
このプロジェクトがあなたの役に立つなら、コーヒーをおごってください。