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

Cappuccino

 Cappuccino

An "awesome" web framework

Jelle Vandebeeck

January 08, 2010
Tweet

More Decks by Jelle Vandebeeck

Other Decks in Programming

Transcript

  1. What is Cappuccino? Apart from a delicious beverage ๏ Objective-C

    style coding ๏ create desktop-like web apps ๏ No CSS, HTML or DOM ๏ No compilation ๏ No plugins required ๏ Runs client side ๏ AJAX calls to remote server flickr.com/longo
  2. Quick and dirty Let’s get cappuccino ๏ Go to cappuccino.org/starter

    ๏ Unzip the package ๏ Go to the NewApplication folder ๏ Open index.html to start ๏ Start developing! flickr.com/stinkiepinkie_infinity
  3. The folder structure Help, I can’t find my files... ‣

    AppFolder/ ‣ Frameworks/ ‣ Resources/ - index.html - index-debug.html - Info.plist - main.j - AppController.j flickr.com/digitalcolony
  4. Objective-J How to write some Cocoa like code user.setName(“Jake”); ‣

    [user setName:”Jake”]; user.setNameAndAge(“Jake”, 12]; ‣ [user setName:”Jake” andAge:12]; User.getList(); ‣ [User list]; flickr.com/sondyaustin
  5. Now let’s write a class It’s like Cocoa, but different!

    @import <Foundation/CPObject.j> @import “... .j” @implement MyClass : CPObject { CPString objectString; } - (void)methodNameWithParam:(CPString)text { ... } + (void)staticMethod { ... } @end A Objective-J class flickr.com/cgc
  6. Now let’s write a class It’s like Cocoa, but different!

    @import <Foundation/CPObject.j> @import “... .j” @implement MyClass : CPObject { CPString objectString; } - (void)methodNameWithParam:(CPString)text { ... } + (void)staticMethod { ... } @end A Objective-J class var object = [[MyClass alloc] init]; [object methodNameWithParam:”good!”]; Use an object and it’s methods flickr.com/cgc
  7. Now let’s write a class It’s like Cocoa, but different!

    @import <Foundation/CPObject.j> @import “... .j” @implement MyClass : CPObject { CPString objectString; } - (void)methodNameWithParam:(CPString)text { ... } + (void)staticMethod { ... } @end A Objective-J class CPString objectString @accessors; - (void)setObjectString:(CPString)value {...} - (CPString)objectString { return objectString; } Accessors var object = [[MyClass alloc] init]; [object methodNameWithParam:”good!”]; Use an object and it’s methods flickr.com/cgc
  8. Now let’s write a class It’s like Cocoa, but different!

    ... globalVariable = “global variable” var fileVariable = “file scoped variable” @implement MyClass : CPObject { CPString objectVariable; } - (void)method { objectVariable = “object variable”; var functionVariable = “function variable”; aNewGlobalVariable = “another global variable”; } @end Variables flickr.com/cgc
  9. Now let’s write a class It’s like Cocoa, but different!

    ... globalVariable = “global variable” var fileVariable = “file scoped variable” @implement MyClass : CPObject { CPString objectVariable; } - (void)method { objectVariable = “object variable”; var functionVariable = “function variable”; aNewGlobalVariable = “another global variable”; } @end Variables @implementation CPString (MyImplementation) - (CPString)upper { return [self uppercaseString]; } @end Categories flickr.com/cgc
  10. Go and delegate! You’re like the boss that delegates everything

    ๏ Customize behavior without subclassing ๏ Move event handling to other class ๏ @selector to pass a method as a parameter flickr.com/jdebner
  11. Go and delegate! You’re like the boss that delegates everything

    var request = [CPURLRequest requestWithURL:"http://www.fousa.be/articles.json"]; [request setHTTPMethod:"GET"]; connection = [CPURLConnection connectionWithRequest:request delegate:self]; Calling class that sets the delegate flickr.com/jdebner
  12. Go and delegate! You’re like the boss that delegates everything

    var request = [CPURLRequest requestWithURL:"http://www.fousa.be/articles.json"]; [request setHTTPMethod:"GET"]; connection = [CPURLConnection connectionWithRequest:request delegate:self]; Calling class that sets the delegate - (void)connection:(CPURLConnection)myConnection didReceiveData:(CPString)data - (void)connection:(CPURLConnection)connection didFailWithError:(CPString)error - (void)connectionDidFinishLoading:(CPURLConnection)connection The delegate class flickr.com/jdebner
  13. Where is my memory? This is some weird shit... ๏

    Garbage collection ๏ No retain / release ๏ Common leaks are handled ๏ Still possible to leak objects flickr.com/pandiyan
  14. The HTML This is where it all begins <head> <title>NewApplication</title>

    <script type = "text/javascript"> OBJJ_MAIN_FILE = "main.j"; </script> <script src = "Frameworks/Objective-J/Objective-J.js" type = "text/javascript"></script> </head> index.html flickr.com/ianlloyd
  15. main.j This is where it all begins + 1 @import

    <Foundation/Foundation.j> @import <AppKit/AppKit.j> @import "AppController.j" function main(args, namedArgs) { CPApplicationMain(args, namedArgs); } main.j flickr.com/splatt
  16. Our AppController This is where it all begins + 2

    @import <Foundation/CPObject.j> @implementation AppController : CPObject { } - (void)applicationDidFinishLaunching:(CPNotification)aNotification { // The first method to be called in your app } @end AppController.j flickr.com/paulhami
  17. Ruby on Rails YES, they match! ๏Communicate through AJAX calls

    ๏Data exchange with JSON flickr.com/ecstaticist
  18. Ruby on Rails YES, they match! ๏Communicate through AJAX calls

    ๏Data exchange with JSON def index @articles = Article.all respond_to do |format| format.json { :render :json => @articles } end end Your controller flickr.com/ecstaticist
  19. The end I’m in love ๏ Cocoa like development ๏

    Layer on top of your website ๏ Mac OS X like web applications flickr.com/pelesfury
  20. References So you can see I’m not making this up!

    ๏ cappuccino.org ๏ 280atlas.com ๏ 280slides.com ๏ cappuccinocasts.com ๏ documentation flickr.com/jcarlosn