Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Frontend Choices

Frontend Choices

Alex Coles

March 16, 2014
Tweet

More Decks by Alex Coles

Other Decks in Technology

Transcript

  1. Frontend choices
    Alex Coles | wroc_love.rb, Wrocław, Polska

    View Slide

  2. Anti-climax

    View Slide

  3. front end vs. frontend

    View Slide

  4. Not really about choice

    View Slide

  5. ‘I’m a backend guy living in a
    frontend world’

    View Slide

  6. About me

    View Slide

  7. @myabc
    Alex Coles
    Berlin, Germany
    Finn GmbH

    View Slide

  8. OpenProject
    openproject.org

    View Slide

  9. 1..2..3

    View Slide

  10. eurucamp
    eurucamp.org
    Call for Papers open
    until 1st May

    View Slide

  11. 1..2..3

    View Slide

  12. jeden
    one: background

    View Slide

  13. Single page v traditional HTML

    View Slide

  14. SPA depends on your content

    View Slide

  15. no kupa, Sherlock

    View Slide

  16. What’s your content?
    Information Pages
    Membership sites
    Closed Systems

    View Slide

  17. Content Criteria
    • Authentication
    • Caching
    • Indexing (SEO)
    • curated Content vs Dynamic

    View Slide

  18. dwa
    two: where we are now

    View Slide

  19. History of the Rails Interface

    View Slide

  20. “Rails is so 2005”

    View Slide

  21. “Rails Way” back in 2005
    • Server Generated HTML (ERB,
    etc.)
    • Prototype
    • Scriptaculous
    • RJS

    View Slide

  22. “Rails Way” now
    • Server Generated HTML (ERB,
    Slim, HAML etc.)
    • jQuery
    • jQuery UI
    • Server generated JavaScript
    Responses (SJR)

    View Slide

  23. Where we are now

    View Slide

  24. JavaScript is HUGE

    View Slide

  25. No backend
    nobackend.org

    View Slide

  26. Hoodie
    hood.ie

    View Slide

  27. Meteor
    www.meteor.com

    View Slide

  28. but I <3 Ruby

    View Slide

  29. So here’s the question

    View Slide

  30. View Slide

  31. Room for Rails?

    View Slide

  32. The Rails Way

    View Slide

  33. – Marcin Stecki @madsheep at wroc_love.rb
    “Not his [DHH]'s responsibility to tell us how to do
    these things.”

    View Slide

  34. Frontend frameworks

    View Slide

  35. Frontend (MV*) frameworks
    • AngularJS
    • Ember.js
    • KnockoutJS

    View Slide

  36. Frontend (component)
    frameworks
    • ReactJS
    • Backbone.View (alone)
    • ExtJS

    View Slide

  37. TodoMVC
    todomvc.com

    View Slide

  38. KnockoutJS

    View Slide

  39. AngularJS

    View Slide

  40. Ember.js

    View Slide

  41. What is most like Rails?

    View Slide

  42. Ember.js is most like Rails
    • Everything should inherit from Ember.Object

    (think ActiveRecord::Base.inherited)
    • Routing DSL
    • Vocabulary (templates, partials, etc.)

    View Slide

  43. trzy
    three: practical usage

    View Slide

  44. Using asset pipeline / sprockets

    View Slide

  45. Use Bower

    View Slide

  46. gem install bower-rails

    View Slide

  47. Rails 4 (Sprockets 2+)

    View Slide

  48. config.assets.paths << File.join(Rails.root,
    'vendor', 'assets', ‘components')

    View Slide

  49. ember-rails-api
    github.com/dockyard/ember-appkit-rails

    View Slide

  50. View Slide

  51. What is the way forward?

    View Slide

  52. Split Completely

    View Slide

  53. Two applications: one API, one
    frontend

    View Slide

  54. Rails or Sinatra for API

    A JS workflow for Frontend

    View Slide

  55. Surprisingly testable (and fast)

    View Slide

  56. Dzięki!

    View Slide

  57. Questions?

    View Slide

  58. @myabc

    View Slide