Getting Started with Ember.js
What's this session about?
Ember.js, duh
Can I download your files?
You sure can!
about me
- I write: jQuery Mobile Web Development Essentials
- I blog: andyMatthews.net
- I tweet: @commadelimited
- I code: Github.com/commadelimited
Ember.js tl;dr
- Been around since 2011
- JavaScript MVC framework
- Based on SproutCore
- Current version 0.9.8.1
- Supports 2 way data binding, computed properties, built-in templating, and more.
- Has really strong community support
- Better than Backbone.js
window.App = Ember.Application.create({
greeting: 'ID of Nashville ROCKS!'
});
<!doctype html>
<html>
<head>
<script src="js/libs/jquery-1.7.2.min.js"></script>
<script src="js/libs/ember-0.9.8.1.min.js"></script>
<script src="js/app.js"></script>
</head>
<body>
<script type="text/x-handlebars">
Say what? {{App.greeting}}
</script>
</body>
</html>
Say what? IDoN Rocks!
What's MVC?
Cookies
Model
App.Cookie = Ember.Object.extend({
diameter: '3in',
thickness: '.5in'
});
View
App.kitchenView = Ember.View.create({
templateName: 'kitchenView',
moveJar: function(e){
// do stuff
}
});
Controller
App.cookieJar= Ember.ArrayController.create({
content: [],
eat: function(){
// do stuff
},
dunkInMilk: function(){
// do stuff
}
});
Subclassing
App.CookieWithSprinkles = App.Cookie.extend({
sprinkleColor: 'mixed',
distribution: 'random'
});
Demo Time
python -m SimpleHTTPServer
http://localhost:8000/