Developing a Backbone.js Edge
Preface
Let's cover the big picture before jumping into the first chapter...
What is Backbone?
Backbone is a JavaScript library designed to give structure to your web applications. It provides abstractions to manage your data, handle single-page navigation, and manage rendering and events for components on your pages. Backbone gives you a robust, yet flexible framework to build your client-side JavaScript applications.
Who is this book for?
This book is for beginner to intermediate JavaScript developers who are new to Backbone, or perhaps haven't created complex client-side JavaScript applications. Basic jQuery knowledge will be beneficial, but is not essential.
This book is Backbone 1.0 compliant.
In Chapter 1: The Setup we cover some basic programming best-practices, and then continue with gaining a full understanding of Backbone.
Why Backbone?
Backbone brings structure to your code. It is an incredibly flexible library and is used in widgets like Disqus, large content apps like USA Today and project management tools like Trello. There is a clear trend away from static websites to dynamic web applications. From traditional software to HTML5 applications in the browser, Backbone gives you the building blocks to develop these applications.
Why can't I just do everything on the server?
The short answer is: because it's slow. Using Backbone allows you to provide a more fluid user experience, compared to re-rendering every page and interaction on the server. Modern browsers have fast JavaScript engines and users are accustomed to JavaScript-based applications such as Gmail and Google Docs.
Why can't I just use jQuery?
jQuery alone is not enough. It provides a lot of functionality, but no structure. Backbone isn't a replacement for jQuery--it actually requires jQuery (or Zepto). Backbone brings modularity and best practices to your jQuery-based application. jQuery.ajax() is used by Backbone Sync to interact with REST APIs, for example, and jQuery's delegated events are used in Backbone Views to provide efficient, declarative event binding.
What is MVC & MV*?
MVC is an acronym for the Model, View, Controller design pattern. This pattern is commonly used in server-side frameworks, for example: Ruby on Rails, Django, Zend Framework and ASP.NET MVC. The pattern encourages a clear separation between your data and how users interact with that data, while encouraging code to be split up into these logical pieces. Backbone doesn't follow a strict MVC pattern, and is often referred to as a Model-View-Star (MV*) framework.
You will find a more in-depth discussion to these principles in the Chapter 5: Models chapter.
Why Backbone rather than framework x?
Backbone doesn't force you into a particular coding style or paradigm. There is no "magic" happening below the surface: the source code is clear, readable and well commented. Backbone is also "lightweight" in the sense that it doesn't require a ton of buy-in to use. It can be easily integrated into an existing page, and you can choose to only use certain components of the library (Views without Models or Collections, for example). Although there are many frameworks that seem to be faster to get started with, Backbone's lack of surprises, clear documentation, and speed and flexibility make it a good fit for all types of applications.
Backbone also has a large community of users who have produced all manner of plugins to extend Backbone. If there is a particular feature from framework x that you wish was in Backbone, the chances are that it will already be implemented as a plugin. This bare bones, modular approach to web development, yields great returns in the long run when compared to being locked into a monolithic framework.
The Backbone documentation has many examples of applications built with Backbone and some more answers to the question, "Why Backbone?"
Why this book?
While there are many online resources for learning Backbone, we felt that there was space for a full guide to the library. This book incorporates best practices and the techniques from our combined experience of developing many Backbone applications. Some of the resources on the web advocate inefficient or inelegant solutions and there are few that cover the whole library. In this book we aim to provide a complete guide to Backbone and equip you to start using the library straight away.
We will cover all aspects of the Backbone library, so by the time you finish this book, you should feel comfortable starting a Backbone project from scratch on your own. The tricky thing is understanding what solutions make sense for which problems, and while we do our best to point out gotchas and explain "best practices," we guarantee you will encounter problems that we haven't yet. Nothing outweighs experience.
While writing this book we developed an example application called Hubbub to illustrate the various features of the library. Don't worry, it's not another "Todo App," rather it is a GitHub issue organizer. The application is more complex than most "example" applications and uses a real API (GitHub's). You'll have a chance to build the application as you go through the book.
About the authors
Casey Foster is a Backbone.js contributor and web developer specializing in client and server-side JavaScript. He holds a degree in Computer Science from California State University, Fullerton. He would like to thank his wife Lacey and puppy Gunner for all their support in everything he does. He can be found on GitHub: github.com/caseywebdev.
Aidan Feldman is a Backbone.js contributor and developer at Jux. He is also a faculty member at both General Assembly, and NYU School of Continuing and Professional Studies, He is an organizer of Hacker Hours, which offers free office hours for programming help. His open-sorcery can be found on GitHub: github.com/afeld.
Dave Tonge is a Backbone.js contributor and web developer at Simple Creativity. GitHub: github.com/davidgtonge.
Phil Freo is a Backbone.js contributor working on Close.io at Elastic. He previously led the engineering team at Quizlet, building study tools that millions of students relied upon. He has also interned at Google and Yahoo! as a software engineer. He would like to thank his co-authors. It was a pleasure working with such a talented group of guys, and the book sprint writing format was a unique experience. He would also like to thank his wife Kristin for giving him time to write, and all the Backbone.js contributors who make the project great. And finally, he would like to thank to all the readers! You can find Phil at PhilFreo.com or on Twitter @philfreo. He can also be found on GitHub: github.com/philfreo.
Tim Branyen is a Backbone.js contributor and writes JavaScript at Matchbox. He is also a weekend Skydiver and maintainer of several open source projects. He can be found on GitHub: github.com/tbranyen.
Acknowledgements
We would like to thank the following reviewers who offered their time to make this book even more valuable:
Kedar Prabhu, Joseph Kokenge, Kevin Roche, Ope Bukola, Eric Ti Yu Chiang, Will Sommers, Roman Sharf, Dan Applegate and Brennan Moore. And special thanks goes to Raymond Julin who not only checked code and provided valuable feedback, but jumped in there at the last minute and reworked our View chapter.