File tree Expand file tree Collapse file tree 1 file changed +20
-4
lines changed Expand file tree Collapse file tree 1 file changed +20
-4
lines changed Original file line number Diff line number Diff line change @@ -56,13 +56,24 @@ https://github.com/reactjs/React-Rails/wiki
5656
5757[ Webpacker] ( https://github.com/rails/webpacker ) integrates modern JS tooling with Rails.
5858
59- Add ` webpacker ` and ` react-rails ` to your gemfile and run the installers:
59+ Create a new Rails app:
60+ ```
61+ $ rails new my-app --webpack=react
62+ $ cd my-app
63+ ```
64+
65+ Add ` webpacker ` and ` react-rails ` to your gemfile
66+ ```
67+ gem 'webpacker'
68+ gem 'react-rails'
69+ ```
6070
71+ Now run the installers:
6172```
6273$ bundle install
6374$ rails webpacker:install # OR (on rails version < 5.0) rake webpacker:install
64- $ rails webpacker:install:react # OR (on rails version < 5.0) rake webpacker:install:react
6575$ rails generate react:install
76+ $ rails webpacker:install:react # OR (on rails version < 5.0) rake webpacker:install:react
6677```
6778
6879This gives you:
@@ -74,7 +85,7 @@ This gives you:
7485Link the JavaScript pack in Rails view using ` javascript_pack_tag ` [ helper] ( https://github.com/rails/webpacker#usage ) , for example:
7586
7687```
77- <!-- application.html.erb -->
88+ <!-- application.html.erb in Head tag below turbolinks -->
7889<%= javascript_pack_tag 'application' %>
7990```
8091
@@ -94,10 +105,15 @@ $ rails g react:component my_subdirectory/HelloWorld greeting:string
94105
95106[ Render it in a Rails view] ( #view-helper ) :
96107
97- ``` erb
108+ ``` erb: paste this in view
98109<%= react_component("HelloWorld", { greeting: "Hello" }) %>
99110```
100111
112+ Lets Start the app:
113+ ```
114+ $ rails s
115+ ```
116+
101117The component name tells ` react-rails ` where to load the component. For example:
102118
103119` react_component ` call | component ` require `
You can’t perform that action at this time.
0 commit comments