1. 3F
2.0

2. Future of Web Apps
Fast,

3. Future of Web Apps
Fluid,

4. Future of Web Apps
and Feature-rich.

5. Future of Web Apps
Less web, more app

6. Future of Web Apps
More demanding users

7. Future of Web Apps
Web-native, no plugins

8. Future of Web Apps
Probably client-server

9. Building 3F Apps
with SproutCore
Mike Subelsky
OtherInbox.com
IgniteBaltimore.com

10. Users Want More

16. Impossible with
“traditional” web 2.0
techniques

18. remove_messages: function(message_ids,block) {
OtherInbox.undo_stack.push(new UndoAction(message_ids,Mailbox.current_id,block))
$('undo').writeAttribute('disabled',null)
var affected_mailboxes = $H()
var highest_position = null
var msg_count = 0
message_ids.each(function(id) {
$('msg_row_' + id).remove()
var msg = Message.instances.unset(id)
var position = Message.ordered_instance_keys.indexOf(Number(id))
Message.ordered_instance_keys.splice(position,1)
if ((highest_position == null) || (highest_position < position))
highest_position = position
msg_count++
})
Mailbox.update_message_count(msg_count)

21. You Need
Client-Server

22. OI.executeAjax('/refresh', {
method: 'get',
parameters: parameters,
onSuccess: function(transport) {
OI._parseServerUpdate( transport );
}
});

23. class RefreshController < ApplicationController
before_filter :signin_required
def index
render :text => JSON.generate(Refresher.new(params).to_hash)
end
end

24. {quot;deletedquot;:{},quot;flashquot;:[],quot;recordTypesquot;:[quot;Mailboxquot;,quot;Userquot;,quot;Folderquot;],
quot;changedquot;:{quot;Userquot;:[{quot;namequot;:quot;forfunquot;,quot;preferencesquot;:null,quot;guidquot;:3,quot;typequot;:quot;Userquot;,
quot;adminquot;:true,quot;invitationsRemainingquot;:1,quot;loginquot;:quot;testuserquot;,quot;statequot;:quot;completedquot;}],
quot;createdquot;:{quot;Mailboxquot;:[{quot;namequot;:quot;Freeslidequot;,quot;unreadCountquot;:null,quot;guidquot;:quot;12quot;,
quot;folderquot;:quot;3quot;,quot;priorityquot;:quot;2quot;,quot;typequot;:quot;Mailboxquot;}]}}}

25. sh
Fla
t
ip
S cr
va
Ja
CSS
L
HTM

26. removeMessages: function(msgs) {
SC.Store.destroyRecords();
}

27. “...writing an app in
Javascript on the web is
akin to writing C on the
desktop: it is just one
level above the 'bare
metal’.”
- Charles Jolley

28. SproutCore does 80%

29. Feels a bit like Rails

30. Feels a bit like Rails
Convention over configuration

31. Feels a bit like Rails
Configuring components

32. Feels a bit like Rails
Uses ERB or Haml

33. Except totally
different

34. Except totally
different
Inspired by Cocoa

35. Except totally
different
Everything is a binding

36. Except totally
different
Trust but verify
if (foo && foo.get(‘importantValue’))

37. Except totally
different
By all means, repeat yourself

38. Except totally
different
JavaScript is awesome
(just avoid the bad parts)

39. Except totally
different
MVC !== MVC

40. Demo