From 985850e1db6795c776bc23a045b8f4cbd04c5c76 Mon Sep 17 00:00:00 2001 From: Jonathan Owah Date: Sat, 26 Jun 2021 14:39:58 +0100 Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=93=9D:=20Update=20README.md=20[ci=20?= =?UTF-8?q?skip]?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 31 ++++++++++--------------------- 1 file changed, 10 insertions(+), 21 deletions(-) diff --git a/README.md b/README.md index 79e3c6264..584a1b8b9 100644 --- a/README.md +++ b/README.md @@ -67,51 +67,40 @@ $ rails new my-app $ cd my-app ``` -##### 2) Add `webpacker` and `react-rails` to your gemfile: +##### 2) Add `react-rails` to your Gemfile: ```ruby -gem 'webpacker' gem 'react-rails' ``` -Note: For Rails 6, You don't need to add `gem 'webpacker'` to your gemfile in step 2 above. -Webpacker is the default javascript compiler for Rails 6, and is already added to your gemfile -when you create a new app. +Note: On rails versions < 6.0, You need to add `gem 'webpacker'` to your Gemfile in step 2 above. ##### 3) Now run the installers: -###### Rails 6.x: +###### Rails 6.x and 5.x: ``` $ bundle install -$ rails webpacker:install -$ rails webpacker:install:react +$ rails webpacker:install # OR (on rails version < 5.0) rake webpacker:install +$ rails webpacker:install:react # OR (on rails version < 5.0) rake webpacker:install:react $ rails generate react:install ``` -Note: For Rails 6, You don't need to add `javascript_pack_tag` as in Step 4. Since it's already added by default. -###### Rails 5.x: -``` -$ bundle install -$ rails webpacker:install # OR (on rails version < 5.0) rake webpacker:install -$ rails webpacker:install:react # OR (on rails version < 5.0) rake webpacker:install:react -$ rails generate react:install -``` This gives you: - `app/javascript/components/` directory for your React components - [`ReactRailsUJS`](#ujs) setup in `app/javascript/packs/application.js` - `app/javascript/packs/server_rendering.js` for [server-side rendering](#server-side-rendering) -##### 4) Link the JavaScript pack in Rails view using `javascript_pack_tag` [helper](https://github.com/rails/webpacker#usage): +Note: On rails versions < 6.0, link the JavaScript pack in Rails view using `javascript_pack_tag` [helper](https://github.com/rails/webpacker#usage): ```erb <%= javascript_pack_tag 'application' %> ``` -##### 5) Generate your first component: +##### 4) Generate your first component: ``` $ rails g react:component HelloWorld greeting:string ``` -##### 6) You can also generate your component in a subdirectory: +##### 5) You can also generate your component in a subdirectory: ``` $ rails g react:component my_subdirectory/HelloWorld greeting:string ``` @@ -124,14 +113,14 @@ Example: <%= react_component("my_subdirectory/HelloWorld", { greeting: "Hello from react-rails." }) %> ``` -##### 7) [Render it in a Rails view](#view-helper): +##### 6) [Render it in a Rails view](#view-helper): ```erb <%= react_component("HelloWorld", { greeting: "Hello from react-rails." }) %> ``` -##### 8) Lets Start the app: +##### 7) Lets Start the app: ``` $ rails s ``` From 854e09d455db0067ee3ae98e444960e7d1b5aaac Mon Sep 17 00:00:00 2001 From: Jonathan Owah Date: Sat, 26 Jun 2021 14:46:38 +0100 Subject: [PATCH 2/2] Update README.md --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 584a1b8b9..125e4889c 100644 --- a/README.md +++ b/README.md @@ -78,8 +78,8 @@ Note: On rails versions < 6.0, You need to add `gem 'webpacker'` to your Gemfile ###### Rails 6.x and 5.x: ``` $ bundle install -$ rails webpacker:install # OR (on rails version < 5.0) rake webpacker:install -$ rails webpacker:install:react # OR (on rails version < 5.0) rake webpacker:install:react +$ rails webpacker:install # OR (on rails version < 5.0) rake webpacker:install +$ rails webpacker:install:react # OR (on rails version < 5.0) rake webpacker:install:react $ rails generate react:install ```