プルリクエストの作成方法
この手順では、コアのReact Nativeリポジトリに貢献するためにマシンをセットアップし、最初のプルリクエストを作成するまでのステップバイステップのプロセスを説明します。
プロローグ：準備
React Nativeのビルドと開発を行うためには、いくつかのツールと依存関係が必要です。これらは環境構築ガイドの「ネイティブコードを含むプロジェクトのビルド」セクションで説明されています。
あなたのプルリクエストを受け入れるために、コントリビューターライセンス契約（CLA）を提出していただく必要があります。これは、Metaのオープンソースプロジェクトのいずれかで作業するために一度だけ行う必要があります。数分で完了するので、依存関係のインストールを待っている間に済ませてしまいましょう。
第I章：オープンソースへようこそ
1. gitのインストール
React NativeのソースコードはGitHubでホストされています。gitコマンドラインプログラムを通じてgitバージョン管理システムを操作できます。GitHubの手順に従って、マシンにgitをセットアップすることをお勧めします。
2. ソースコードの取得
GitHubでReact Nativeのソースコードを閲覧することもできますが、ローカルマシンにフォークをセットアップすることをお勧めします。
- https://github.com/facebook/react-native にアクセスしてください。
- 右上の「Fork」ボタンをクリックします。
- 尋ねられたら、このフォークのホストとしてあなたのユーザー名を選択します。
これで、GitHub上に https://github.com/your_username/react-native というReact Nativeのフォークが作成されます。次に、ローカルマシン用のソースコードのコピーを取得します。シェルを開き、以下のコマンドを入力します。
git clone https://github.com/facebook/react-native.git
cd react-native
git remote add fork https://github.com/your_username/react-native.git
上記の手順が初めての方は、恐れないでください。macOSとLinuxではターミナルアプリケーション、WindowsではPowerShellからシェルにアクセスできます。
新しいreact-nativeディレクトリが作成され、コアのReact Nativeリポジトリのコンテンツが含まれます。このディレクトリは、実際にはReact Nativeのgitリポジトリのクローンです。以下の2つのリモートが設定されています。
originは上流の https://github.com/facebook/react-native リポジトリ用forkはあなた自身のGitHubアカウントにあるReact Nativeのフォーク用
3. ブランチの作成
変更を追跡するために、フォークに新しいブランチを作成することをお勧めします。
git checkout --branch my_feature_branch --track origin/main
第II章：変更の実装
1. 依存関係のインストール
React NativeはYarn Workspaces (Yarn Classic)で管理されているJavaScriptのモノレポです。
プロジェクトレベルでインストールを実行します。
yarn
また、react-native-codegenパッケージを一度ビルドする必要があります。
yarn --cwd packages/react-native-codegen build
2. コードの変更
これで、お好みのコードエディタでプロジェクトを開くことができます。Visual Studio CodeはJavaScript開発者に人気があり、React Nativeの一般的な変更を行う場合にお勧めです。
IDEのプロジェクト設定
- VS Code:
react-native.code-workspaceファイルを開きます。これにより、拡張機能の推奨が表示され、Flow Language Serviceやその他のエディタ設定が正しく構成されるはずです。 - Android Studio: リポジトリのルートフォルダ（
.idea設定ディレクトリを含む）を開きます。 - Xcode:
packages/rn-tester/RNTesterPods.xcworkspaceを開きます。
3. 変更の実行
rn-testerパッケージを使用して、変更を実行し検証することができます。詳細はRNTester readmeで学ぶことができます。
4. 変更のテスト
変更が正しく、テストの失敗を引き起こさないことを確認してください。詳細はテストの実行と記述で学ぶことができます。
5. コードのリンティング
コアのReact Nativeリポジトリで使用されている各言語のスタイルに慣れるまでには時間がかかることを理解しています。開発者は細かいことを気にする必要はないはずなので、可能な限り、規約に従ってコードを書き換えるプロセスを自動化するツールを使用しています。
たとえば、JavaScriptコードのフォーマットにはPrettierを使用しています。これにより、エディタ統合を通じてPrettierにフォーマットの問題を自動的に修正させるか、手動でyarn run prettierを実行することで、時間と労力を節約できます。
また、コードに存在する可能性のあるスタイリングの問題を検出するためにリンターを使用しています。yarn run lintを実行することで、コードスタイリングの状態を確認できます。
コーディング規約についてさらに学ぶには、コーディングスタイルガイドを参照してください。
6. 変更の確認
多くの人気のあるエディタは、何らかの形でソース管理と統合されています。また、コマンドラインでgit statusとgit diffを使用して、何が変更されたかを追跡することもできます。
第III章：変更の提案
1. 変更のコミット
gitを使用して、変更をバージョン管理に追加してください。
git add <filename>
git commit -m <message>
コミットメッセージとして、短く説明的な文を使用できます。
良いgitコミットメッセージを書くことについて心配ですか？ 心配しないでください。後でプルリクエストがマージされると、すべてのコミットが1つのコミットにまとめられます。このまとめられたコミットのメッセージには、あなたのプルリクエストの説明が使用されます。
このガイドは、最初の貢献に役立つ十分な情報をカバーしています。GitHubには、gitを始めるのに役立ついくつかのリソースがあります。
2. 変更をGitHubにプッシュする
変更がバージョン管理にコミットされたら、それらをGitHubにプッシュできます。
git push fork <my_feature_branch>
すべてがうまくいけば、プルリクエストを開くことを促すメッセージが表示されます。
remote:
remote: Create a pull request for 'your_feature_branch' on GitHub by visiting:
remote: https://github.com/your_username/react-native/pull/new/your_feature_branch
remote:
次のステップに進むには、提供されたURLにアクセスしてください。
3. プルリクエストの作成
もうすぐです！ 次のステップはプルリクエストを記入することです。長すぎない説明的なタイトルを使用してください。次に、デフォルトのプルリクエストテンプレートで提供されているすべてのフィールドを必ず記入してください。
- Summary: このフィールドを使用して、このプルリクエストを送信する動機を説明してください。何を修正していますか？
- Changelog: プルリクエストがマージされた場合に何が変更されるかの短い説明を提供することで、リリースメンテナーがリリースノートを書くのを助けます。
- Test Plan: レビュアーに、どのように変更をテストしたかを知らせてください。エッジケースを考慮しましたか？ 変更が望ましい効果をもたらすことを確認するために、どのような手順に従いましたか？ 詳細はテスト計画とは何か？をご覧ください。
4. レビューとフィードバックへの対応
GitHubのプルリクエストに残されたコメントやレビューフィードバックに注意してください。メンテナーは、あなたの変更がコアのReact Nativeリポジトリにマージされる準備が整うように、建設的で実行可能なフィードバックを提供するために最善を尽くします。