Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Hoodie Presentation at apps.berlin.js

Alex Feyerke
February 28, 2013

Hoodie Presentation at apps.berlin.js

Slides for our first public demo of Hoodie.

High-quality video here (the end is missing, though :/ ) https://www.youtube.com/watch?v=X3Ttb0BD8pg

There's also a low-quality google hangout recording here, for completeness: http://www.youtube.com/watch?v=eGvZr5EFk7M&feature=player_detailpage#t=8096s

Check out the project at http://github.com/hoodiehq

Thanks for your interest!

Alex Feyerke

February 28, 2013
Tweet

More Decks by Alex Feyerke

Other Decks in Programming

Transcript

  1. // Step 1: Instantiate Hoodie with API endpoint var hoodie

    = new Hoodie(‘http://api.appname.dev‘);
  2. // Step 2: Signup $('.signUp .submit').click(function(event){ event.preventDefault(); var username =

    $('.signUp .username').val(); var password = $('.signUp .password').val(); hoodie.account.signUp(username, password).done(function(){ $('#modal').modal('hide'); $('.welcome').text('Hello, '+hoodie.account.username); }); });
  3. // Step 3: Save a task to the Hoodie store

    $('.addTask .submit').click(function(event){ event.preventDefault(); var desc = $('.addTask .desc').val(); hoodie.store.add('task', {desc: desc}); });
  4. // Step 4: Listen for the add event from the

    store, update view hoodie.store.on('add:task', function(task) { $('.taskList').append('<li>'+task.desc+'</li>'); });
  5. // Step 5: Find all tasks of this user and

    populate the task list hoodie.store.findAll('task').done(function(tasks){ $('.taskList').empty() tasks.forEach( function( task ){ $('.taskList').append('<li>'+task.desc+'</li>'); }); });