12. There’s a spectrum of
development...
Party like
it’s 1998 Gmail
Server Client
Server Side Client Side
Post back Ajax
Where we’ll be today
Monday, October 18, 2010
13. The app boot process...
- Download resources
- Execute scripts
- Wait for the DOM
Monday, October 18, 2010
14. We think of client side
development in a DOM centric
approach because that’s our
roots
Monday, October 18, 2010
15. How do we organize this?
Monday, October 18, 2010
16. Once again it’s a
spectrum...
Server Client
Server Client
generated generated
? ? ?
Monday, October 18, 2010
31. Server
Data HTML, CSS, JavaScript
Request Core Other
Manager Application Services
Pub / Sub
View Manager
Monday, October 18, 2010
32. The View
// Canvas manager
(function(app) {
app.ui.canvas = {
add: function(panel) {
var id = $(panel).attr(“id”) || randomId();
$(panel).appendTo(“#panels”);
app.bus.publish(
“ui.canvas.added”, {“id”:id});
return id;
}
};
})(window.app);
Monday, October 18, 2010
33. The View
// Panel
(function(app) {
app.ui.panel = {
create: function(options) {
var dom = $(“<div>...</div>”);
dom.bind(“updateContacts”, function(e,data){
// Update the DOM with new contact data
...
});
return dom;
}
};
})(window.app);
Monday, October 18, 2010
34. The View
// UI Controller
(function(app) {
app.ui.manager = {
init: function init() {
var p = app.ui.panel.create({...});
app.ui.canvas.add(p);
app.bus.subscribe(
“contact.list”, function(data) {
p.trigger(‘updateContacts’, data);
});
}
};
app.bus.subscribe(
“contacts.ui.load”, app.ui.manager.init);
})(window.app);
Monday, October 18, 2010
35. What have we done?
- Protected data sources
- Protected the DOM
- Testing is easier
- Scales to teams
- Front-end backend balance
Monday, October 18, 2010
36. So remember...
- Discrete components
- “I’m an integrator”
- and as such think about the APIs
Monday, October 18, 2010
37. appendTo will be releasing
amplify as open source
Monday, October 18, 2010
38. ...yee haw!
Flickr @ martinvirtualtours
Monday, October 18, 2010
39. App in a Browser
jQuery Conference 2010
Boston, Massachusetts
@jdsharp
Monday, October 18, 2010