washington post social reader: fb hack preso 01-18-2012

by

september launch

8 million installs

18-35 demographic

mobile HTML5

double digit traffic

native (coming soon)

FB.api(‘/me/news.reads’, {method: ‘POST’})

mobile HTML5

double digit traffic

native (coming soon)

1. coding for the futures

1. coding for the futures

“<coding for the futures” +

everything you write effects possible futures

“coding for the futures” +

be deliberate when you have to do it wrong

“coding for the futures” +

architect for the foreseeable futures

“coding for the futures” +

short term futures

window.FB.api(‘/me’, callback)

window.Auth = {getMe: function(callback){

FB.api(‘/me’, callback);}}

window.Auth = {getMe: function(callback){

$.get(GRAPH_URI+‘/me?’+ ‘access_token=’+at, callback)

}}

and long term futures

backbone.js and REST JSON api before we could even support

single page

closed off the fewest future options

conceived, design, built, and shipped mobile in 6 weeks

coding for the futures

“coding for the futures />”

2. building mobile second

2. building mobile second

“<building mobile second” +

“building mobile second” +

makes us (me) feel better =)

“building mobile second” +

but we learned a lot, too

“building mobile second” +

mobile and web are facets of the same

product

“building mobile second” +

it will probably be multiplatform at the end of

the day no matter what

“building mobile second” +

use <platform> second as a chance to rethink the core of

your experience

social reading had no conventions or

boundaries

screen shot of first app implementation

used mobile to rethink boundaries

we’ll roll mobile learning back into web app

and then do the whole thing again

“building mobile second />”

building mobile second

some tips and tricks

for HTML5 and single page apps

avoid these two

HTML in your views

View.render = function(name){return ‘<span>’+name+‘<span>’}

lots of keys in localStorage

window.localStorage.length > 1000

‘tis good stuff

black box your js templates

$(‘.fp’).html(Templates.facepile(peopleJSON))

get javascript weekly

javascriptweekly.com/

don’t wait for the FB js sdk

fbQueue = $.Deferred();fbAsyncInit = function(){fbQueue.resolve()}

for native SSO around HTML5, try passing the tokens

if(access_token && user_id){_startApp()} else {Auth.getUserAuth(_startApp)}

consolidate you data structures around spec

ActivityStreamsArticle = {objectType: ‘article’,id: ‘x6hf3’,url: ‘https://myapp.com/a/x6hf3’}

/* clowntown */

handwritten templates

template = function(data){return ‘<div></div>’};

our stack

on ye old client

requirejsjQueryunderscoreBackboneamplify.storetypekit.js

RESTful routescoffeescriptless

on ye old backend

AWS Cloud Services

pythonpyramid

groovygrails

MySQL, SimpleDB, Redis, Memcache

questions

charles@wapolabs.com