Frontend Choices

Transcript

1. Frontend choices Alex Coles | Ruby & Rails Meetup, Дніпропетро́вськ
2. front end vs. frontend
3. Not really about choice
4. ‘I’m a backend guy living in a frontend world’
5. About me
6. @myabc Alex Coles Berlin, Germany Finn GmbH
7. openproject.org
8. eurucamp.org
9. 1..2..3
10. one one: background
11. Single Page Application Architecture
12. Single Page Application Architecture • Chunking • Controller • Templating • Routing • Real-time Communicaton • Local storage min MAX
13. single page vs. traditional HTML
14. naturally content-dependent
15. What’s your content? Information Pages Membership sites Closed Systems
16. Content Criteria • Authentication • Caching • Indexing (SEO) • Content TTL - relevance at a point in time
17. Curated content vs. dynamic • how many combinations of a unique set of data: • a blog with comments • a hotel page with reviews • a dashboard
18. two two: where we are now
19. “The Rails Way”
20. History of the Rails Interface
21. “Rails is so 2005”
22. “Rails Way” back in 2005 • Server Generated HTML (ERB, etc.) • Prototype • Scriptaculous • RJS
23. http://slash7.com/assets/2006/10/8/RJS-Demistified_Amy-Hoy-slash7_1.pdf RJS
24. RJS <div  id="items"></div>   <%=  link_to_remote  'Add  to  cart',  url:  {  controller:  'cart',   action:  'add_to_cart'  }%> erb view class  CartController  <  ActionController::Base      def  add_to_cart          @item  =  CartItem.new          @cart.items  <<  @item      end   end controller page.insert_html    :bottom,  :items,  partial:  'item',  object:  @item   page.replace_html  :items_count,  I18n.t(:item,  count:   @cart.items.count)   rjs view
25. “Rails Way” now • Server Generated HTML (ERB, Slim, HAML etc.) • jQuery • jQuery UI • Server generated JavaScript Responses (SJR)
26. Where we are now
27. JavaScript has grown up
28. No backend nobackend.org
29. Hoodie hood.ie
30. Meteor www.meteor.com
31. but I <3 Ruby
32. So here’s the question…
34. Room for Rails?
35. The Rails Way
36. – Marcin Stecki @madsheep at wroc_love.rb “Not his [DHH]'s responsibility to tell us how to do these things.”
37. Frontend frameworks
38. Frontend (MV*) frameworks • AngularJS • Ember.js • KnockoutJS
39. Frontend (component) frameworks • ReactJS • Backbone.View (alone) • ExtJS
40. TodoMVC todomvc.com
44. What is most like Rails?
45. Ember.js is most like Rails • Everything should inherit from Ember.Object
 (think ActiveRecord::Base.inherited) • Routing DSL • Vocabulary (templates, partials, etc.)
46. three three: practical usage
47. Using asset pipeline / sprockets
48. Use Bower
49. 3 options for using Bower
50. gem install bower-rails Option 1
51. Rails 4 (Sprockets 2+) Option 2
52. config.assets.paths << File.join(Rails.root, 'vendor', 'assets', ‘components') Option 2
53. Option 3 rails-assets.org
54. ember-rails-api github.com/dockyard/ember-appkit-rails
55. the app/assets/javascripts silo
57. What is the way forward?
58. (IMHO)
59. Split Completely
60. I don’t like monoliths
61. Two applications: one API, one frontend
62. Rails or Sinatra for API
 A JS workflow for Frontend
63. Surprisingly testable (and fast)
64. One more thing…
65. Volt is a framework for building data rich web applications shockingly fast. Play Video ! Get Started " Home Getting Started Docs API Blog Community # Volt Framework voltframework.com
66. Спасибо
 Спасибі
67. Questions?
68. @myabc