Download ppt - Cappuccino fundamental

Transcript
Page 1: Cappuccino fundamental

Cappuccino Fundamental

2010.12.07Outsider

Page 2: Cappuccino fundamental
Page 3: Cappuccino fundamental

Objective-J

• Objective-C 에 기반한 프로그래밍 언어• Javascript 의 strict 한 슈퍼셋• 필요하다면 javascript 도 사용가능하다 .

Objective-J Preprocessor• Preprocessor 는 Javascript 로 쓰여짐• 플러그인도 없고 컴파일도 없다

o ( 필요하다면 컴파일 가능 )• Obj-J 파일은 순수 JS 파일로 컴파일된다 .• 개발단계에서는 모든 클래스가 런타임시에 로드되고

컴파일된다 .• Obj-J 파일들은 pre-compile 되고 한 파일로 번들될 수 있다 .

Page 4: Cappuccino fundamental
Page 5: Cappuccino fundamental

Application Framework

• 문서 관리o열기 , 저장 , 취소 등

• 컨텐츠 수정oUndo / Redoo복사하기 / 붙혀넣기

• 그래픽• 뷰

Page 6: Cappuccino fundamental

Cappuccino

• Application Framework• Cocoa 에 기반해서 설계됨• 애플리케이션의 기반을 제공한다 .• jQuery 같은 DOM 기반의 위젯 툴킷이 아니다 .• ( 웹사이트가 아닌 ) 웹애플리케이션을 위한

프레임워크이다• 280North 가 만들었으면 LGPL 2 라이센스를

따른다

Page 7: Cappuccino fundamental

Atlas

• IDE 와 Graphical interface builder• UI 를 만들고 데이터 바이딩을 한다 .• 라이브 프리뷰모드에서 UI 가 테스트가능하다• UI 엘리먼트들의 인스턴스들을 담고 있는 CIB

파일을 제공한다

Page 8: Cappuccino fundamental

Back-end 는 send/accept data(JSON)로 통신한다

모든 로직은 Objective-J(JavaScript) 에 포함된다

Page 9: Cappuccino fundamental

Objective-J Syntax

window.orderFront(); icon.moveToXY(100, 200);

new JFrame();new JFrame("Toolbox");

this.setNeedsDisplay(true);

[window orderFront];[icon moveToX:100 Y:200];

[[CPWindow alloc] init];[[CPWindow alloc] initWithTitle:"Toolbox"];

[self setNeedsDisplay:YES];

Java Objective-J

this -> selftrue -> YESfalse -> NOnull -> nil

moveToX:Y:

Page 10: Cappuccino fundamental

클래스 정의

@import <AppKit/CPView.j>

@implementation PageView : CPView

{CALayer _rootLayer; }

// 메서드 정의

@end

Base Class

Convention: 인스턴스 변수는 언더스코어로 시작

Page 11: Cappuccino fundamental

메서드 정의

- (id)initWithFrame:(CGRect)aFrame{    self = [super initWithFrame:aFrame];

    if (self)    {        _rootLayer = [CALayer layer];[self setWantsLayer:YES];[self setLayer:_rootLayer];[_rootLayer setBackgroundColor:[CPColor whiteColor]];[_rootLayer setNeedsDisplay];    }     return self;}

파라미터 타입

리턴타입

- 는 인스턴스 메서드 + 는 클래스 메서드

Page 12: Cappuccino fundamental

공통 패턴

• target -> action

• delegation (subclass 대신에 )

• Model - View - Controller

Page 13: Cappuccino fundamental

Target : Actionvar searchButton = [CPButton buttonWithTitle:"go"];[searchButton setAction:@selector(performSearch:)];[searchButton setTarget:nil];

@selector() 는 메서드명을 변수처럼 encode하는 방법

target = nil responder 를 위한 chain 을 찾는다 .

//   검색 메서드- (void)performSearch:(id)sender {}

Page 14: Cappuccino fundamental

Delegation

[_searchCollectionView setDelegate:self];

"self" 객체가 delegate 메세지에 응답하게 된다 .

delegate 클래스에서 설계되어 있는 메서드를 정의한다 .

// CPCollectionView 의 delegate 메서드(void)collectionViewDidChangeSelection:(CPCollectionView)collectionView {}

Page 15: Cappuccino fundamental

MVC

@implementation AppController : CPObject{

    PMSearch currenSearch;

    CPCollectionView _searchCollectionView;}

Controller

Model

View

Page 16: Cappuccino fundamental

Reference 문서

• CappKiDoohttp://www.cappkido.eliotis.com/

• Webohttp://cappdocs.worldofkrauss.com/

Page 17: Cappuccino fundamental

capp gen example

Page 18: Cappuccino fundamental
Page 19: Cappuccino fundamental

파일 구조

• AppController.j - Application controller (builds initial UI)• Frameworks - /usr/local/share/objj/lib/Frameworks 복사본• index.html - 애플리게이션 시작• index-debug.html - 디버그 모드의 애플리케이션 시작• Info.plist -  애플리케이션 시동 정보• main.j -  애플리케이션의 main() method• Rakefile - Rake 빌드파일• Resources -  애플레케이션에서 이용할 리소스들 ( 이미지 등 )

Page 20: Cappuccino fundamental

설정

capp config key value

user.nameuser.emailorganization.nameorganization.emailorganization.urlorganization.identifier

~/.cappconfig 에 저장된다

참고 : https://github.com/280north/cappuccino/wiki/capp

Page 21: Cappuccino fundamental

설정

https://github.com/hlship/nfjs-cappuccino

제가 만든 예제는 아닙니다 . ㅎFrom

http://blog.outsider.ne.kr/myexample/2010/cappuccino/ex.zip

Page 22: Cappuccino fundamental

Resources

• http://www.slideshare.net/hlship/brew-up-a-rich-web-application-with-cappuccino

• http://www.slideshare.net/carsonified/building-desktop-caliber-web-applications-with-objectivej-and-cappuccino-francisco-tolmasky-presentation

• http://www.slideshare.net/juni0r/cappuccino-a-javascript-application-framework

• http://www.slideshare.net/chapados/cappuccino-sdruby-20090806

• http://www.slideshare.net/LukHurych/preparing-cappuccino-in-30-minutes

• http://www.slideshare.net/jharwig/introduction-to-cappuccino-presentation