This repository was created as a "code-along" while I was reading blog posts about modern front-end in Rails available on Evil Martians' blog.
Each blog post is in the separate commit, so you can look at incremental changes.
On top of that - I fixed some bugs and introduced my own changes to reduce an unnecessary code and to create even bigger separation between the front-end and the back-end.
Commits in a chronological order:
-
Initial commit
-
Bug fixes and improvements
-
loco.js - Loco framework has been added to simplify communication between the front-end and the back-end. It looks like there are more additions than deletions, though, but that's because of the fact that
current_user
is now persisted in the database. Loco-Rails requires an authenticated model to work with a full functionality. So the app is kind of closer to a production version. However, the part of code that is responsible for a front-end ↔ back-end communication looks way simpler now. -
From webpacker to webpack - I strongly believe in a separation of concerns and that a front-end code should be handled by front-end tools. I don't like gemified wrappers of front-end libraries. And I feel the same about webpacker. Why not to use webpack directly instead? This is what I did. To have it working I had to restore Sprockets back. It is kind of a trade off. But it is fair to me. I just use it at the last stage to move assets from
app/assets
topublic/assets
and togzip
them.
Standard Rails stuff:
bundle
bin/rails db:create
bin/rails db:migrate
Plus installation of front-end dependencies:
npm install
For development - just run Rails server and webpack
with development configuration in separate terminal tabs:
bin/rails s
npm run start
For production - just generate a production version of assets first and follow-up with a standard Rails procedure.
npm run build
bin/rails assets:precompile
Zbigniew Humeniuk from Art of Code