SproutCore and the Future of Web Apps

Post on 22-Oct-2014

4.170 views 1 download

Tags:

description

 

Transcript of SproutCore and the Future of Web Apps

2.03F

Future of Web AppsFast,

Future of Web AppsFluid,

Future of Web Appsand Feature-rich.

Future of Web AppsLess web, more app

Future of Web AppsMore demanding users

Future of Web AppsWeb-native, no plugins

Future of Web AppsProbably client-server

Building 3F Apps with SproutCore

Mike SubelskyOtherInbox.com

IgniteBaltimore.com

Users Want More

Impossible with “traditional” web 2.0

techniques

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)

You Need Client-Server

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

class RefreshController < ApplicationController before_filter :signin_required

def index render :text => JSON.generate(Refresher.new(params).to_hash) end

end

{"deleted":{},"flash":[],"recordTypes":["Mailbox","User","Folder"],

"changed":{"User":[{"name":"forfun","preferences":null,"guid":3,"type":"User",

"admin":true,"invitationsRemaining":1,"login":"testuser","state":"completed"}],

"created":{"Mailbox":[{"name":"Freeslide","unreadCount":null,"guid":"12",

"folder":"3","priority":"2","type":"Mailbox"}]}}}

HTM

L

CSSJavaScript

Flash

removeMessages: function(msgs) {

SC.Store.destroyRecords();

}

- Charles Jolley

“...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’.”

SproutCore does 80%

Feels a bit like Rails

Feels a bit like RailsConvention over configuration

Feels a bit like RailsConfiguring components

Feels a bit like RailsUses ERB or Haml

Except totally different

Except totally different

Inspired by Cocoa

Except totally different

Everything is a binding

Except totally different

Trust but verifyif (foo && foo.get(‘importantValue’))

Except totally different

By all means, repeat yourself

Except totally differentJavaScript is awesome

(just avoid the bad parts)

Except totally different

MVC !== MVC

Demo