프로페셔널 Ext JS 5 RIA 프로그래밍(위키북스 오픈소스 & 웹 시리즈 65)

기업환경에 최적화된 UI솔루션을 찾는가?

모바일에 유연하게 대응하며 모든 브라우저에서 수정 없이 작동하길 바라는가?

생산성과 유지보수에 용이한 코드를 얻고자 하는가?



Ext JS는 B2B 기반 시스템 개발을 타겟으로 만들어진 현존하는 최고의 자바스크립트 프레임워크다. 수많은 컴포넌트를 제공해 원하는 UI를 쉽고 빠르게 개발할 수 있으며 자체 클래스 시스템은 생산성과 재활용성을 높여 준다. 또 일관된 코드는 시스템의 수명을 늘리도록 도와 준다. Ext JS는 단순한 프레임워크에서 벗어나 다양한 컴포넌트와 개발에 필요한 SDK, 빌드툴, 저작도구, 서드파티 플러그인 등을 포함하여 UI 개발의 패러다임을 바꿔놓았다.



이 책은 Ext JS를 시작하는 개발자를 위한 Ext JS의 기본적인 내용은 물론 어느 정도 Ext JS에 익숙한 중급 이상 개발자를 위한 실용 코드도 제공하고 있다. 이러한 각 장의 예제들은 마지막 실전 예제를 통해 하나로 합쳐져 하나의 완전한 시스템으로써 작동하도록 구성했다.



이 책의 종합 예제는 아래 사이트에서 확인할 수 있다

▣ http://extuxgroup.com



★ 이 책에서 다루는 내용 ★



◎ 개발에 필요한 환경 설치

◎ 모든 개발의 기초가 되는 클래스 시스템

◎ UI클래스를 배치하기 위한 다양한 레이아웃 구성

◎ 제공되는 컴포넌트에서 벗어나 HTML을 활용해 자신만의 UI클래스 작성

◎ Ext JS 5만의 MVVM, MVVC, 라우팅, 바인딩 기술

◎ 실무에 바로 적용할 수 있는 차트와 지도가 포함된 대시보드 구성



출판사 리뷰.

Ext JS는 기업환경의 백오피스 개발에 최적화된 UI프레임워크다. 미국을 중심으로 전 세계적으로 인기를 얻고 있지만 국내에서는 학습에 대한 어려움과 ActiveX 기반 솔루션의 더딘 대체 속도, 오픈소스에 대한 편협한 시각이 저변 확대에 걸림돌이 되어 왔다.

최근 국내 인터넷 기술 관련 화두는 ActiveX 없는 웹 환경이다. 언젠가 사라질 이 기술은 Ext JS와 같은 순수 웹 기술로 대체될 것이다.

저자는 10년 가까이 웹 UI 기술에 관심을 갖고 꾸준히 탐구해 왔으며, Ext JS가 기업용 웹 애플리케이션의 미래라는 생각으로 Ext JS가 널리 보급되길 바라는 마음에서 이 책을 저술했다.

▣ 1부: Ext JS 5 시작하기

01. 설치

- Ext JS SDK 설치

- 루비설치

- 센차 Cmd 설치

- Java JRE 설치

02. Ext JS 시작하기

03. 예제 코드 구현

04. 예제 코드의 공유와 피드백



▣ 2부: 클래스 시스템

01. 클래스 선언과 생성

02. Config 구성 요소

03. 스태틱

04. 동적 클래스 로딩과 Alias



▣ 3부: 컴포넌트 레이아웃

01. Flex 이해하기

02. Absolute 레이아웃

03. Fit 레이아웃

04. Border 레이아웃

05. Anchor 레이아웃

- 퍼센트를 이용한 Anchor 설정

- 오프셋을 이용한 Anchor 설정

- 퍼센트와 오프셋을 모두 이용한 Anchor 설정

06. Column 레이아웃

07. Table 레이아웃

08. HBox 레이아웃

09. VBox 레이아웃

10. Card 레이아웃

