by: Justin Dragos
The basis of Meteor's data mapping are mini-mongo objects that act like mongo collections at each layer.
Give me an object that looks like the one you want.
// Find a person with a name of 'Steve'
AmazingPeople.find({name: 'Steve'});
// Find all people with a shoe size of 10
AmazingPeople.find({shoeSize: 10});
// Add a new person named 'Ted'
AmazingPeople.insert({name: 'Ted'});
// Remove a person named 'Ted'
AmazingPeople.remove({name: 'Ted'});
// Add a shoe size of 10 to 'Steve'
AmazingPeople.update(
{name: 'Steve'},
{name: 'Steve', shoeSize: 10}
);View 1
View 2
View 3
Server
Mongo
Events
Web Sockets
Listener
Server
View
Publish
Filter
Trusted
The main mechanism for interacting with the view layer are Spacebar templates. These templates will define the markup for your views and the events bound to them.
<!-- Only one of these allowed in all HTML files -->
<head>
<title>My Favorite People</title>
</head>
<!-- Only one of these allowed in all HTML files -->
<body>
{{> intro}}
{{> people}}
</body>
<!-- Everything else is a template -->
<template name="intro">
<h2>Welcome to Justin's Awesome List</h2>
</template>
<template name="people">
<ul>
<li>Kristin</li>
</ul>
<button>Down Vote</button>
</template>Template.contents.helpers({
awesomePerson: function () {
return 'Justin';
}
});<template name="contents">
<!-- Will render as <h2>Justin</h2> -->
<h2>{{awesomePerson}}</h2>
</template>
Template.contents.events({
'click button': function () {
var newName = $('#newPerson').val();
Awesome.insert({name: newName, score: 0});
}
});We're going to build an app to track the people I feel are most awesome in the world. Its a rapidly changing list, that everyone cares about deeply.
Colin is going to show us Wiblits. Enjoy the game!