소장자료검색

책소개

아이폰과 같은 최신 스마트폰이 보급되면서 애플리케이션 장터인 앱 스토어가 등장하고 일반 사용자는 마치 생필품(?)을 소비하듯이 앱(App, 애플리케이션의 줄임말)을 사용하기 시작했다. 최신 스마트폰에서 사용하는 애플리케이션의 종류는 크게 네이티브(Native) 앱과 모바일 웹으로 구분된다. 특히 순수 웹 기술만으로 네이티브 앱과 유사한 UI와 사용성을 제공하는 애플리케이션을 모바일 웹앱(Web App)이라고 하는데, 모바일 웹앱은 플랫폼에 종속적이지 않고 기존의 익숙한 웹 기술만 사용하므로 개발 비용과 유지비가 절감되고 실시간 업데이트가 가능해 사용자의 요구에 빠르게 피드백할 수 있어 향후 많은 애플리케이션이 모바일 웹앱으로 구현될 전망이다.

이 책은 최신 스마트폰을 대상으로 한 최적화된 모바일 웹앱을 개발하는 데 사용하는 세 가지 프레임워크의 특징과 활용법을 쉽고 빠르게 전해준다. jQTouch, jQuery Mobile, Sencha Touch의 세 프레임워크는 순수 웹 기술만으로 구현된 모바일 친화적인 각종 UI 컨트롤을 제공하고 애니메이션 효과와 자동 내비게이션, 터치 이벤트 반응, 비동기 통신 등 모바일에 최적화된 기능을 프레임워크 차원에서 제공해 모바일 웹앱 개발의 생산성과 안정성을 획기적으로 끌어올린다.

이 책에서는 먼저 모바일 애플리케이션의 종류와 특징을 소개하고 모바일 웹앱이 지닌 상대적인 장점을 설명한다. 그리고 세 프레임워크에 접목된 차세대 웹 표준 기술인 HTML5의 주요 기능을 살펴보고 이어서 본격적으로 jQTouch, jQuery Mobile, Sencha Touch의 특징과 활용법을 자세히 설명한다. 독자는 이 책을 토대로 모바일 웹앱 개발을 쉽게 시작할 수 있을 것이다.

목차

1부 모바일 웹 개발 프레임워크

Step 01. 모바일 웹앱(Web App)
_ 1. 모바일 애플리케이션의 종류
_ 2. 모바일 애플리케이션의 종류에 따른 특징
_ 3. 원 소스 멀티 플랫폼의 실현! Web App (+Hybrid)

Step 02. 모바일 웹 개발 프레임워크 소개
_ 1. 모바일 웹 개발 프레임워크란?
_ 2. 주요 모바일 웹 개발 프레임워크
_ 3. 세 가지 프레임워크 선정 기준 및 비교

Step 03. 차세대 웹 표준 HTML5
_ 1. HTML5란?
_ 2. 프레임워크에 접목된 HTML5
_ 3. Geolocation
_ 4. Web Storage
_ 5. Application Cache
_ 6. Video & Audio
_ 7. 향상된 웹 양식(Web Form)

Step 04. 학습 선행 가이드
_ 1. 원리보다는 현상 위주
_ 2. 버전 선 긋기
_ 3. 프레임워크? 라이브러리?
_ 4. 개발 도구 및 테스트 환경
_ 5. 웹 서버 준비
_ 6. 프레임워크의 한글 지원
_ 7. 대상 독자
_ 8. 최소화 버전 파일
_ 9. jQuery & ExtJS
_ 10. JSON
_ 11. 소스 코드에 관해

2부 jQTouch

Step 01. jQTouch 개요
_ 1. jQTouch 소개
_ 2. jQTouch 특징
_ 3. jQTouch 버전
_ 4. jQTouch & Sencha
_ 5. 라이선스
_ 6. 지원 기기

Step 02. jQTouch 시작하기
_ 1. 개발 환경 구성
_ 2. jQTouch의 구성
_ 3. Hello World로 시작하기

Step 03. jQTouch 테마
_ 1. apple 테마
_ 2. jqt 테마
_ 3. 테마 확장

Step 04. jQTouch 사용자 인터페이스
_ 1. 툴 바
_ 2. 리스트
_ 3. 버튼
_ 4. 폼
_ 5. jQTouch UI 컨트롤 모음

Step 05. jQTouch 페이지 이동과 효과
_ 1. 내부 링크 페이지 이동
_ 2. 외부 링크 페이지 이동
_ 3. 외부 사이트 이동 및 타깃 옵션
_ 4. Back 버튼
_ 5. 페이지 이벤트
_ 6. 페이지 이동 효과(애니메이션 효과)

Step 06. jQTouch Ajax 상호작용
_ 1. GET 요청
_ 2. POST 요청
_ 3. Ajax 콜백 이벤트