- deferredRender를 이용한 렌더링 지연

11. Accordion 레이아웃

- Accondion 레이아웃 이벤트



▣ 4부: 돔 조작

01. Ext.dom.Helper 클래스

02. 돔 요소를 포함한 사용자 클래스

03. 컨테이너를 이용한 돔 요소 배치

04. 돔 요소 이벤트 제어

05. Ext.query, Ext.get, Ext.select 메서드 활용

- Ext.get() 메서드

- Ext.select() 메서드

- Ext.query() 메서드

06. 돔 요소 추가, 삭제

- Ajax 통신을 이용한 동적탭 추가

- 컨텍스트 메뉴 추가

- 돔 이벤트 처리



▣ 5부: Ext JS 데이터 패키지

01. 모델

- 모델의 정의

- 모델의 검증

- 프록시를 이용한 입력 및 수정

- 프록시를 이용한 데이터의 읽기 및 삭제

- 모델 간의 관계 설정을 이용한 손쉬운 데이터 로딩

02. 스토어

- 스토어 생성

- 스토어의 조작



▣ 6부: 폼 필드와 폼의 로딩, 제출

01. 폼과 폼 필드

- Base 클래스

- 텍스트 필드

- 숫자 필드

- 체크박스와 체크박스 그룹

- 라디오버튼과 라디오 그룹

- 콤보박스의 서버 데이터 로드와 자동완성

- HTML 리치 에디터

- 피커 필드를 활용한 간단한 팝업 만들기

02. 복잡한 폼 구성

- 필드셋과 필드 컨테이너를 이용한 폼 필드 배치

- 컨테이너를 이용한 폼 필드 배치

- 동적으로폼필드추가

- 폼 데이터 채우기

- 재활용가능한폼필드클래스



▣ 7부: 그리드

01. 기본 그리드 패널

02. 그리드 컬럼

03. 컬럼 렌더러

04. 셀렉션 모델

05. 셀렉션 이벤트

06. 그리드 소트

07. 피처

08. 셀 에디팅 플러그인

09. 로우 에디팅 플러그인

10. 그리드 페이징

11. 그리드

12. 대용량 데이터 처리

13. 그리드 상태 유지



▣ 8부: 새로운 Ext JS 5

01. 터치 디바이스 지원과

02. 새로운 테마

03. 새로운 아키텍쳐

04. MVVM, MVVC



▣ 9부: 실전 예제

01. 센차 앱 설정

02. 시스템 뼈대 구현

03. 상단 메뉴 구현

04. 애플리케이션 정보

05. 애플리케이션

06. 전체 화면보기

07. 에러 처리

08. 메인 프로그램 영역

09. 메뉴 트리

10. 코드 미리보기

11. 애플리케이션 상태 유지

12. 라우팅을 이용한

13. 이벤트 제어

14. 대시보드

15. 빌드

곽옥석 저자 곽옥석은 2000년부터 자바 기반 웹 시스템 개발을 시작으로 프로그래머의 길을 걷기 시작했다. 프로그래머 초기부터 UI 기술에 관심을 갖고 Java Swing, GWT, Eclipse RCP 등 여러 기술을 실무에 적용하며 최적화된 사용자 경험을 제공할 솔루션을 찾아왔다.

2011년부터 HTML과 액티브엑스를 이용한 백오피스 시스템 개발의 한계와 문제점을 인식하고 대안으로 자바스크립트 프런트엔드 기술인 Ext JS를 시스템에 적용했다. 이런 경험을 블로그(http://benney.tistory.com)를 통해 지금까지 개발자들에게 공유하고 있다.

최근 2년간 월간 마이크로소프트 잡지에 Ext JS 관련해서 기고했고 기업과 개인을 대상으로 Ext JS 강의 및 컨설팅을 진행하며 저변확대에 주력하고 있다. 한국센차유저그룹(http://sencha.or.kr)에서 활동하며 오픈소스 프로젝트 수행과 개발자 커뮤니티 활성화에 노력하고 있다.