O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Backbone.js Patterns and Best Practices

Book Description

Improve your Backbone.js skills with this step-by-step guide to patterns and best practice. It will help you reduce boilerplate in your code and provide plenty of open source plugin solutions to common problems along the way.

In Detail

Backbone.js is a super light framework that allows you to structure your JavaScript codes in an MV* fashion. This framework is an excellent tool when it comes to creating an organized and modular code base for web apps of any size or complexity. Although lightweight, Backbone.js results in lots of boilerplate. Learning the best practices and design patterns will help you avoid these problems and allow you to ensure that the best standards are followed.

Backbone.js Patterns and Best Practices is packed with examples that will help you work with Backbone.js components. It also gives solutions to common problems faced by developers. It gives a complete overview of plugin development, large scale application architecture, and unit testing as well.

Starting with a discussion of why reducing boilerplate in your JavaScript code is essential, Backbone.js Patterns and Best Practices explains how to enforce reusability in your code by creating plugins and mixins. You will learn about patterns and best practices for Backbone views, models, collections, routers, and events.

You will discover solutions to common problems that developers face through simple examples, and delve into the best open source plugins available to solve these problems when they arise. This book is an excellent collection of design and implementation patterns that will help you structure and develop complex Backbone.js applications easily.

What You Will Learn

  • Develop custom plugins and mixins to reduce boilerplate in your code
  • Learn about Backbone view management with nested views, subviews, layout manager, and Marionette views
  • Understand template management by storing and pre-compiling templates
  • Explore model validation with validation plugins and learn model serialization and relational data management with nested models
  • Work with collections to implement multiple sorting and filtering behavior
  • Create solid application architecture with AMD and different popular design patterns

Table of Contents

  1. Backbone.js Patterns and Best Practices
    1. Table of Contents
    2. Backbone.js Patterns and Best Practices
    3. Credits
    4. About the Author
    5. Acknowledgments
    6. About the Reviewers
    7. www.PacktPub.com
      1. Support files, eBooks, discount offers and more
        1. Why Subscribe?
        2. Free Access for Packt account holders
    8. Preface
      1. What this book covers
      2. What you need for this book
      3. Who this book is for
      4. Conventions
      5. Reader feedback
      6. Customer support
        1. Downloading the example code
        2. Errata
        3. Piracy
        4. Questions
    9. 1. Reducing Boilerplate with Plugin Development
      1. Basic components of Backbone.js
      2. Using Underscore.js
      3. Re-using code with extensions
        1. Creating a base class
        2. Developing plugins without extending base classes
      4. Understanding JavaScript mixins
        1. What is a mixin?
        2. Creating classic mixins
        3. Creating functional mixins
          1. Caching mixin functions
          2. Using curry to combine a function and arguments
      5. Summary
    10. 2. Working with Views
      1. Basic usage of views
        1. Understanding the el property
        2. Listening to view events
        3. Displaying model data with templates
      2. Partially updating a view
      3. Understanding nested views
        1. Knowing when to use subviews
        2. Avoiding multiple DOM reflow
        3. Re-rendering parent views
        4. Removing parent views
      4. Working with templates
        1. Storing templates in an HTML file
        2. Storing templates in a JavaScript file
        3. Precompiling templates
        4. Avoiding evaluation in templates
        5. Using template helper functions
      5. Understanding automatic model-view data binding
      6. Using Marionette's ItemView, CollectionView, and CompositeView
        1. ItemView
        2. CollectionView
        3. Working with CompositeView
      7. Using Layout Manager
      8. Summary
    11. 3. Working with Models
      1. Basic usage of models
        1. Using the defaults property
          1. Avoiding object references in the defaults property
        2. Data interaction with the server
          1. Creating a model
          2. Updating a model
          3. Fetching a model
          4. Deleting a model
      2. Validating the data
        1. Using the Backbone.Validation plugin
          1. Configuring validation rules
          2. Prevalidating a model with the preValidate() method
      3. Serializing models
      4. Understanding the relational data model
      5. Summary
    12. 4. Working with Collections
      1. Basic usage of collections
        1. Performing data operations with collections
          1. Fetching data from the server
          2. Saving data to the server
      2. Sorting a collection
        1. Sorting a collection with multiple attributes
      3. Filtering a collection
        1. Performing basic filtering
        2. Filtering a collection with a duplicate collection
        3. Self-filtering with full data pointers
      4. Understanding the collection of multiple model types
      5. Summary
    13. 5. Routing Best Practices and Subrouting
      1. Working with routers
      2. Best practices for working with routers
        1. Avoiding large functional code in route methods
        2. Instantiating views in router methods
        3. Using regular expressions for selective routing
      3. Subrouting – a key to organizing complex apps
        1. The all-in-one router
        2. The base router
        3. The Users module router
      4. Summary
    14. 6. Working with Events, Sync, and Storage
      1. Understanding custom events
        1. A simple case study on custom events
      2. Using an event dispatcher
        1. Creating multiple event dispatchers
        2. Using different event namespaces
      3. Avoiding memory leaks with the listenTo() method
      4. Overriding the Backbone.sync() method
      5. Offline storage using the Backbone.LocalStorage adapter
      6. Summary
    15. 7. Organizing Backbone Applications – Structure, Optimize, and Deploy
      1. Understanding the application directory structure
      2. Working with Asynchronous Module Definition
        1. Adding Require.js to your project
        2. Configuring dependencies
        3. Defining a module
      3. Creating application architecture
        1. Managing a project directory
        2. Organizing code with AMD
        3. Setting up an application
          1. Using the module pattern
          2. Managing objects and module communication
            1. Using the observer/PubSub pattern
            2. Using the mediator pattern
        4. Understanding view management
        5. Understanding other important features
      4. Summary
    16. 8. Unit Test, Stub, Spy, and Mock Your App
      1. Understanding why unit testing is important
      2. Testing with QUnit
        1. Performing a basic test case
        2. Understanding the QUnit module (), setup (), and teardown () methods
        3. Testing Backbone.js components with QUnit
      3. Using test spies, stubs, and mocks with SinonJS
        1. Testing with spies
        2. Testing with stubs
        3. Testing with mocks
          1. Difference between mocks and stubs
      4. Summary
    17. A. Books, Tutorials, and References
      1. Books for reference
      2. Tutorials
        1. Unit testing
        2. Other plugins and tutorials
    18. B. Precompiling Templates on the Server Side
    19. C. Organizing Templates with AMD and Require.js
      1. Precompiling with the requirejs-tpl plugin
    20. Index