to 

PABLO MARTIN MUÑOZ ¿Who am I? Open Source Architect & Data Scientist @edipotrebol 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ www.flickr.com: adactio The new multiscreen world 

The future: ubiquitous computing Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ THE PROBLEM 3 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ THE SOLUTION 4 MULTIMEDIA PERFORMANCE & INTEGRATION 3D GRAPHICS, EFFECTS CSS3 STYLING OFFLINE & STORAGE DEVICE ACCES HTML SEMANTICS CONECTIVITY 

“We can do 95% of what we want to do with HTML5” 5 Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ Thom Cummings (VP Marketing at SoundCloud) February 2012 

THE EVOLUTION OF APLICATIONS 6 Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ Desktop applications Web apps Web applications Apps 2000`s 2010`s 

THE EVOLUTION OF THE WEB 7 Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ - Security - Storage - User interface - Business logic - Storage 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ “This is the best time ever to be a software developer” 8 Steve Ballmer (Microsoft CEO) September 2011 

EMBER.JS 9 Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ Javascript framework for creating ambitious web applications that eliminates boilerplate and provides a standard application architecture. emberjs.com 

Classes for OO programming 10 Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ Person = Ember.Object.extend({ firstName: null, lastName: null }); 

Mixins for aspect programming 11 Speaker = Ember.Mixin.create({ hello: function() { var first = this.get(‘firstName’), last = this.get(‘lastName’); alert(first + ‘ ‘ + last + ‘: HELLO!’); } }); Person = Ember.Object.extend(Speaker); Person.create({ firstName: ‘Tom’, lastName: ‘Dale’ }).hello(); Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ 

Computed properties 12 Person = Ember.Object.extend({ fullName: function(){ var firstName = this.get(‘firstName’), lastName = this.get(‘lastName’); return firstName + ‘ ‘ + lastName; }.property(‘firstName’, ‘lastName’); }); var tom = Person.create({ firstName: ‘Tom’, lastName: ‘Dale’ }); alert(tom.get(‘fullName’)); Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ ARCHITECTURE 13 Router (Domain) (States) Models Controllers Views (Application data) (User interface) 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ MODELS (EMBER DATA) 14 • Domain Schema • Client Side ORM for REST API • Relations definition (hasMany, hasOne, belongsTo) • Queries (find, findQuery, findAll) • Create, Update, Delete • Backend independent 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ VIEWS 15 • Manage data visualization and user events • Sends events to router • View hierarchy • Handlebars as a template engine 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ CONTROLLERS 16 • Between Models and Views (and Router) • Very little logic • Application data 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ ROUTER (STATES) 17 • Responds to events from view • Transitions to new events • Saves application data into controllers 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ EMBERJS USES JQUERY AS A DEPENDENCY FOR 18 • DOM manipulation • Event delegation • AJAX request 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ EMBER.JS... 19 • Manages complexity • MIT-license • More productive • 100% Open SOurce • Built by the comunity (https://github. com/emberjs) 

WHO USES EMBER.JS? 20 Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ 

WHAT´S YOIN? 21 Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ The invitation experience yoinup.com 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ WE USE EMBER.JS AND MORE 22 

Yoi n to E m b e r 1 5 . 1 1 . 2 0 1 2 PA B LO M A RT I N M U Ñ OZ We are hiring! 

Thanks! Design: @alelopbes