Project Rails with React Rails directories?

advertisements

Image showing my rails structure for react

I have a lot of react components and wish to simply keep them better organized. So I'll cut to the chase and just ask. Is it possible to put my react components in directories and if so- how do I select them in a view and other react components?

I've already tried a few variatians like the one below without success and fear that it's simply not possible? Can't find any documentation about this either.

<%= react_component('OutfitCreate.Images') %>

Edit: To clarify, I want to make it clear that I'm using a typical rails project structure, and for react I am making use of the react-rails gem to handle my components as well as generating them.

Edit2: To clarify further, what I'm seeking is a way to target a react component by directory as such:

<%= react_component('<directory>/<classname>') %>

where each directory will be sub directories of "components".


I recently used the react-rails gem and had a good experience. It takes care of accessing your components in Rails templates and does a few other nice things.

To answer your question specifically, you can put your components inside as many directories as you like as long as you follow the gem docs. The gem provides a view helper that allows you to render a specific component, and to pass data to it as props (the helper takes a hash which becomes the component's props).

Edit -- I'm not sure if you're already using the gem, the helper method you are using looks like it, but you don't specifically mention it. Perhaps there is a problem with the gem installation and/or setup. You need to edit application.js and also to run the generator task: rails g react:install

Edit -- To make sure you can access components in the components subdirectory, you should do the following things:

*run the generator: rails g react:install

*make sure the generated components.js file contains: //= require_tree ./components

*make sure your application.js file contains:

//= require react //= require react_ujs //= require components