Rails Asset Pipeline: Defunct or Da Funk

The Rails asset pipeline has been a useful tool for rapidly crafting beautiful front ends but with ever growing JavaScript toolchains like Grunt and Gulp it seems defunct, or is it?

Traditionally elegant front end interfaces can be a pleasure to craft by following The Rails Way(tm) with simple JavaScript behaviours.

When a round-trip delay just doesn't cut it, more complex approaches can be crafted with libraries like Backbone to create a truly client-side application. The asset pipeline remains a perfect complement, allowing all sorts of optimisations.

But going beyond these simpler approaches is all the rage with Angular leading the charge. We'll look at building Angular apps leveraging the pipeline for templates, compilation, and more.

Quickly touching on some more esoteric applications, we can also export rails routes for use in client side templates, automatically create sprite sheets, and even generate icon fonts, optimising assets along the way. The Rails asset pipeline is still Da Funk; a fantastic tool for front end developers.

Transcript

1. Rails Asset Pipeline Defunct or Da Funk
2. Samuel Cochran
3. @sj26
7. MailCatcher
16. https://www.cs.cmu.edu/~enron/
18. ! Account ! Mailbox Message
21. Grid system Typography Code Tables Forms Buttons Images Helper classes
22. Grid system Typography Code Tables Forms Buttons Images Helper classes Dropdowns Button groups Button dropdowns Input groups Navs Navbar Breadcrumbs Pagination
23. Grid system Typography Code Tables Forms Buttons Images Helper classes Dropdowns Button groups Button dropdowns Input groups Navs Navbar Breadcrumbs Pagination Labels Badges Jumbotron Page header Alerts Thumbnails Progress bars Media object List group Panels Wells
30. Customisations
32. Customisations Use variables and mixins
38. application.js app/assets
39. application.js messages.js app/assets
40. application.js messages.js index.js app/assets
41. application.js messages.js index.js app/assets jquery.js vendor/assets
42. application.js messages.js index.js new.js app/assets jquery.js vendor/assets
43. jquery-textarea-grow.js application.js messages.js index.js new.js app/assets jquery.js vendor/assets
44. jquery-textarea-grow.js application.js messages.js new.js app/assets jquery.js vendor/assets
45. application.js messages.js new.js app/assets jquery.js vendor/assets
46. application.js messages.js new.js app/assets vendor/assets
47. OH LOOK GRANULAR DEPENDENCIES
53. application.js models mailbox.js collections mailboxes.js message.js message_detail.js messages.js views mailboxes_view.js messages_view.js message_detail_view.js
54. models mailbox.js collections mailboxes.js message.js message_detail.js messages.js views mailboxes_view.js messages_view.js message_detail_view.js application.js
55. views mailboxes_view.js messages_view.js message_detail_view.js pages mailboxes_index_page.js compose_page.js application.js
59. admin.js
60. admin.js //= require jquery
62. admin.js //= stub application //= require jquery
79. Reasons to use sprockets
80. Reasons I like sprockets
81. Reasons I like sprockets • Great dependency management • It’s like make for assets • Pre-processing • No unwieldy config files • Built in to Rails • Stays in Ruby-land
83. http://sj26.com
86. routes.js.coffee.erb
88. ninjas/*.png ! ninjas.png.spritesheet
92. icons/*.svg ! icons.font