Backbone.
Podstawy, dobre praktyki, rozszerzanie możliwości.

@krzepa

Text

Jeremy Ashkenas

  • documentcloud.org
  • Backbone.js
  • Underscore.js
  • CoffeScript

Czy warto?

  • Popularność
  • Oferty pracy
  • Łatwość nauki

Kto używa?

  • documentcloud.org
  • linkedin.com
  • soundcloud.com
  • www.walmart.com
  • i inni

Czym jest Backbone.js?

Framework czy biblioteka?

MVC, MVP czy MV*?

MODEL

PRESENTER

VIEW

DOM,

 templates

Backbone.View,
Backbone.Router
Backbone.Model,
Backbone.Collection

Zależności

  • jQuery (Zepto.js)
  • Underscore.js (lodash)

Backbone.View

  • el vs $el
  • events
  • initialize
  • render

Backbone.Model

  • defaults,
  • set, get
  • fetch
  • toJSON

Backbone.Collection

  • model
  • metody Underscore.js

Backbone.Router

  • routes
  • navigate
  • Backbone.history

Dobre praktyki

  • Moduły
  • Workflow
  • Przekazywanie eventów
  • Optymalizacje
    przy renderowaniu
  • Szablony

Moduły

  • IFFE oraz namespacing
  • Require.js (albo Webpack, Browserify)

SOLID

Workflow

  • Sprawdzanie poprawności kodu
  • Minimalizacja, obfuskacja
  • Bundlowanie
    (Require.js - r.js i almond, przykłady)

Po co?

  • Grunt, Gulp i/lub JavaScript IDE
  • Yeoman

Jak?

Przekazywanie eventów

  • pub/sub pattern
  • EventBus, MessageBus
  • Backbone (on, off, trigger)

Szablony

  • Underscore.js, Handlebars.js, Moustache.js
  • Odzielenie kodu HTML od JavaScript
  • Osadzone na stronie, a ładowane
    (poprzez np. pluginy Require.js)

Optymalizacja przy renderowaniu

  • Odłączenie elementu i ponowne dodanie
  • DocumentFragment
  • React zamiast View
    TodoMVC

Rozszerzanie możliwości

Ampersand.js

Webpack

EcmaScript2015

React

js-skeleton

Książki, tutoriale, itd.

Dziękuję :)

Backbone

By Radoslaw Krzepkowski