React Router への貢献

貢献ありがとうございます!あなたは最高です!

オープンソースでは、さまざまな種類の貢献が可能です。すべてが価値のあるものです。貢献を準備する際に役立つ、いくつかのガイドラインを紹介します。

セットアップ

コードベースに貢献するには、まずリポジトリをフォークする必要があります。これは、どのような種類の貢献をするかによって、少し異なるものになります。

  • 新しい機能、バグ修正、または**react-routerコードに影響を与えるもの**はすべて、devブランチから分岐し、devブランチにマージする必要があります。
  • ドキュメントのみを変更する場合は、mainブランチから分岐し、mainブランチにマージすることができます。

次の手順で、このリポジトリへの変更を貢献できるようになります。

  1. リポジトリをフォークする(このページの右上にあるForkボタンをクリックする)。
  2. フォークをローカルにクローンする
# ターミナルで、クローンを保存したい親ディレクトリに移動し、次に
git clone https://github.com/<あなたのGitHubユーザー>/react-router.git
cd react-router
 
# *コードを変更する*場合は、必ず`dev`ブランチをチェックアウトしてください。
git checkout dev
  1. 依存関係をインストールしてビルドします。React Router はpnpmを使用しているので、あなたも使用する必要があります。npmでインストールすると、不要なpackage-lock.jsonファイルが生成されます。

バグを見つけた?

問題テンプレートに従い、コード例を使用して再現への明確なパスを提供してください。最も良いのは、失敗するテストを含むプルリクエストです。次善は、CodeSandboxまたはバグを説明するリポジトリへのリンクです。

例を追加しますか?

例は、メインブランチに直接追加できます。ローカルにクローンしたmainからブランチを作成します。完了したら、プルリクエストを作成して、あなたの例について説明してください。

新しいAPIまたは変更されたAPIを提案しますか?

思慮深いコメントと、アプリでReact Routerを使用したい方法を示すサンプルコードを提供してください。現在のAPIによってどのように制限されているかを示してから、変更または追加が必要なものについて結論を出すと、会話がスムーズに進みます。

私たちは経験から、小さなAPIの方が通常良いことを学んでいるので、現在のAPIに明らかな制限がない限り、新しいものを追加することに少し抵抗があります。とはいえ、私たちはこれまで考えたことのないケースについて常に知りたいと思っていますので、遠慮しないでください! :)

問題が注目されていない?

バグを修正する必要があるのに誰も修正していない場合は、修正を提供してプルリクエストを作成することが最善です。オープンソースコードは私たち全員のものであり、それを前進させるのは私たち全員の責任です。

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

プルリクエストは、マージされるためには2人以上の共同作業者からの承認が必要です。プルリクエストの作成者が共同作業者である場合、それは1人としてカウントされます。

GitHubでプルリクエストを作成する際には、ベースを正しいブランチに設定してください。コードに触れるプルリクエストを送信する場合は、devブランチにする必要があります。GitHubでプルリクエストを作成する際に、"Compare changes"ヘッダーの下にあるドロップダウンでベースを設定します。

テスト

バグを修正したり、機能を追加したりするすべてのコミットにはテストが必要です。

<blink>テストがないコードをマージしないでください!</blink>

ドキュメント+例

APIを変更または追加するすべてのコミットは、関連するすべての例とドキュメントを更新するプルリクエストで行う必要があります。

開発

パッケージ

React Router は、複数のパッケージのコードをホストするために、モノレポを使用しています。これらのパッケージは、packagesディレクトリにあります。

私たちはpnpm workspacesを使用して、依存関係のインストールとさまざまなスクリプトの実行を管理しています。すべてをインストールするには、pnpmをインストールし、リポジトリのルートからpnpm installを実行してください。

ビルド

ルートディレクトリからpnpm buildを実行すると、ビルドが実行されます。これは数秒で完了します。個々のパッケージはお互いに依存しているため、すべてのパッケージを一緒にビルドすることが重要です。

テスト

テストを実行する前に、ビルドを実行する必要があります。ビルド後、ルートディレクトリからpnpm testを実行すると、すべてのパッケージのテストが実行されます。特定のパッケージのテストを実行したい場合は、pnpm test --projects packages/<パッケージ名>を使用します。

# すべてのパッケージをテストする
pnpm test
 
# react-router-domのみをテストする
pnpm test --projects packages/react-router-dom

リポジトリの分岐

このリポジトリでは、さまざまな目的のために、別々のブランチが維持されています。次のようになります。

- main   > 最新のリリースと現在のドキュメント
- dev    > 安定リリース間の、アクティブな開発中のコード
- v5     > 特定のメジャーリリースの最新のコード

さまざまな機能や実験のために、他のブランチが存在する場合がありますが、すべての魔法はこれらのブランチから起こります。

新しいリリース

新しいリリースを行う際には、リリースの種類に応じて、分岐戦略に基づいたプロセスに従います。

react-router@nextリリース

devブランチの現在の状態から、実験的なリリースを作成します。これらは、@nextタグを使用してインストールできます。

pnpm add react-router-dom@next
# または
npm install react-router-dom@next

これらのリリースは、PRがdevブランチにマージされると自動化されます。

最新のメジャーリリース

# devブランチから開始します。
git checkout dev
 
# メインブランチをdevにマージして、すべてのホットフィックスと
# ドキュメントの更新がリリースで利用できるようにします。
git merge main
 
# devから新しいリリースブランチを作成します。
git checkout -b release/v6.1.0
 
# 新しいタグを作成し、コードベース全体でバージョン参照を更新します。
pnpm run version [次のバージョン]
 
# リリースブランチを新しいリリースタグと一緒にプッシュします。
git push origin release/v6.1.0 --follow-tags
 
# GitHub Actionsがすべてのテストを実行するのを待ちます。テストがパスした場合、
# リリースの準備が整いました。リリースブランチをmainとdevにマージします。
git checkout main
git merge release/v6.1.0
git checkout dev
git merge release/v6.1.0
 
# リリースブランチは削除できます。
git branch -D release/v6.1.0
git push origin --delete release/v6.1.0
 
# 今度はGitHubに移動して、新しいタグからリリースを作成します。
# GitHub Actionsがそれ以降を処理します!

ホットフィックスリリース

最新のリリースに影響する重大なバグをすぐに修正する必要がある場合があります。バグが最新のリリースに影響する場合は、main(またはバグが存在する関連するメジャーリリースブランチ)から直接新しいバージョンを作成できます。

# メインブランチから、新しいリリースを作成する前に、
# ビルドとすべてのテストを実行してください。
pnpm install && pnpm build && pnpm test
 
# テストがパスしたと仮定して、リリースタグを作成し、
# コードベース全体でバージョン参照を更新します。
pnpm run version [次のバージョン]
 
# 変更を新しいリリースタグと一緒にプッシュします。
git push origin main --follow-tags
 
# GitHubで、新しいタグからリリースを作成すると、
# GitHub Actionsによって公開されます
 
# ホットフィックスが完了したら、変更をdevにマージして、
# 必要に応じて競合を解消します。
git checkout dev
git merge main
git push origin dev