|
| 1 | +# Contributing to React-Rails |
| 2 | + |
| 3 | +🎉 Thanks for taking the time to contribute! 🎉 |
| 4 | + |
| 5 | +With 2 Million+ downloads of the react-rails Gem and another 100k+ downloads of react_ujs on NPM, you're helping the biggest React + Rails community! |
| 6 | + |
| 7 | +What follows is a set of guidelines for contributing to React-Rails, inside the [react-js Organization](https://github.com/reactjs), part of the wider [React Community](https://reactcommunity.org/) |
| 8 | + |
| 9 | +By contributing to React-Rails, you agree to abide by the [code of conduct](https://github.com/reactjs/react-rails/blob/master/CODE_OF_CONDUCT.md). |
| 10 | + |
| 11 | +<!-- START doctoc generated TOC please keep comment here to allow auto update --> |
| 12 | +<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --> |
| 13 | + |
| 14 | + |
| 15 | +- [How Can I Contribute?](#how-can-i-contribute) |
| 16 | + - [Reporting Bugs](#reporting-bugs) |
| 17 | + - [Before Submitting A Bug Report](#before-submitting-a-bug-report) |
| 18 | + - [How Do I Submit A (Good) Bug Report?](#how-do-i-submit-a-good-bug-report) |
| 19 | + - [Your First Code Contribution](#your-first-code-contribution) |
| 20 | + - [Pull Requests](#pull-requests) |
| 21 | + - [Development](#development) |
| 22 | + - [Local dev](#local-dev) |
| 23 | + - [Running tests](#running-tests) |
| 24 | + - [Updating the pre-bundled react](#updating-the-pre-bundled-react) |
| 25 | + - [Updating ReactRailsUJS](#updating-reactrailsujs) |
| 26 | + - [Releasing the Gem](#releasing-the-gem) |
| 27 | +- [Styleguides](#styleguides) |
| 28 | + - [Git Commit Messages](#git-commit-messages) |
| 29 | + - [Ruby styleguide](#ruby-styleguide) |
| 30 | +- [Issue and Pull Request Labels](#issue-and-pull-request-labels) |
| 31 | + |
| 32 | +<!-- END doctoc generated TOC please keep comment here to allow auto update --> |
| 33 | + |
| 34 | +## How Can I Contribute? |
| 35 | + |
| 36 | +### Reporting Bugs |
| 37 | + |
| 38 | +#### Before Submitting A Bug Report |
| 39 | +* **Check the [wiki](https://github.com/reactjs/react-rails/wiki).** You might be able to find a guide on what you're experiencing. Most importantly, check if you can reproduce the problem [in the latest version of React-Rails with React_ujs](https://github.com/reactjs/react-rails/tree/master), sometimes we have already fixed the issue. |
| 40 | +* **Perform a [cursory search](https://github.com/reactjs/react-rails/issues)** to see if the problem has already been reported. If it has **and the issue is still open**, add a comment to the existing issue instead of opening a new one. If **the issue is closed** open a new issue with reproduction steps and reference the old one. |
| 41 | +* **If the problem is with pre-rendering, turn off pre-rendering and look at Chrome's developer console**, that normally reveals more details about what the true error message is if it's a syntax error in a component or failing to require a component file. |
| 42 | + |
| 43 | +#### How Do I Submit A (Good) Bug Report? |
| 44 | +Bugs are tracked as [GitHub issues](https://guides.github.com/features/issues/). |
| 45 | +Create an issue and provide the following information by filling in [the template](.github/ISSUE_TEMPLATE.md). |
| 46 | + |
| 47 | +Explain the problem and include additional details to help maintainers reproduce the problem: |
| 48 | + |
| 49 | +* **Use a clear and descriptive title** for the issue to identify the problem. |
| 50 | +* **Describe the exact steps which reproduce the problem** in as many details as possible. When listing steps, **don't just say what you did, but explain how you did it**. For example, If you're using Browserify instead of Webpacker, how did you do it? |
| 51 | +* **Provide specific examples to demonstrate the steps**. Include links to files or GitHub projects, Gists, or copy/pasteable snippets, which you use in those examples. If you're providing snippets in the issue, use [Markdown code blocks](https://help.github.com/articles/markdown-basics/#multiple-lines). |
| 52 | +* **Describe the behavior you observed after following the steps** and point out what exactly is the problem with that behavior. |
| 53 | +* **Explain which behavior you expected to see instead and why.** |
| 54 | +* **Include screenshots and animated GIFs** which show you following the described steps and clearly demonstrate the problem. You can use [this tool](http://www.cockos.com/licecap/) to record GIFs on macOS and Windows, and [this tool](https://github.com/colinkeenan/silentcast) or [this tool](https://github.com/GNOME/byzanz) on Linux. |
| 55 | + |
| 56 | +Include details about your configuration and environment, React-Rails integrates many tools, versions of many things could be the culprit, though we try test as many as reasonable in our [Travis Build](.travis.yml) |
| 57 | + |
| 58 | +* **Which version of React-Rails are you using?** |
| 59 | +* **Which version of React_UJS are you using?** |
| 60 | +* **Which version of Webpacker/Sprockets are you using?** |
| 61 | +* **Which version of Rails are you using?** |
| 62 | + |
| 63 | +### Your First Code Contribution |
| 64 | + |
| 65 | +Unsure where to begin contributing to React-Rails? You can start by looking through these `help-wanted` issues: |
| 66 | + |
| 67 | +* [Help wanted issues](https://github.com/reactjs/react-rails/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22) |
| 68 | + |
| 69 | +This issue list is sorted by total number of comments. While not perfect, number of comments is a reasonable proxy for impact a given change will have. |
| 70 | + |
| 71 | +#### Pull Requests |
| 72 | + |
| 73 | +See [git commit message style](#git-commit-messages) |
| 74 | + |
| 75 | +* Fill in [the required template](.github/PULL_REQUEST_TEMPLATE.md) |
| 76 | +* Do not include issue numbers in the PR title |
| 77 | +* Include screenshots and animated GIFs in your pull request whenever possible. |
| 78 | +* Follow the [styleguides](#styleguides) where possible but readability is the most important! |
| 79 | +* Include intention-revealing [Minitest](https://github.com/seattlerb/minitest) tests in the `./test` folder. It's important people know *why* a test exists by reading it more than *what* it does, we can read the source for the *what*. |
| 80 | +* Document new code where you're able. |
| 81 | + |
| 82 | +#### Development |
| 83 | + |
| 84 | +##### Local dev |
| 85 | + |
| 86 | +Clone down the [react-rails-example-app](https://github.com/bookofgreg/react-rails-example-app), it has several branches for different scenarios. It's designed to contain very simple examples of each feature of React-Rails. |
| 87 | + |
| 88 | +To develop Ruby code, change the Gemfile to point to a local copy of react-rails. |
| 89 | +``` |
| 90 | +gem 'react-rails', path: '../react-rails' |
| 91 | +``` |
| 92 | + |
| 93 | +To develop the React_UJS NPM Package, make your changes and run `npm pack` to make a `.tgz` bundle, then in react-rails-example-app `yarn add ../react_ujs-<version>.tgz` |
| 94 | + |
| 95 | +##### Running tests |
| 96 | + |
| 97 | +`bundle exec appraisal install` to install gems on every gemfile Appraisal contains. |
| 98 | +`rake test` or `bundle exec appraisal rake test` runs everything. |
| 99 | +or run a specific suite using `bundle exec appraisal <appraisal name> rake test` |
| 100 | +- Find appraisal names in [Appraisals](Appraisals) |
| 101 | +- Integration tests run in Headless Chrome which is included in Chrome (59+ linux,OSX | 60+ Windows) |
| 102 | +- ChromeDriver is included with `chromedriver-helper` gem so no need to manually install that 👍 |
| 103 | + |
| 104 | +##### Updating the pre-bundled react |
| 105 | +- Update React with `rake react:update` |
| 106 | +It outputs an ironically webpacked couple of files into `lib/assets/react-source/<environment>/react(-server).js` where it will be picked up by `sprockets` in `lib/react/rails/asset_variant.rb` |
| 107 | + |
| 108 | +##### Updating ReactRailsUJS |
| 109 | +- Update the UJS with `rake ujs:update` |
| 110 | +- (For Maintainers) To release a new NPM version: |
| 111 | + - Update the version in `react_ujs/package.json` |
| 112 | + - Commit & push to master |
| 113 | + - `bundle exec rake ujs:publish` (runs `npm publish`) |
| 114 | + |
| 115 | +##### Releasing the Gem |
| 116 | +- (For Maintainers) To release a new RubyGems version: |
| 117 | + - Increment the version in `lib/react/rails/version.rb` |
| 118 | + - Add an entry to `VERSIONS.md` |
| 119 | + - Update the [changelog](CHANGELOG.md) (find recent changes on GitHub by listing commits or showing closed PRs) |
| 120 | + - Commit changes & push to master |
| 121 | + - `bundle exec rake release`: pushes a tag to GitHub, builds a `.gem`, and pushes to RubyGems |
| 122 | + |
| 123 | +## Styleguides |
| 124 | + |
| 125 | +### Git Commit Messages |
| 126 | + |
| 127 | +* Use the present tense ("Add feature" not "Added feature") |
| 128 | +* Use the imperative mood ("Move cursor to..." not "Moves cursor to...") |
| 129 | +* Limit the first line to 72 characters or less |
| 130 | +* Reference issues and pull requests liberally after the first line |
| 131 | +* * When only changing documentation, include `[ci skip]` in the [commit description](https://docs.travis-ci.com/user/customizing-the-build/#Skipping-a-build) so we don't waste Travis's Open source resources. |
| 132 | +* Consider starting the commit message with an applicable emoji: |
| 133 | + * :art: `:art:` when improving the format/structure of the code |
| 134 | + * :racehorse: `:racehorse:` when improving performance |
| 135 | + * :memo: `:memo:` when writing docs |
| 136 | + * :bug: `:bug:` when fixing a bug |
| 137 | + * :fire: `:fire:` when removing code or files |
| 138 | + * :green_heart: `:green_heart:` when fixing the CI build |
| 139 | + * :white_check_mark: `:white_check_mark:` when adding tests |
| 140 | + * :lock: `:lock:` when dealing with security |
| 141 | + * :arrow_up: `:arrow_up:` when upgrading dependencies |
| 142 | + * :arrow_down: `:arrow_down:` when downgrading dependencies |
| 143 | + * :shirt: `:shirt:` when removing linter warnings |
| 144 | + |
| 145 | +### Ruby styleguide |
| 146 | + |
| 147 | +Ruby Style in this repo should attempt to follow the standard ruby styles as defined in `Rubocop`. This is more of a guide than a rule so use common sense, readability is more important than the style guide! |
| 148 | + |
| 149 | +## Issue and Pull Request Labels |
| 150 | + |
| 151 | +Todo |
| 152 | + |
| 153 | +Finally, thanks to the [Atom Organization](https://github.com/atom) where this Contributing guide is based! :heart: :green_heart: |
0 commit comments