Step 07. jQTouch Extensions
_ 1. jQTouch 확장하기
_ 2. Auto Titles
_ 3. Floaty Bar
_ 4. Offline Utility
_ 5. Geo Location

Step 08. jQTouch Demos
_ 1. Clock app
_ 2. To-Do app

3부 jQuery Mobile

Step 01. jQuery Mobile 개요
_ 1. jQuery Mobile 소개
_ 2. jQuery Mobile 특징
_ 3. 지원 기기
_ 4. 라이선스
_ 5. 관련 URL

Step 02. jQuery Mobile 시작하기
_ 1. 개발 환경 구성
_ 2. jQuery Mobile 구성 살펴보기
_ 3. 데모 및 라이브러리 설명서
_ 4. jQuery Mobile 개발을 위한 기본 사항
_ 5. Hello World로 시작하기

Step 03. jQuery Mobile 테마
_ 1. jQuery Mobile 테마 특징
_ 2. jQuery Mobile 테마 적용
_ 3. 사용자 정의 테마
_ 4. 동적 테마 변경

Step 04. jQuery Mobile 사용자 인터페이스
_ 1. Page, Header, Content, Footer
_ 2. 툴 바
_ 3. 아이콘
_ 4. 버튼
_ 5. 리스트
_ 6. 그리드 레이아웃
_ 7. 폼
_ 8. Collapsible 블록
_ 9. data-* 속성

Step 05. jQuery Mobile 페이지 이동과 효과
_ 1. jQuery Mobile 기본 페이지 구조
_ 2. 내부 링크 페이지 이동
_ 3. 외부 링크 페이지 이동
_ 4. 외부 사이트 이동 및 링크 옵션
_ 5. 기능 링크
_ 6. Back 버튼과 대화창
_ 7. 페이지 이동 API
_ 8. 페이지 이동 애니메이션 효과

Step 06. jQuery Mobile Ajax 상호작용
_ 1. GET 요청
_ 2. POST 요청

Step 07. jQuery Mobile 이벤트
_ 1. mobileinit 이벤트와 기본 설정 변경
_ 2. 페이지 이벤트
_ 3. 터치 이벤트

Step 08. jQuery Mobile 데모
_ 1. YQL을 이용한 플리커 이미지 검색
_ 2. 실제 이미지 URL
_ 3. 검색 결과 정렬
_ 4. 이미지 검색 애플리케이션 개발

4부 Sencha Touch

Step 01. Sencha Touch 개요
_ 1. Sencha Touch 소개
_ 2. Sencha Touch 특징
_ 3. 라이선스
_ 4. 지원 기기

Step 02. Sencha Touch 시작하기
_ 1. 개발환경 구성
_ 2. Sencha Touch 구성
_ 3. Hello World로 시작하기
_ 4. Ext.setup VS Ext.Applicatoin
_
Step 03. Sencha Touch 테마
_ 1. Sass
_ 2. Compass
_ 3. Sass & Compass 설치
_ 4. Sencha Touch 테마 관련 파일
_ 5. Sencha Touch 테마 커스터마이징

Step 04. Sencha Touch 사용자 인터페이스
_ 1. UI 컴포넌트
_ 2. 패널(Ext.Panel)
_ 3. 탭 패널(Ext.TabPanel)
_ 4. 회전목마(Ext.Carousel)
_ 5. 툴 바(Ext.Toolbar)
_ 6. 버튼(Ext.Button)
_ 7. 아이콘(iconCls)
_ 8. 오버레이
_ 9. 리스트(Ext.List)
_ 10. 메시지 박스(Ext.MessageBox)
_ 11. 장치 구분(Ext.is)
_ 12. HTML을 이용한 레이아웃 구성(contentEl 속성)
_ 13. UI 조합해보기

Step 05. Sencha Touch Ajax 상호작용
_ 1. 템플릿(Ext.Template)
_ 2. 확장 템플릿(EXT.XTemplate)
_ 3. Ajax 호출
_ 4. JSONP 호출

Step 06. Sencha Touch Data 패키지
_ 1. 데이터 처리 흐름
_ 2. 데이터 패키지를 활용한 원격 리소스 호출
_ 3. 데이터 패키지를 활용한 로컬 리소스 호출
_ 4. 데이터 패키지와 중첩리스트(Ext.NestedList)

Step 07. Sencha Touch 이벤트
_ 1. 내장 속성을 이용한 이벤트 처리
_ 2. 표준 이벤트 처리
_ 3. 터치 이벤트
_ 4. 터치 이벤트를 활용한 모바일 그림판

Step 08. Sencha Touch 미디어 지원
_ 1. Media(Ext.Media)
_ 2. Video(Ext.Video)
_ 3. Audio (Ext.Audio)
_ 4. 비디오, 오디오 코덱

Step 09. Sencha Touch 데모
_ 1. YQL을 이용한 RSS 검색
_ 2. RSS 리더 개발