I'm using the react-rails gem to integrate react with rails, and I'm conflicted on how I should organize my code.
Is it preferable that I have my core html in the html.erb files or in the jsx files? Currently, I basically made everything a component. All I do in my html.erb files is using the react_component helper to call those components. For example, I would have a ProfileShow.js.jsx file for my profile page and a EditPost.js.jsx for my edit post page.
What is your suggestion?
I prefer move my react-component's code to js-files. And link them using react_component helper method. It isn't good practice to write your js-code in views.
There are multiple ways to do this.
One of the best solutions I seen so far is to write your react jsx components in an app/assets/javascripts/components folder.
Setup a react gem like https://github.com/shakacode/react_on_rails
that would help with passing on data as props to the view layer as these would be accessible outside react.
I hope this helps.
Cheers.
Related
I'm working on a Gem that adds extra functionality to ActiveRecords. During installation, someone has to add the following to their form's erb file to get extra form elements provided by my gem:
<%= render "forms/my_gem", form: f %>
What is the best way to handle adding javascript inside my view file? I hate to have this javascript be used on every page, so I was wondering if the best approach is to add inline javascript. If you know of a gem that does this, can you please share.
Is it possible to render a react component in a rails partial through an AJAX call? Basically for performance reasons, I have to do some condition checks in order to render and initialize a react component in rails view. I cannot require the react JS upfront as well. I am thinking about rendering a partial through AJAX call and replacing the html in the view from jQuery. I am using react-rails for this purpose.
I'm not sure if this is the best way to do it. Other alternatives would be helpful too.
checked react-rails source code and had to manually call ReactRailsUJS.handleMount() via javascript.
For me, calling ReactRailsUJS.mountComponents() fixed my issue.
I have a rails app currently using webpack to create a bundle.js file that is picked up by the asset pipeline.
If I have a page that needs a react component embedded in it, where is the best place to actually call React.render? The react-rails gem does a great job of doing this unobtrusively, but with webpack I just have an entry.js file. Embedding a <script> tag in the page seems wrong (and also doesn't work because the JSX isn't transpiled). Is the right approach to jus have a script (probably in entry.js) that looks for certain placeholders on the page and replaces them with react components on page load?
thanks!
Yes. If you look at the react-starter-kit repo which people have started to use when they begin a new project, the recommended minimalistic way is having a div after your body and loading the bundled js afterwards.
I've got a simple rails gem (created using bundler) and I'd like to extend it by adding some CSS and javascript functionality. However, I'm unsure how to go about this and where to add the files. In particular, I need need more information on how it all fits together with the asset pipeline once it gets included in another project.
Can anyone give me the lowdown on how this works and either provide some simple examples or link to a tutorial? Literally 1 css and 1 js file is all I'm looking to include. Thanks.
You could write the gem as an engine. This allows you to have an app folder in the gem just as any Rails application would have. You can add models, views, controllers, assets etc.
Once you have it set up it's quite intuitive and it's a familiar way to create a gem if you're used to creating Rails apps.
This should get you started:
http://coding.smashingmagazine.com/2011/06/23/a-guide-to-starting-your-own-rails-engine-gem/
Hi
Please anyone tell me how to load a mustache template from other file into my backbone script?
I'd tried a Ajax but he loads it to me too late and view is already prepared...
Anyway... how to load assets/templates/single/index.html.mustache into backbone View and redirect it into View #el element?
Many thanks
Actually, haven't been able to find a gem similar to handlebars_assets for mustache. Maybe something similar for mustache since handlebars is an extension of mustache.
https://github.com/leshill/handlebars_assets