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

Superior service-based web apps with Brunch and Chaplin

paulmillr
November 18, 2012

Superior service-based web apps with Brunch and Chaplin

A tale on building cool web services with http://brunch.io and http://chaplinjs.org

paulmillr

November 18, 2012
Tweet

More Decks by paulmillr

Other Decks in Programming

Transcript

  1. Superior
    service-based
    web apps with
    Brunch and Chaplin

    View Slide

  2. @paulmillr

    View Slide

  3. It’s 2012, after all
    Service-based web apps
    Why?

    View Slide

  4. Maintability
    Service-based web apps
    Can develop both of them in
    parallel
    Frontend decoupled from backend

    View Slide

  5. Speed & costs
    Service-based web apps
    Server costs decreased
    by a factor of 10+
    Super fast & responsive feel

    View Slide

  6. Dogfooding!
    Both parts become easier to
    maintain
    Service-based web apps

    View Slide

  7. Open-source
    Can open-source front freely
    (in some types of apps)
    Service-based web apps

    View Slide

  8. Open-source
    Increases company reputation
    Good API usage exampleCloud.
    app
    itHub
    Service-based web apps

    View Slide

  9. Problems
    Service-based web apps
    Live reload
    Compiling LESS / Stylus / SASS

    View Slide

  10. Problems
    Service-based web apps
    Modules
    Compiling Coffee / Type / Live
    scripts

    View Slide

  11. Problems
    Service-based web apps
    Linting
    Templates
    Scaffolding
    Testing

    View Slide

  12. Solutions
    Service-based web apps
    Some DOM lib a-la jQuery?
    Some DOM lib a-la jQuery?
    Nope! Too unmaintainable.

    View Slide

  13. We need
    Service-based web apps
    Generator
    Builder
    Tester
    Scaffolder

    View Slide

  14. Brunch
    brunch.io

    View Slide

  15. Brunch
    6 commands
    new build watch
    generate destroy test

    View Slide

  16. Structure
    (app)

    View Slide

  17. Deployal
    Optimization with
    simple flag
    brunch build --minify

    View Slide

  18. Brunch 1.5
    component(1) support
    source maps

    View Slide

  19. Brunch
    Alternatives
    CodeKit
    LiveReload
    Yeoman (grunt)

    View Slide

  20. Chaplin
    chaplinjs.org

    View Slide

  21. Chaplin
    Why backbone?
    Super lightweight & simple
    The most popular
    Well-tested

    View Slide

  22. Chaplin
    Backbone.js has problems
    Unusable as an app architecture

    View Slide

  23. Chaplin
    Chaplin solutions
    Memory management Forced modularity
    Rails routes
    Mediator
    (global events management)
    Collection
    View
    Layout
    Controllers
    (MVP “presenters”)

    View Slide

  24. Chaplin
    Alternatives
    Aura: sort of different
    Marionette: sort of similar

    View Slide

  25. Chaplin
    v1.0
    coming soon

    View Slide

  26. Paul Miller
    paulmillr.com
    @paulmillr

    View Slide