ExtJS4 MVC 설치하기

1.Download Sencha Ext JS
http://www.sencha.com/products/extjs/download/

2.Download Sencha Cmd
http://www.sencha.com/products/sencha-cmd/download/
C:\Sencha 에  Extjs4 라이브러리를 압축해제해서 옮긴다.

설치할때 디렉토리 선택에서 C:\만 선택하면 Sencha 폴더 생기면서 거기에 알아서 설치된다.

설치완료 후 확인은 명령프롬프트 창을 열고 "sencha"명령을 실행해서 아래와 같이 나오면 설치가 잘 된것이다.

다운로드 받은 Extjs4 파일은 C:\Sencha 폴더로 이동한다.

3.ruby 다운로드 ( Sencha cmd에서는 1.8~1.9버전만 지원한다. )

테마 컴파일을 하기위해서 ruby를 다운로드 받는다.
http://rubyinstaller.org/downloads/

빌드 과정에서 테마를 위판 sass컴파일용 compass를 설치하자.
C:\Sencha>gem install compass

혹여 윈도우 7에 경우 정상적으로 설치 되지 않는 경우가 있는데 이때는 아래 사이트를 참고하여 수동으로 compass를 설치할 수 있다.
http://awordpress.net/install-sass-compass-manually-windows/

 해당 Ruby 설치 폴더에 가서 gem을 실행해라. 아니면 path를 설정하든지

4.애플리케이션 생성

아래 명령을 실행하여 waniMvc라는 애플리케이션을 생성하자.
C:\Sencha> sencha -sdk C:\Sencha\ext-4.2.1.883 generate app waniMvc c:\Sencha\waniMvc

4.웹서버 실행 

아래 명령을 실행하여 웹서버 실행.
C:\Sencha> sencha  fa web -port 8000 start -map C:\Sencha\waniMvc

http://localhost:8000 에서 화면 확인.

.

센차 터치(Sencha Touch) 2 핵심 가이드 - 마소 연재

1회 : 2012.10 | 센차 SDK tool

2회 : 2012.11 | 센차 터치 2 - 클래스 시스템

3회 : 2012.12 | 센차 MVC 패턴

4회 : 2013.01 | 센차 터치 2 - 컴포넌트

5회 : 2013.02 | 센차 터치 2 - 테마

Touch Charts Mobile HTML5 Charts

Rich, interactive charts built in HTML5 and optimized for mobile.

Watch Video Build interactive, easy-to-use radar, bar, line, stacked, and pie charts. Visualizing rich data on the mobile web has never been easier.

View Sencha Touch Charts Demos

Groundbreaking Interactivity

Sencha Touch Charts breathes new life into your data and utilizes hardware acceleration for optimized performance. With natural gestures in Sencha Touch Charts, visualizing and understanding complex datasets is effortless. Pinch-to-zoom, swipe-to-pan across data, and tap for deep dives. Data flows come to life with every tap, pinch, and swipe.

Built with Web Standards

Sencha Touch Charts uses HTML5 capabilities like Canvas elements for drawing and CSS3 for styling, delivering the highest performance and richest experience in today’s mobile web browsers. All touch events use Sencha Touch’s sophisticated events and gesture system which is optimized for modern mobile web browers.

Demos

View more demos & examples (WebKit required)

Built for Sencha Touch

Built on top of our industry-leading mobile web app framework, Sencha Touch Charts is now available to buy as a commercially licensed, $99 add-on to Sencha Touch. Open Source Sencha Touch developers will be able to use Sencha Touch Charts free of charge under the terms of the GPLv3 license. Sencha Touch Charts is compatible with Sencha Touch 1.1 and above.

Buy Sencha Touch Charts Learn more about Sencha Touch

• Pan
• Rotate
• Zoom
• Highlight
• Reset
• Combine

HTML5 Sencha App vs. native iPhone App side by side (HD)

Sencha Touch 에서 이미지 버튼 구현하기.

Image buttons in Sencha Touch?

Ext.setup({
    onReady: function() {		
	var rootPanel = new Ext.Panel({
		fullscreen: true,					
		dockedItems:[{					
			xtype: 'toolbar',
			dock: 'top',
			items: [{
				xtype: 'button',
				cls: 'btnAction'						
			}]								
		}]			
	});
    }
});

.btnAction {
	background: url(../action.png);
	width: 40px;
	height: 40px;
}

Build mobile web applications with Sencha Touch

Overview

In the software development world, two important trends are increasingly important: mobile application development and standards-based HTML5 web development. The learning curve for either type of development can be steep. Developing a native mobile application often requires knowledge of specific platforms and skills, such as Objective-C for iPhone and Java™ for Android (and these are only two platforms). HTML5 development has gained traction lately because it is standards-based. While vendors are working rapidly to incorporate and comply with these early specifications, HTML5 is still rather immature.

The recent release of Sencha Touch 1.0 fuses the cutting-edge worlds of mobile application development with HTML5 web development to form a simple, accessible framework for building mobile web applications. In this article, learn everything you'll need to know to start working with the Sencha Touch framework.

Sencha Touch

Learning to build mobile applications—especially from the perspective of a web developer—can be troublesome. A variety of platforms to choose from and technologies to learn are available. HTML5 support, though gaining momentum quickly, is still not quite ready to be used for complex web applications, particularly line-of-business applications.

Sencha Touch combines the rich platforms of HTML5 and mobile web application development into a happy medium. The framework is developer-friendly and similar to using the Ext JS JavaScript framework. If you have moderate to advanced JavaScript experience, then Sencha Touch is approachable. If you already have skills as a JavaScript and CSS developer, Sencha Touch can immediately turn you into a mobile application developer, too.

Sencha is a company with a core commercial product offering, but it also supports open source software. Sencha Touch 1.0 is free for both personal and commercial use.

Frequently used abbreviations

Layouy Guide : http://dev.sencha.com/deploy/dev/examples/layout-browser/layout-browser.html

Ext Core Manual : http://docs.sencha.com/core/manual/