O'Reilly logo

Full Stack Web Development with Backbone.js by Patrick Mulder

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

Chapter 7. Synchronizing State

In the previous chapters, you got a first feeling of state in the browser. You learnt the basics on Backbone views, models and collections to manage state. But to build a real app, you must connect your collections and models to an API. These are the enhancements of Backbone collections that we haven’t discussed so far.

One of the main purposes of a Backbone collection is to fetch new information (or state) over a network. To understand the basic ideas here, you need to understand a bit of RESTful principles for APIs, and how Backbone maps these internally to the API of collections and models.

In the case of the Munich Cinema example, when a collection manages 10 or hundreds of movies, new questions on filtering and sorting movies arise. Dealing with more data takes also an important role in our customer’s project: Munich Cinema wants to allow their customers to search for movies by release date and genres. To help customers decide which movies to watch, Munich Cinema prepared ratings of movies that might further distill a movie search.

So, we must expand our application with a number of features:

  • Setup a mock of a RESTful API
  • Fetching remote data from an API
  • Understand time effects around fetching
  • Basics of hosted API services

Fetching Remote Movies

So far, the examples was based on a few movies directly linked with the initial page load. Munich Cinema’s movie program is much larger though, especially during festival season. For this, users can select ...

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

Start Free Trial

No credit card required