zenui-library-react

ZenUI Library Reactは、ReactとTailwind CSSで構築された無料のオープンソースUIコンポーネントライブラリです。フロントエンド開発を加速させるための、軽量でカスタマイズ可能なリソースとして位置付けられています。READMEによると、本ライブラリはパフォーマンスに最適化されており、統合が容易で依存関係はありません。利用方法は「プラグアンドプレイ」形式であり、パッケージとしてインストールするのではなく、コンポーネントをコピー＆ペーストして使用します。 READMEに記載されている内容： コンポーネント - 800以上のコンポーネント - 20以上の構築済みテンプレート - ウェブサイトブロック - Eコマースキット アニメーション - 100以上のアニメーションコンポーネント ツール - 500以上のカスタマイズ可能なアイコン - カラー不透明度パレット - アップロードした画像から色を抽出する機能（カラーピッカー） - HTMLセマンティックタグマスター - キーボードショートカット機能ジェネレーター（shortKey） - Tailwind v3用設定ジェネレーター リソース - 118以上のプログラミングリソース また、ウェブサイトテンプレートのギャラリーや、クリエイターがReact、Next.js、またはTailwind CSSのテンプレートをZenUI Libraryで販売できるプログラムについても言及されており、販売ごとに80%の手数料が支払われることと、別途提出ガイドがあることが記載されています。 ローカル開発のためのインストール リポジトリをクローンし、プロジェクトディレクトリに移動して「npm install」で依存関係をインストールし、「npm run dev」で起動します。 ドキュメントと使用方法 ZenUIコンポーネントはオンラインのZenUIライブラリでドキュメント化されています。ワークフローは、コンポーネントを探し、コードスニペットをコピーして、HTMLまたはJSXマークアップが受け入れられる任意の場所に貼り付けるという流れです。基本的な使用に必須の設定ステップはありません。各コンポーネントはTailwind CSSクラスで構築されているため、例えばボタンはパディング、背景色、テキスト色、角丸、ホバー状態などのユーティリティクラスのみで定義されており、propsなしで動作します。スタイリングはクラスベースであるため、クラスリストの値を入れ替えて背景色を変更したり、パディングを調整したり、境界線の半径を大きくしたりすることでカスタマイズします。シャドウやトランジションなどの効果には、追加のTailwindユーティリティを適用できます。 READMEで推奨されるベストプラクティス カスタマイズする前にデフォルトのコンポーネントから始めて動作を理解すること、CSSを書き直すのではなくTailwindのユーティリティファーストのアプローチに従うこと、およびメンテナンスを容易にするために標準コンポーネントに加えた変更のメモを保持することが推奨されています。 プロジェクトとコミュニティ - ライセンス: MIT - 貢献: コミュニティからの貢献を歓迎しており、リポジトリにCONTRIBUTING.mdファイルがあります - テンプレート販売: ガイドライン、提出手順、収益に関する情報はTEMPLATE_SUBMISSION_GUIDE.mdに記載されています - リンク: ウェブサイト（react-ui.zenui.net）、およびX (Twitter)、LinkedIn、Facebook、Discordチャンネル - サポート: Ko-fiへのリンクが提供されています READMEには、ベンチマーク、Tailwind v3設定ジェネレーター以外のパッケージバージョン、またはブラウザサポートの詳細については記載されていません。