Cappuccino Fundamental
2010.12.07Outsider
Objective-J
• Objective-C 에 기반한 프로그래밍 언어• Javascript 의 strict 한 슈퍼셋• 필요하다면 javascript 도 사용가능하다 .
Objective-J Preprocessor• Preprocessor 는 Javascript 로 쓰여짐• 플러그인도 없고 컴파일도 없다
o ( 필요하다면 컴파일 가능 )• Obj-J 파일은 순수 JS 파일로 컴파일된다 .• 개발단계에서는 모든 클래스가 런타임시에 로드되고
컴파일된다 .• Obj-J 파일들은 pre-compile 되고 한 파일로 번들될 수 있다 .
Application Framework
• 문서 관리o열기 , 저장 , 취소 등
• 컨텐츠 수정oUndo / Redoo복사하기 / 붙혀넣기
• 그래픽• 뷰
Cappuccino
• Application Framework• Cocoa 에 기반해서 설계됨• 애플리케이션의 기반을 제공한다 .• jQuery 같은 DOM 기반의 위젯 툴킷이 아니다 .• ( 웹사이트가 아닌 ) 웹애플리케이션을 위한
프레임워크이다• 280North 가 만들었으면 LGPL 2 라이센스를
따른다
Atlas
• IDE 와 Graphical interface builder• UI 를 만들고 데이터 바이딩을 한다 .• 라이브 프리뷰모드에서 UI 가 테스트가능하다• UI 엘리먼트들의 인스턴스들을 담고 있는 CIB
파일을 제공한다
Back-end 는 send/accept data(JSON)로 통신한다
모든 로직은 Objective-J(JavaScript) 에 포함된다
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:
클래스 정의
@import <AppKit/CPView.j>
@implementation PageView : CPView
{CALayer _rootLayer; }
// 메서드 정의
@end
Base Class
Convention: 인스턴스 변수는 언더스코어로 시작
메서드 정의
- (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;}
파라미터 타입
리턴타입
- 는 인스턴스 메서드 + 는 클래스 메서드
공통 패턴
• target -> action
• delegation (subclass 대신에 )
• Model - View - Controller
Target : Actionvar searchButton = [CPButton buttonWithTitle:"go"];[searchButton setAction:@selector(performSearch:)];[searchButton setTarget:nil];
@selector() 는 메서드명을 변수처럼 encode하는 방법
target = nil responder 를 위한 chain 을 찾는다 .
// 검색 메서드- (void)performSearch:(id)sender {}
Delegation
[_searchCollectionView setDelegate:self];
"self" 객체가 delegate 메세지에 응답하게 된다 .
delegate 클래스에서 설계되어 있는 메서드를 정의한다 .
// CPCollectionView 의 delegate 메서드(void)collectionViewDidChangeSelection:(CPCollectionView)collectionView {}
MVC
@implementation AppController : CPObject{
PMSearch currenSearch;
CPCollectionView _searchCollectionView;}
Controller
Model
View
Reference 문서
• CappKiDoohttp://www.cappkido.eliotis.com/
• Webohttp://cappdocs.worldofkrauss.com/
capp gen example
파일 구조
• 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 - 애플레케이션에서 이용할 리소스들 ( 이미지 등 )
설정
capp config key value
user.nameuser.emailorganization.nameorganization.emailorganization.urlorganization.identifier
~/.cappconfig 에 저장된다
참고 : https://github.com/280north/cappuccino/wiki/capp
설정
https://github.com/hlship/nfjs-cappuccino
제가 만든 예제는 아닙니다 . ㅎFrom
http://blog.outsider.ne.kr/myexample/2010/cappuccino/ex.zip
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