Skip to content

Latest commit

 

History

History
114 lines (76 loc) · 8.51 KB

CONTRIBUTING.ja.md

File metadata and controls

114 lines (76 loc) · 8.51 KB
Raw

English | 日本語

Yamada UIへの貢献に興味をもってくれて、ありがとうございます😎 あなたは素晴らしいです！！！

オープンソースへの貢献は、いくつかの方法で行うことができ、すべてが価値あるものです。これらは、あなたが貢献を準備する際に役立つガイドラインです。

セットアップ

以下の手順で、Yamada UIへの貢献を始められるようになります。

  1. リポジトリをフォークします。

  2. あなたのローカルにクローンします。

git clone https://github.com/<your_github_username>/yamada-ui.git

cd yamada-ui
  1. pnpm installを実行して、すべての依存関係とパッケージをセットアップします。このコマンドは、依存関係をインストールします。

開発手段

開発プロセスを快適するために、ツールとシステムを用意しています。Yamada UIはモノレポ構造であり、各コンポーネントは独立したパッケージです。

ツール

  • PNPM パッケージと依存関係の管理
  • Tsup パッケージのバンドル
  • Storybook コンポーネントの迅速な開発とテスト
  • Testing Library コンポーネントとフックのテスト
  • Changeset 変更のドキュメンテーション・ログの生成、リリースの管理
  • Next.js ドキュメントサイトのフレームワーク
  • Contentlayer ドキュメントサイトのコンテンツの管理

コマンド

  • pnpm install: すべての依存関係とパッケージをセットアップし、モノレポ開発のためにすべての依存関係をシンボリックリンクします。
  • pnpm storybook: storybookサーバーを起動し、ストーリーを読み込みます。
  • pnpm build: すべてのコンポーネント・フックのパッケージに対してビルドを実行します。
  • pnpm test: すべてのコンポーネント・フックのパッケージに対してテストを実行します。
  • pnpm gen:component: Plopを使用して、テンプレートからコンポーネントのパッケージを作成します。
    • パッケージ名とコンポーネント名はケバブケースで入力してください。
    • providerがtrueの場合、が使用するスタイルを含むプロバイダでラップされます。
    • プロバイダーがtrueの場合、スタイルプロバイダーはchildrenをラップします。
  • pnpm gen:hook: Plopを使用して、テンプレートからフックのパッケージを作成します。
    • パッケージ名とカスタムフック名はケバブケースで入力してください。
  • pnpm gen:tokens: テーマのトークンを生成します。

バグを見つけたと思いますか？

テンプレートに従って、提供してください。

新規または変更のAPIを提案しますか？

設計とサンプルAPIコードを提供してください。ロードマップに合わない提案や、説明がない提案はクローズします。

プルリクエストを作成しますか？

コミット規約

プルリクエストを作成する前に、あなたのコミットがこのリポジトリで使用されているコミット規約に準拠しているかどうかを確認してください。

コミットを作成する際は、次のカテゴリのいずれかを使用しながら、コミットメッセージで規約カテゴリ: あなたのコミットメッセージに従うことをお願いします。

  • feat / feature: 完全に新しいコードや新機能を導入した場合
  • fix: バグを修正した変更の場合（可能であれば、詳細も記述する）
  • refactor: fixでもfeat / featureでもない、コード関連の変更をした場合
  • docs: 既存のドキュメンテーションの変更や新しいドキュメンテーションを作成した場合（例：READMEやJSDocを記述）
  • build: ビルドに関する変更、依存関係の変更、新しい依存関係の追加をした場合
  • test: テストに関する変更をした場合（新しいテストの追加や既存のテストの変更）
  • ci: 継続的インテグレーションの設定に関する変更をした場合（例：github actions、CIシステムなど）
  • chore: 上記のいずれにも当てはまらないリポジトリへの変更をした場合

Tip

詳しい仕様については、Conventional Commitsを確認するか、Angular Commit Message Guidelinesを確認してください。

プルリクエストの手順

  1. リポジトリをフォークし、クローンします。

  2. mainブランチから新しいブランチを作成します。[タイプ/スコープ]という命名規則に従います。例えば、fix/accordion-hookやdocs/menu-typoなどです。タイプはdocs、fix、feat、buildなどの標準的なコミットタイプのいずれかです。スコープは作業範囲を表す短い言葉です。

  3. 変更を行ったら、その変更のテストコードを追加してください。pnpm testまたはpnpm test <package-name>を実行して、すべてのテストが合格することを確認してください。更なるテストの情報はテストのためのヒントを確認してください。

  4. pnpm changesetを実行して、変更の詳細な説明を作成します。これは、更新を公開する際にチェンジログを生成するために使用されます。 Changesetについてさらに学ぶ

  5. また、jsxのスニペットをchangesetに提供する場合、スニペットの始まりで以下のようにしてライブプレビューをオフにしてください。 ```jsx live=false

Note

CIの設定やPrettierなどの小さな変更を行った場合は、pnpm changeset add --emptyを実行して、空のchangesetファイルを生成し、変更を文書化することができます。

  1. 次に、コミット規約に従ってコミットします。

    • 変更の確認: コマンドのpnpm storybookを実行すると、Storybookが起動します。Storybookのソースは、./storiesです。
    • 新しいコンポーネントの作成: コマンドのpnpm gen:componentを実行すると、テンプレートからコンポーネントを作成し、依存関係もインストールします。
    • 既存のコンポーネントに機能を追加: 追加後は、機能が分かるように対象のコンポーネントのストーリーを追加してください。
    • 新しいフックの作成: コマンドのpnpm gen:hookを実行すると、テンプレートからフックを作成し、依存関係もインストールします。
    • 既存のフックに機能を追加: 追加後は、機能が分かるように対象のフックのストーリーを追加してください。

  2. 上記の全てのタスクを完了したら、変更をプッシュしてください。プッシュ後、プルリクエストのURLが生成されます。テンプレートに従ってリクエストを提出してください。また、プルリクエスト内のチェックを確認し、品質チェックが正常に完了していることを確認してください。問題がある場合、このプルリクエストはマージされません。

ライセンス

Yamada UIのGitHubリポジトリにコードを寄贈することで、あなたの寄贈するコードはMITライセンスの下でライセンス付けされることに同意します。

最後まで読んでくださり、ありがとうございます。私もあなたを愛しています。 💖