diff --git a/content/docs/how-to-contribute.md b/content/docs/how-to-contribute.md index 46d5d626a..7632467ca 100644 --- a/content/docs/how-to-contribute.md +++ b/content/docs/how-to-contribute.md @@ -1,6 +1,6 @@ --- id: how-to-contribute -title: How to Contribute +title: 貢献の方法 layout: contributing permalink: docs/how-to-contribute.html next: codebase-overview.html @@ -9,121 +9,121 @@ redirect_from: - "tips/introduction.html" --- -React is one of Facebook's first open source projects that is both under very active development and is also being used to ship code to everybody on [facebook.com](https://www.facebook.com). We're still working out the kinks to make contributing to this project as easy and transparent as possible, but we're not quite there yet. Hopefully this document makes the process for contributing clear and answers some questions that you may have. +React は Facebook の最初のオープンソースプロジェクトの 1 つで現在も非常に活発に開発されており、[facebook.com](https://www.facebook.com) 上のあらゆる人々にコードを届けることにも使用されています。私たちはこのプロジェクトへの貢献をできるだけ簡単かつ透明性の高いものにするために努力していますが、まだ完全ではありません。このドキュメントがプロジェクトへの貢献の手順を明確にし、あなたの持つ疑問を解決できれば幸いです。 -### [Code of Conduct](https://code.facebook.com/codeofconduct) {#code-of-conduct} +### [行動規範](https://code.facebook.com/codeofconduct) {#code-of-conduct} -Facebook has adopted a Code of Conduct that we expect project participants to adhere to. Please read [the full text](https://code.facebook.com/codeofconduct) so that you can understand what actions will and will not be tolerated. +Facebook が採用するプロジェクト参加者に期待する行動規範があります。[全文](https://code.facebook.com/codeofconduct)を読んでください、そうすれば参加者はどのような行動を取ればよいか、またどのような行動が許容されないのか理解できるでしょう。 -### Open Development {#open-development} +### オープンな開発 {#open-development} -All work on React happens directly on [GitHub](https://github.com/facebook/react). Both core team members and external contributors send pull requests which go through the same review process. +React に関する開発作業はすべて [GitHub](https://github.com/facebook/react) 上で直接行われます。コアチームメンバーと外部のコントリビューターの両方が、同じレビュープロセスを経由するプルリクエストを送ります。 -### Branch Organization {#branch-organization} +### ブランチの構成 {#branch-organization} -We will do our best to keep the [`master` branch](https://github.com/facebook/react/tree/master) in good shape, with tests passing at all times. But in order to move fast, we will make API changes that your application might not be compatible with. We recommend that you use [the latest stable version of React](/downloads.html). +私たちは [`master` branch](https://github.com/facebook/react/tree/master) を全てのテストが通るベストな状態に保つために努力しています。しかし素早い開発のため、あなたのアプリケーションと互換性がないかもしれない API の変更を行うことがあります。そのため [最新安定版の React](/downloads.html) を利用することをお勧めします。 -If you send a pull request, please do it against the `master` branch. We maintain stable branches for major versions separately but we don't accept pull requests to them directly. Instead, we cherry-pick non-breaking changes from master to the latest stable major version. +プルリクエストを送信する場合は、`master` ブランチに対して行ってください。私たちはメジャーバージョンの安定版ブランチを別々に管理していますが、それらへのプルリクエストは直接受け付けません。代わりに、master から最新の安定したメジャーバージョンへコードを壊さない cherry-pick を行います。 -### Semantic Versioning {#semantic-versioning} +### セマンティック・バージョニング {#semantic-versioning} -React follows [semantic versioning](https://semver.org/). We release patch versions for bugfixes, minor versions for new features, and major versions for any breaking changes. When we make breaking changes, we also introduce deprecation warnings in a minor version so that our users learn about the upcoming changes and migrate their code in advance. +React は[セマンティック・バージョニング](http://semver.org/)の原則に従います。バグ修正のためのパッチバージョン、新機能のためのマイナーバージョン、そして重大な変更のためのメジャーバージョンをリリースします。私たちが重大な変更を加えるとき、ユーザーが今後の変更について前もって知り、コードを移行するために、私たちはマイナーバージョンで非推奨警告を行います。 -We tag every pull request with a label marking whether the change should go in the next [patch](https://github.com/facebook/react/pulls?q=is:open+is:pr+label:semver-patch), [minor](https://github.com/facebook/react/pulls?q=is:open+is:pr+label:semver-minor), or a [major](https://github.com/facebook/react/pulls?q=is:open+is:pr+label:semver-major) version. We release new patch versions every few weeks, minor versions every few months, and major versions one or two times a year. +私たちは全てのプルリクエストにラベルを付けます。ラベルは、行われる変更が[パッチ](https://github.com/facebook/react/pulls?q=is:open+is:pr+label:semver-patch)、[マイナー](https://github.com/facebook/react/pulls?q=is:open+is:pr+label:semver-minor)、[メジャー](https://github.com/facebook/react/pulls?q=is:open+is:pr+label:semver-major) バージョンのどれに該当するかによって決まります。数週間ごとにパッチバージョン、数ヶ月ごとにマイナーバージョン、そして年に 1、2 回メジャーバージョンをリリースします。 -Every significant change is documented in the [changelog file](https://github.com/facebook/react/blob/master/CHANGELOG.md). +重要な変更はすべて [changelog file](https://github.com/facebook/react/blob/master/CHANGELOG.md) に文書化されています。 -### Bugs {#bugs} +### バグ {#bugs} -#### Where to Find Known Issues {#where-to-find-known-issues} +#### 既知の問題を知るには {#where-to-find-known-issues} -We are using [GitHub Issues](https://github.com/facebook/react/issues) for our public bugs. We keep a close eye on this and try to make it clear when we have an internal fix in progress. Before filing a new task, try to make sure your problem doesn't already exist. +私たちは公開されるバグの管理に [GitHub Issues](https://github.com/facebook/react/issues) を使用しています。私たちはこれを注意深く見守り、修正中の作業がある場合はそれを明確にするようにします。新しい Issue を提出する前に、既に同じものが存在しないか確かめてください。 -#### Reporting New Issues {#reporting-new-issues} +#### 新しい問題の報告 {#reporting-new-issues} -The best way to get your bug fixed is to provide a reduced test case. This [JSFiddle template](https://jsfiddle.net/Luktwrdm/) is a great starting point. +バグを修正するための最善の方法は、バグを再現する最小のテストケースを提供することです。この [JSFiddle テンプレート](https://jsfiddle.net/Luktwrdm/) は素晴らしい出発点です。 -#### Security Bugs {#security-bugs} +#### セキュリティバグ {#security-bugs} -Facebook has a [bounty program](https://www.facebook.com/whitehat/) for the safe disclosure of security bugs. With that in mind, please do not file public issues; go through the process outlined on that page. +Facebook にはセキュリティバグの安全な開示のための[報奨金制度](https://www.facebook.com/whitehat/)が存在します。それを念頭において、セキュリティバグは公開の Issues に提出せず、上記のページの手順に従ってください。 -### How to Get in Touch {#how-to-get-in-touch} +### 連絡方法 {#how-to-get-in-touch} -* IRC: [#reactjs on freenode](https://webchat.freenode.net/?channels=reactjs) -* Discussion forum: [discuss.reactjs.org](https://discuss.reactjs.org/) +* IRC：[# freenode の reactjs](https://webchat.freenode.net/?channels=reactjs) +* ディスカッションフォーラム：[discuss.reactjs.org](https://discuss.reactjs.org/) -There is also [an active community of React users on the Discord chat platform](https://www.reactiflux.com/) in case you need help with React. +また、React に関して助けが必要な場合は、[Discord 上の React コミュニティ](http://www.reactiflux.com/)も存在します。 -### Proposing a Change {#proposing-a-change} +### 変更の提案 {#proposing-a-change} -If you intend to change the public API, or make any non-trivial changes to the implementation, we recommend [filing an issue](https://github.com/facebook/react/issues/new). This lets us reach an agreement on your proposal before you put significant effort into it. +もしあなたがパブリック API に変更を加えたり、実装に些細とはいえない変更を加えたりしたい場合、[Issue を提出する](https://github.com/facebook/react/issues/new)ことをお勧めします。これによって、あなたが大きな労力を割く前に提案について合意に達することができます。 -If you're only fixing a bug, it's fine to submit a pull request right away but we still recommend to file an issue detailing what you're fixing. This is helpful in case we don't accept that specific fix but want to keep track of the issue. +バグを修正するだけの場合は、すぐにプルリクエストを送信しても問題ありませんが、修正したいバグの内容を詳細に記載した Issue を提出することをお勧めします。これは、あなたの修正自体は受け付けないがバグの追跡はしたいという場合に役立ちます。 -### Your First Pull Request {#your-first-pull-request} +### 初めてのプルリクエスト {#your-first-pull-request} -Working on your first Pull Request? You can learn how from this free video series: +はじめてのプルリクエストに取り組んでみますか？ この無料ビデオシリーズから手順を学ぶことができます： -**[How to Contribute to an Open Source Project on GitHub](https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github)** +**[GitHub でオープンソースプロジェクトに貢献する方法](https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github)** -To help you get your feet wet and get you familiar with our contribution process, we have a list of **[good first issues](https://github.com/facebook/react/issues?q=is:open+is:issue+label:"good+first+issue")** that contain bugs that have a relatively limited scope. This is a great place to get started. +あなたが新しい試みをする上で、貢献プロセスに慣れるのを助けるために、私たちは比較的影響範囲の少ないバグを含む **[good first issues](https://github.com/facebook/react/issues?q=is:open+is:issue+label:"good+first+issue")** のリストを持っています。これはオープンソースプロジェクトへの貢献の入門に最適です。 -If you decide to fix an issue, please be sure to check the comment thread in case somebody is already working on a fix. If nobody is working on it at the moment, please leave a comment stating that you intend to work on it so other people don't accidentally duplicate your effort. +Issue を解決することにした場合、誰かがすでに修正に取り組んでいる場合に備えて、コメントスレッドを必ず確認してください。現時点で誰も作業していない場合は、他の人が誤って重複して作業をしないように、作業する予定であることを示すコメントを残してください。 -If somebody claims an issue but doesn't follow up for more than two weeks, it's fine to take it over but you should still leave a comment. +誰かが取り組むと宣言した Issue が 2 週間以上放置されている場合、それを引き継ぐことは問題ありませんが、その場合もコメントを残すべきです。 -### Sending a Pull Request {#sending-a-pull-request} +### プルリクエストを送信する {#sending-a-pull-request} -The core team is monitoring for pull requests. We will review your pull request and either merge it, request changes to it, or close it with an explanation. For API changes we may need to fix our internal uses at Facebook.com, which could cause some delay. We'll do our best to provide updates and feedback throughout the process. +コアチームはプルリクエストを監視しています。プルリクエストをレビューしてマージするか、変更を要求するか、説明付きでクローズします。Facebook.com 内部で使用法の検討が必要な可能性のある API の変更については、対応が遅くなることがあります。プロセス全体を通して最新情報とフィードバックを提供するよう最善を尽くします。 -**Before submitting a pull request,** please make sure the following is done: +**プルリクエストを送信する前に、**以下のプロセスが行われているか確認してください： -1. Fork [the repository](https://github.com/facebook/react) and create your branch from `master`. -2. Run `yarn` in the repository root. -3. If you've fixed a bug or added code that should be tested, add tests! -4. Ensure the test suite passes (`yarn test`). Tip: `yarn test --watch TestName` is helpful in development. -5. Run `yarn test-prod` to test in the production environment. It supports the same options as `yarn test`. -6. If you need a debugger, run `yarn debug-test --watch TestName`, open `chrome://inspect`, and press "Inspect". -7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`). -8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files. -9. Run the [Flow](https://flowtype.org/) typechecks (`yarn flow`). -10. If you haven't already, complete the CLA. +1. [リポジトリ](https://github.com/facebook/react) をフォークして `master` から新しいブランチを作成します。 +2. `yarn` コマンドをリポジトリルートで実行します。 +3. バグを修正したり、テストが必要なコードを追加した場合は、テストを追加してください。 +4. テストスイートが通ることを確認してください (`yarn test`)。ヒント： `yarn test --watch TestName` コマンドは開発時に役立ちます。 +5. `yarn test-prod` コマンドを本番環境でテストするために実行します。これは `yarn test` と同じオプションをサポートします。 +6. デバッガが必要な場合は `yarn debug-test --watch TestName` を実行し `chrome://inspect` を開き "Inspect" を押してください。 +7. [prettier](https://github.com/prettier/prettier) でコードをフォーマットしてください (`yarn prettier`)。 +8. リントを行ってください (`yarn lint`)。ヒント： `yarn linc` は変更されたファイルのみに適用できます。 +9. [Flow](https://flowtype.org/) による型チェックを行ってください (`yarn flow`)。 +10. まだの場合は、先に CLA (Contributor License Agreement) の提出を済ませてください。 ### Contributor License Agreement (CLA) {#contributor-license-agreement-cla} -In order to accept your pull request, we need you to submit a CLA. You only need to do this once, so if you've done this for another Facebook open source project, you're good to go. If you are submitting a pull request for the first time, just let us know that you have completed the CLA and we can cross-check with your GitHub username. +あなたのプルリクエストを受け付けるために、Contributor License Agreement (CLA) の提出を行って頂く必要があります。これは一度だけ行えば良いので、あなたが他の Facebook オープンソースプロジェクトで既に完了させている場合は必要ありません。初めてプルリクエストを送信する場合は、CLA 提出を完了させたことをお知らせください。そうすれば私たちは GitHub のユーザ名と照らし合わせてチェックを行います。 -**[Complete your CLA here.](https://code.facebook.com/cla)** +**[ここで CLA を完了させてください。](https://code.facebook.com/cla)** -### Contribution Prerequisites {#contribution-prerequisites} +### 貢献の前提条件 {#contribution-prerequisites} -* You have [Node](https://nodejs.org) installed at v8.0.0+ and [Yarn](https://yarnpkg.com/en/) at v1.2.0+. -* You have `gcc` installed or are comfortable installing a compiler if needed. Some of our dependencies may require a compilation step. On OS X, the Xcode Command Line Tools will cover this. On Ubuntu, `apt-get install build-essential` will install the required packages. Similar commands should work on other Linux distros. Windows will require some additional steps, see the [`node-gyp` installation instructions](https://github.com/nodejs/node-gyp#installation) for details. -* You are familiar with Git. +* [Node](https://nodejs.org) v8.0.0+ と、[Yarn](https://yarnpkg.com/en/) v1.2.0+ がインストールされていること。 +* `gcc` がインストールされている、または必要に応じたコンパイラをインストールすることができること。依存関係の中にはコンパイルステップが必要なものもあります。OS X では Xcode のコマンドラインツールが役立つでしょう。Ubuntu では `apt-get install build-essential` コマンドで必要なパッケージをインストールできます。他の Linux ディストリビューションでも似たようなコマンドで実現できるでしょう。Windows では追加の手順が必要になり、詳しくは [`node-gyp` installation instructions](https://github.com/nodejs/node-gyp#installation) を参照してください。 +* Git について精通していること。 -### Development Workflow {#development-workflow} +### 開発ワークフロー {#development-workflow} -After cloning React, run `yarn` to fetch its dependencies. -Then, you can run several commands: +React リポジトリをクローンしたあと、`yarn` コマンドで依存関係のパッケージを取得してください。 +そうすれば、いくつかのコマンドが実行可能になります： -* `yarn lint` checks the code style. -* `yarn linc` is like `yarn lint` but faster because it only checks files that differ in your branch. -* `yarn test` runs the complete test suite. -* `yarn test --watch` runs an interactive test watcher. -* `yarn test ` runs tests with matching filenames. -* `yarn test-prod` runs tests in the production environment. It supports all the same options as `yarn test`. -* `yarn debug-test` is just like `yarn test` but with a debugger. Open `chrome://inspect` and press "Inspect". -* `yarn flow` runs the [Flow](https://flowtype.org/) typechecks. -* `yarn build` creates a `build` folder with all the packages. -* `yarn build react/index,react-dom/index --type=UMD` creates UMD builds of just React and ReactDOM. +* `yarn lint` コードスタイルをチェックします。 +* `yarn linc` `yarn lint` と似ていますが、変更されたファイルのみをチェックするのでこちらの方が速いです。 +* `yarn test` 全てのテストスイートを実行します。 +* `yarn test --watch` 対話式のテストウォッチャーを実行します。 +* `yarn test ` 指定したパターンにマッチするファイルのみテストを実行します。 +* `yarn test-prod` 本番環境でテストを実行します。`yarn test` と同じオプションをサポートしています。 +* `yarn debug-test` は `yarn test` に似ていますがデバッガ付きです。`chrome://inspect` を開き "Inspect" を押してください。 +* `yarn flow` [Flow](https://flowtype.org/) による型チェックを行います。 +* `yarn build` 全てのパッケージを含む `build` フォルダを作成します。 +* `yarn build react/index,react-dom/index --type=UMD` React と ReactDOM だけの UMD ビルドを作成します。 -We recommend running `yarn test` (or its variations above) to make sure you don't introduce any regressions as you work on your change. However it can be handy to try your build of React in a real project. +`yarn test`（またはそれに近い上記のコマンド）を実行し、あなたの行った変更によって何らかの異常を引き起こしていないか確認することをお勧めします。とはいえ実際のプロジェクトで自分の React のビルドを使ってみることも役に立つでしょう。 -First, run `yarn build`. This will produce pre-built bundles in `build` folder, as well as prepare npm packages inside `build/packages`. +まず `yarn build` を実行します。これによってビルド済みのバンドルファイルが `build` フォルダ内に作られ、同時に `build/packages` 内に npm パッケージも用意されます。 -The easiest way to try your changes is to run `yarn build react/index,react-dom/index --type=UMD` and then open `fixtures/packaging/babel-standalone/dev.html`. This file already uses `react.development.js` from the `build` folder so it will pick up your changes. +変更を試す一番簡単な方法は `yarn build react/index,react-dom/index --type=UMD` を実行し、`fixtures/packaging/babel-standalone/dev.html` を開くことです。このファイルは `build` フォルダの `react.development.js` を既に使用しているので、変更が反映されます。 -If you want to try your changes in your existing React project, you may copy `build/dist/react.development.js`, `build/dist/react-dom.development.js`, or any other build products into your app and use them instead of the stable version. If your project uses React from npm, you may delete `react` and `react-dom` in its dependencies and use `yarn link` to point them to your local `build` folder: +あなたの加えた変更を既存の React プロジェクトで試したい場合、`build/dist/react.development.js`、`build/dist/react-dom.development.js`、もしくは他のビルドされたファイルをあなたのアプリケーションにコピーして安定版の代わりに使用することができます。もし、npm 版の React を使用している場合は `react` と `react-dom` を依存関係から削除し、`yarn link` を使用してそれらがローカルの `build` を指すようにしてください： ```sh cd ~/path_to_your_react_clone/build/node_modules/react @@ -134,45 +134,45 @@ cd /path/to/your/project yarn link react react-dom ``` -Every time you run `yarn build` in the React folder, the updated versions will appear in your project's `node_modules`. You can then rebuild your project to try your changes. +`yarn build` を React フォルダで実行するたびに、あなたのプロジェクトの `node_modules` フォルダに更新されたバージョンが現れるでしょう。その後、プロジェクトをビルドし直して変更を試すことができます。 -We still require that your pull request contains unit tests for any new functionality. This way we can ensure that we don't break your code in the future. +ただしプルリクエストにあなたの新機能に応じたユニットテストを含めることは必須です。これによって将来あなたのコードを壊してしまわないことが担保されます。 -### Style Guide {#style-guide} +### スタイルガイド {#style-guide} -We use an automatic code formatter called [Prettier](https://prettier.io/). -Run `yarn prettier` after making any changes to the code. +[Prettier](https://prettier.io/) と呼ばれる自動コードフォーマッタを使います。 +`yarn prettier` コマンドをコードを変更した後に実行してください。 -Then, our linter will catch most issues that may exist in your code. -You can check the status of your code styling by simply running `yarn linc`. +そうすれば、後はリンターがあなたのコードに存在するほとんどの問題を捕らえるでしょう。 +自分の書いたコードのスタイルをチェックしたい場合は単に `yarn linc` を実行してください。 -However, there are still some styles that the linter cannot pick up. If you are unsure about something, looking at [Airbnb's Style Guide](https://github.com/airbnb/javascript) will guide you in the right direction. +しかしながら、リンターでもチェックしきれないいくつかのスタイルがあります。何か分からないことがあれば [Airbnb's Style Guide](https://github.com/airbnb/javascript) が正しい方向に導いてくれるでしょう。 -### Introductory Video {#introductory-video} +### 紹介ビデオ {#introductory-video} -You may be interested in watching [this short video](https://www.youtube.com/watch?v=wUpPsEcGsg8) (26 mins) which gives an introduction on how to contribute to React. +React への貢献方法について紹介している [この短いビデオ](https://www.youtube.com/watch?v=wUpPsEcGsg8)（26 分）にあなたは興味があるかもしれません。 -#### Video highlights: {#video-highlights} -- [4:12](https://youtu.be/wUpPsEcGsg8?t=4m12s) - Building and testing React locally -- [6:07](https://youtu.be/wUpPsEcGsg8?t=6m7s) - Creating and sending pull requests -- [8:25](https://youtu.be/wUpPsEcGsg8?t=8m25s) - Organizing code -- [14:43](https://youtu.be/wUpPsEcGsg8?t=14m43s) - React npm registry -- [19:15](https://youtu.be/wUpPsEcGsg8?t=19m15s) - Adding new React features +#### ビデオの概要： {#video-highlights} +- [4:12](https://youtu.be/wUpPsEcGsg8?t=4m12s) - ローカルで React のテストとビルドを行う +- [6:07](https://youtu.be/wUpPsEcGsg8?t=6m7s) - プルリクエストの作成と送信 +- [8:25](https://youtu.be/wUpPsEcGsg8?t=8m25s) - コードを整理する +- [14:43](https://youtu.be/wUpPsEcGsg8?t=14m43s) - React npm レジストリ +- [19:15](https://youtu.be/wUpPsEcGsg8?t=19m15s) - React に新しい機能を追加する -For a realistic overview of what it _feels_ like to contribute to React for the first time, check out [this entertaining ReactNYC talk](https://www.youtube.com/watch?v=GWCcZ6fnpn4). +React へ初めて貢献することについてのよりリアルな_感覚_については、[この面白い ReactNYC talk](https://www.youtube.com/watch?v=GWCcZ6fnpn4) をチェックしてください。 ### Request for Comments (RFC) {#request-for-comments-rfc} -Many changes, including bug fixes and documentation improvements can be implemented and reviewed via the normal GitHub pull request workflow. +バグ修正やドキュメンテーションの改善を含む多くの変更は、通常の GitHub プルリクエストのワークフローを通して行われレビューされます。 -Some changes though are "substantial", and we ask that these be put through a bit of a design process and produce a consensus among the React core team. +ただし、いくつかの "大きめの" 変更は、多少の設計プロセスと React コアチームの合意を経ることをお願いします。 -The "RFC" (request for comments) process is intended to provide a consistent and controlled path for new features to enter the project. You can contribute by visiting the [rfcs repository](https://github.com/reactjs/rfcs). +"RFC" (request for comments) プロセスは、新機能がプロジェクトに取り込まれるまでの一貫性があり整備された筋道を提供することを目的としています。[rfcs リポジトリ](https://github.com/reactjs/rfcs) を訪れれば貢献することができます。 -### License {#license} +### ライセンス {#license} -By contributing to React, you agree that your contributions will be licensed under its MIT license. +React に貢献するにあたって、あなたの貢献は MIT ライセンスの元にあることに同意したとみなします。 -### What Next? {#what-next} +### 次のセクション {#what-next} -Read the [next section](/docs/codebase-overview.html) to learn how the codebase is organized. +[次のセクション](/docs/codebase-overview.html) を読んで、コードベースの構成方法について知ることができます。