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…

33. None

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

41. None
42. None
43. None

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

56. None

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