ShakaCode | ShakaCode Blog | Rails On Maui Blog | Rails | ReactJs | JavaScript | Webpack | Productivity |

Integrating react_on_rails into existing rails 5.1 react app


#1

Hi there!

I have a rails/react app that i’m working on (i’m relatively new to rails)

i created my app (v5.1.4) like so… rails new myapp --webpack=react --skip-sprockets --skip-turbo-links

Everything is working great webpack/react etc, however…

As the JS becomes more complicated i find my self with several queries:

  1. Webpack seems slightly too extracted would prefer to roll my own config. (perhaps because i’ve not full grasped how webpack is integrated in this setup)

  2. The way i am adding react components to my views is like this…

<div id="my_react_component" myprop1="prop data"></div> in the view.erb

then in my JS.

document.addEventListener('DOMContentLoaded', () => {
	const component = document.querySelector('#my_react_component');
	const prop1 = component.getAttribute('myprop1');
	ReactDOM.render( <MyComponent prop1={prop1} />, component )
})

Is this correct/the only way? seems bad to me, the view helpers in react on rails look much better!!

In light of this is it easy to swap in react on rails to this existing setup?

Is it a matter of swapping out the webpacker gem and moving the component location?

Lastly :slight_smile: what will happen in rails 5.2 they say in the release notes that “we’ve also made great strides with webpack” does that release change anything?

Your help is most appreciated.


#2

Try https://github.com/shakacode/react_on_rails!

You won’t have these issues.