Preface |
|
xi | |
|
|
1 | (8) |
|
|
2 | (1) |
|
|
2 | (1) |
|
When Do I Need a JavaScript MVC Framework? |
|
|
3 | (1) |
|
Why Consider Backbone.js? |
|
|
4 | (1) |
|
|
5 | (4) |
|
|
9 | (18) |
|
|
9 | (1) |
|
|
9 | (1) |
|
|
10 | (3) |
|
Client-Side MVC and Single-Page Apps |
|
|
13 | (2) |
|
Client-Side MVC: Backbone Style |
|
|
15 | (3) |
|
|
18 | (3) |
|
|
21 | (1) |
|
|
21 | (1) |
|
|
22 | (1) |
|
|
22 | (1) |
|
|
22 | (1) |
|
|
22 | (1) |
|
|
23 | (4) |
|
|
27 | (46) |
|
|
27 | (1) |
|
|
28 | (1) |
|
|
29 | (1) |
|
|
30 | (2) |
|
Listening for Changes to Your Model |
|
|
32 | (2) |
|
|
34 | (1) |
|
|
35 | (1) |
|
|
36 | (1) |
|
|
36 | (6) |
|
|
42 | (1) |
|
Adding and Removing Models |
|
|
42 | (1) |
|
|
43 | (1) |
|
|
44 | (2) |
|
Resetting/Refreshing Collections |
|
|
46 | (2) |
|
Underscore Utility Functions |
|
|
48 | (4) |
|
|
52 | (1) |
|
|
53 | (1) |
|
Fetching Models from the Server |
|
|
53 | (1) |
|
Saving Models to the Server |
|
|
54 | (1) |
|
Deleting Models from the Server |
|
|
54 | (1) |
|
|
55 | (1) |
|
|
55 | (1) |
|
on(), off(), and trigger() |
|
|
56 | (3) |
|
listenTo() and stopListening() |
|
|
59 | (1) |
|
|
60 | (2) |
|
|
62 | (2) |
|
|
64 | (2) |
|
|
66 | (2) |
|
|
68 | (2) |
|
|
70 | (1) |
|
|
70 | (3) |
|
4 Exercise 1: Todos-Your First Backbone.js App |
|
|
73 | (22) |
|
|
74 | (1) |
|
|
74 | (1) |
|
|
75 | (1) |
|
|
76 | (1) |
|
|
77 | (1) |
|
|
78 | (1) |
|
|
79 | (6) |
|
|
85 | (2) |
|
|
87 | (1) |
|
|
87 | (2) |
|
Completing and Deleting Todos |
|
|
89 | (3) |
|
|
92 | (2) |
|
|
94 | (1) |
|
5 Exercise 2: Book Library-Your First RESTful Backbone.js App |
|
|
95 | (30) |
|
|
95 | (5) |
|
Creating the Model, Collection, Views, and App |
|
|
100 | (3) |
|
|
103 | (1) |
|
|
103 | (2) |
|
|
105 | (1) |
|
|
106 | (1) |
|
Install Node.js, npm, and MongoDB |
|
|
106 | (1) |
|
|
106 | (1) |
|
Create a Simple Web Server |
|
|
107 | (2) |
|
|
109 | (7) |
|
|
116 | (7) |
|
|
123 | (2) |
|
|
125 | (28) |
|
MarionetteJS (Backbone.Marionette) |
|
|
125 | (2) |
|
Boilerplate Rendering Code |
|
|
127 | (1) |
|
Reducing Boilerplate with Marionette.ItemView |
|
|
128 | (1) |
|
|
128 | (4) |
|
|
132 | (1) |
|
|
133 | (10) |
|
Is the Marionette Implementation of the Todo App More Maintainable? |
|
|
143 | (1) |
|
Marionette and Flexibility |
|
|
144 | (1) |
|
|
145 | (1) |
|
|
145 | (1) |
|
|
146 | (1) |
|
|
146 | (1) |
|
|
147 | (1) |
|
|
148 | (1) |
|
Custom HTML Data Attributes |
|
|
149 | (2) |
|
|
151 | (1) |
|
|
151 | (2) |
|
7 Common Problems and Solutions |
|
|
153 | (26) |
|
Working with Nested Views |
|
|
153 | (1) |
|
|
153 | (1) |
|
|
153 | (1) |
|
|
154 | (1) |
|
|
155 | (1) |
|
|
155 | (2) |
|
Managing Models in Nested Views |
|
|
157 | (1) |
|
|
157 | (1) |
|
|
157 | (1) |
|
Rendering a Parent View from a Child View |
|
|
158 | (1) |
|
|
158 | (1) |
|
|
158 | (1) |
|
Disposing View Hierarchies |
|
|
159 | (1) |
|
|
159 | (1) |
|
|
159 | (1) |
|
Rendering View Hierarchies |
|
|
160 | (1) |
|
|
160 | (1) |
|
|
160 | (1) |
|
Working with Nested Models or Collections |
|
|
161 | (1) |
|
|
161 | (1) |
|
|
161 | (1) |
|
Better Model Property Validation |
|
|
162 | (1) |
|
|
162 | (1) |
|
|
162 | (2) |
|
|
164 | (2) |
|
|
166 | (1) |
|
Form-Specific Validation Classes |
|
|
167 | (1) |
|
Avoiding Conflicts with Multiple Backbone Versions |
|
|
167 | (1) |
|
|
167 | (1) |
|
|
167 | (1) |
|
Building Model and View Hierarchies |
|
|
168 | (1) |
|
|
168 | (1) |
|
|
168 | (1) |
|
Calling Overridden Methods |
|
|
169 | (2) |
|
|
171 | (1) |
|
Event Aggregators and Mediators |
|
|
171 | (1) |
|
|
171 | (1) |
|
|
172 | (1) |
|
|
172 | (1) |
|
|
173 | (1) |
|
Similarities and Differences |
|
|
174 | (1) |
|
Relationships: When to Use Which |
|
|
175 | (1) |
|
Event Aggregator and Mediator Together |
|
|
176 | (1) |
|
Pattern Language: Semantics |
|
|
177 | (2) |
|
|
179 | (16) |
|
Organizing Modules with RequireJS and AMD |
|
|
180 | (1) |
|
Maintainability Problems with Multiple Script Files |
|
|
180 | (1) |
|
Need for Better Dependency Management |
|
|
181 | (1) |
|
Asynchronous Module Definition (AMD) |
|
|
181 | (1) |
|
Writing AMD Modules with RequireJS |
|
|
181 | (2) |
|
Getting Started with RequireJS |
|
|
183 | (3) |
|
Require.js and Backbone Examples |
|
|
186 | (3) |
|
Keeping Your Templates External Using RequireJS and the Text Plug-in |
|
|
189 | (1) |
|
Optimizing Backbone Apps for Production with the RequireJS Optimizer |
|
|
190 | (3) |
|
|
193 | (2) |
|
9 Exercise 3: Your First Modular Backbone and RequireJS App |
|
|
195 | (12) |
|
|
195 | (1) |
|
|
196 | (1) |
|
|
197 | (1) |
|
Modularizing Our Models, Views, and Collections |
|
|
198 | (5) |
|
Route-Based Module Loading |
|
|
203 | (1) |
|
JSON-Based Module Configuration |
|
|
203 | (1) |
|
|
204 | (1) |
|
Using NodeJS to Handle pushState |
|
|
205 | (1) |
|
An Asset Package Alternative for Dependency Management |
|
|
206 | (1) |
|
10 Paginating Backbone.js Requests and Collections |
|
|
207 | (18) |
|
|
208 | (1) |
|
|
209 | (1) |
|
|
209 | (4) |
|
|
213 | (1) |
|
|
214 | (2) |
|
|
216 | (2) |
|
|
218 | (2) |
|
|
220 | (1) |
|
|
221 | (1) |
|
|
221 | (2) |
|
|
223 | (2) |
|
11 Backbone Boilerplate and Grunt-BBB |
|
|
225 | (16) |
|
|
227 | (1) |
|
|
227 | (1) |
|
|
228 | (1) |
|
|
229 | (2) |
|
|
231 | (1) |
|
|
232 | (2) |
|
Creating Backbone Boilerplate Modules |
|
|
234 | (2) |
|
|
236 | (1) |
|
Other Useful Tools and Projects |
|
|
237 | (1) |
|
|
238 | (1) |
|
|
239 | (1) |
|
|
240 | (1) |
|
12 Backbone and jQuery Mobile |
|
|
241 | (24) |
|
Mobile App Development with jQuery Mobile |
|
|
241 | (1) |
|
The Principle of Progressive Widget Enhancement by jQMobile |
|
|
242 | (1) |
|
Understanding jQuery Mobile Navigation |
|
|
243 | (2) |
|
Basic Backbone App Setup for jQuery Mobile |
|
|
245 | (3) |
|
Workflow with Backbone and jQueryMobile |
|
|
248 | (1) |
|
Routing to a Concrete View Page, Inheriting from BasicView |
|
|
249 | (1) |
|
Management of Mobile Page Templates |
|
|
250 | (2) |
|
DOM Management and mobile.changePage |
|
|
252 | (4) |
|
Applying Advanced jQM Techniques to Backbone |
|
|
256 | (1) |
|
|
256 | (1) |
|
Intercepting jQuery Mobile Events |
|
|
257 | (1) |
|
|
258 | (1) |
|
Clever Multiplatform Support Management |
|
|
259 | (6) |
|
|
265 | (24) |
|
Behavior-Driven Development |
|
|
265 | (2) |
|
|
267 | (4) |
|
beforeEach() and afterEach() |
|
|
271 | (2) |
|
|
273 | (1) |
|
|
274 | (1) |
|
|
275 | (1) |
|
|
275 | (2) |
|
|
277 | (2) |
|
|
279 | (1) |
|
|
280 | (7) |
|
|
287 | (1) |
|
|
288 | (1) |
|
|
288 | (1) |
|
|
289 | (14) |
|
|
289 | (1) |
|
Sample HTML with QUnit-Compatible Markup |
|
|
290 | (2) |
|
|
292 | (1) |
|
Basic Test Case Using test(name, callback) |
|
|
293 | (1) |
|
Comparing the Actual Output of a Function Against the Expected Output |
|
|
293 | (1) |
|
Adding Structure to Assertions |
|
|
294 | (1) |
|
|
294 | (1) |
|
Using setup() and teardown() |
|
|
294 | (1) |
|
Using setup() and teardown() for Instantiation and Clean Up |
|
|
295 | (1) |
|
|
296 | (1) |
|
|
297 | (1) |
|
|
298 | (2) |
|
|
300 | (3) |
|
|
303 | (12) |
|
|
303 | (1) |
|
|
304 | (1) |
|
Spying on Existing Functions |
|
|
304 | (1) |
|
|
304 | (2) |
|
|
306 | (1) |
|
|
306 | (2) |
|
|
308 | (1) |
|
|
308 | (1) |
|
|
309 | (1) |
|
|
310 | (1) |
|
|
311 | (2) |
|
|
313 | (1) |
|
Further Reading and Resources |
|
|
314 | (1) |
|
|
315 | (4) |
A Further Learning |
|
319 | (18) |
B Resources |
|
337 | (2) |
Index |
|
339 | |