Rails 6 comes with exciting new features like Parallel Testing, Multiple database Support and Webpacker.
In previous applications of Rails 6 we can use the Webpacker.
With Rails 5.1+ Application, we need to provide an option to use Webpacker as compiler while creating a new application.
Or we can use as Gem in existing rails app
Install in the rails application
When we create a new rails application, it will be installed with the application and webpacker:install will be run by the rails application generator.
Here, Packs directory is considered to be an entry point of webpack. All the files in the packs directory are compiled by the webpacker. By default application.js file has the following JS code.
Now, let me create a simple application to use the React front-end JS framework with Rails 6 Webpacker.
In this tutorial I am using Ruby 2.6.4 and Rails 22.214.171.124
1. Create a new rails app with below command line
2. This will create a new Rails app with webpacker configured and a new directory with new files as shown below:
4. Here as we can see there is one sample react file hello_react.jsx which shows the functional React component called Hello which will display the words “Hello React!” on a page. We can also take a prop value name to display it instead of the word “React”.
7. Let’s create the controller and index action for dashboard:
8. Create the routes for the same in config/routes.rb
9. Let’s start the rails server:
10. Go to http://localhost:3000/ to see the result:
As a developer we should know where to use the Webpack, as there are some side effects of using the Webpacker
If you are looking to develop any project on Ruby on Rails then choose us as we are one of the leading Ruby on Rails Development Company that provides quality Ruby on Rails development services. Contact us to hire Ruby on Rails developers for your Ruby on Rails requirement or you can reach us at email@example.com