• 컴퓨터/IT > 모바일프로그래밍 > 모바일프로그래밍 일반

2018/3 컴퓨터/IT 56위 | 현재 컴퓨터/IT 56위 |

출판사 리뷰

출판사 서평 ★ 요약 ★ 제이쿼리 모바일(jQuery Mobile)은 모바일 웹사이트와 웹앱을 만들기 위한 HTML5 기반의 UI 프레임워크로, HTML을 이용해 단 한 줄의 자바스크립트 코딩 없이도 모바일에 최적화된 웹사이트?를 만들 수 있어 UI 개발이 익숙치 않은 개발자들도 쉽게 배워 사용할 수 있다. 이 책은 제이쿼리 모바일의 각 기능들을 따라 하면서 배울 수 있도록 쉽게 설명되어 있다. 또한 배운 기능들을 이용해 실용적인 메모장 웹앱도 직접 만들어본다. ★ 이 책에서 다루는 내용 ★ ■ 간단한 HTML을 사용해서 모바일에... ★ 요약 ★ 제이쿼리 모바일(jQuery Mobile)은 모바일 웹사이트와 웹앱을 만들기 위한 HTML5 기반의 UI 프레임워크로, HTML을 이용해 단 한 줄의 자바스크립트 코딩 없이도 모바일에 최적화된 웹사이트를 만들 수 있어 UI 개발이 익숙치 않은 개발자들도 쉽게 배워 사용할 수 있다. 이 책은 제이쿼리 모바일의 각 기능들을 따라 하면서 배울 수 있도록 쉽게 설명되어 있다. 또한 배운 기능들을 이용해 실용적인 메모장 웹앱도 직접 만들어본다. ★ 이 책에서 다루는 내용 ★ ■ 간단한 HTML을 사용해서 모바일에 최적화된 사이트 만들기 ■ 모바일 기기 브라우징을 위한 사이트 구축하기 ■ 대화형 사이트 구축을 위한 폼 추가하기 ■ 데스크톱 사이트를 모바일 버전으로 변경하기 ■ 제이쿼리 모바일에서 HTML5의 로컬 스토리지 기능 사용하기 ■ 제이쿼리 모바일 사이트에 테마 적용하기 ■ 네이티브 애플리케이션 만들기 ★ 이 책의 대상 독자 ★ 이 책은 데스크탑 애플리케이션 개발을 넘어, 더 향상된 기술을 배우길 원하며 모바일 애플리케이션 개발에 대해 알고 싶은 사람들에게 추천한다. ★ 이 책의 구성 ★ 1장. ‘제이쿼리 모바일 프로젝트 준비’에서는 첫 번째 제이쿼리 모바일 프로젝트를 만들어본다. 프로젝트 폴더와 소스코드에 추가 해야 할 것들에 대해 알아본다. 2장. ‘제이쿼리 모바일 페이지 작업’에서는 1장에서 작업한 프로젝트를 계속해서 진행하고 제이쿼리 모바일의 페이지 개념에 대해 알아본다. 3장. ‘헤더와 푸터, 툴바로 페이지 개선’에서는 형식화된 헤더와 푸터를 통해 페이지를 향상시키는 방법에 대해 알아본다. 4장. ‘리스트’에서는 제이쿼리 모바일의 리스트뷰를 만드는 방법에 대해 알아본다. 리스트뷰는 특히 내비게이션에 유용하며 모바일에 최적화된 리스트다. 5장. ‘실전 응용: 간단한 호텔 모바일 사이트 구축’에서는 실전 제이쿼리 모바일 애플리케이션을 만들어본다. 6장. ‘폼과 제이쿼리 모바일’에서는 제이쿼리 모바일이 폼을 최적화하는 프로세스에 대해 설명한다. 레이아웃과 특별한 폼의 기능도 자세히 살펴본다. 7장. ‘모달 다이얼로그와 위젯’에서는 레이아웃 기반의 그리드와 다이얼로그, 접히는 블록을 만들어 보며 제이쿼리 모바일의 특별한 사용자 인터페이스 항목들에 대해 알아본다. 8장. ‘멋진 모바일 애플리케이션 만들기: 메모장 예제’에서는 애플리케이션의 제작과정을 함께 살펴보며 HTML5를 통해 향상된 메모장 애플리케이션을 만들어본다. 9장. ‘자바스크립트를 이용한 제이쿼리 모바일 설정과 다양한 도구’에서는 유용한 자바스크립트 기반 도구들에 대해 살펴본다. 10장. ‘이벤트’에서는 페이지 로딩(loading)과 언로딩(unloading) 같은 제이쿼리 모바일 관련 기능이 발생시키는 다양한 이벤트에 대해 자세히 살펴본다. 11장. ‘외관과 기능 개선’에서는 특정 테마를 선택하거나 생성해보며 제이쿼리 모바일 사이트의 외관을 수정하는 방법을 알아본다. 12장. ‘네이티브 애플리케이션 만들기’에서는 오픈 소스 프로젝트인 폰갭(PhoneGap)으로 11장에서 만든 메모장 애플리케이션을 가지고 실제 네이티브 애플리케이션을 생성하는 방법에 대해 알아본다. 13장. ‘RSS 리더 애플리케이션 예제’에서는 12장에서 만든 애플리케이션에 RSS 리더 기능을 추가하는 방법에 대해 알아본다. ★ 지은이의 말 ★ 제이쿼리 모바일(jQuery Mobile)은 인기 있는 모든 모바일 플랫폼에 맞도록 HTML5 기반의 사용자 인터페이스 시스템으로 통합되었다. 제이쿼리 모바일은 오늘날 사용할 수 있는 가장 실용적인 HTML/자바스크립트 프레임워크다. 이 책을 통해 HTML 페이지에 제이쿼리 모바일을 적용하는 방법과, 적은 노력으로도 모바일 친화적인 웹사이트를 만드는 방법을 배우게 될 것이다. 이 책에는 모바일 웹 개발 분야에서 프로가 되는 데 도움이 되는 다양한 예제가 담겨 있다. 간단한 HTML을 시작으로, 제이쿼리 모바일을 사용해서 빠르게 모바일에 최적화된 사이트를 구축할 수 있다. 제이쿼리 모바일의 컴포넌트 주도(driven) 디자인의 한 부분을 구축하는 것을 시작으로 폼(form)과 이벤트(event), 스타일링(styling)에 대해 자세히 알아보고, 제이쿼리 모바일을 이용해 페이지 내용을 개선하는 방법과 복잡한 사이트 구축을 위해 자바스크립트 API를 사용하는 방법에 대해 익혀본다. 이러한 내용을 활용해서 3가지 예제 모바일 애플리케이션도 직접 만들어볼 수 있다. ★ 옮긴이의 말 ★ 최근 웹 개발에서는 모바일 지원은 빼놓을 수 없는 필수 요소가 되었다. 거의 모든 사람이 스마트폰을 가지고 있고 이미 모바일 트래픽이 데스트탑의 트래픽을 넘어 섰기 때문에 앞으로 그 중요성은 더욱 증가할 것으로 보인다. 웹에서 모바일을 지원하기 위한 방법은 여러 가지 인데, 서비스에 적합한 선택을 위해서는 많은 프레임워크나 라이브러리의 기반 지식이 필요하고 그들의 조합 또한 선택해야만 한다. 또 다양한 모바일 장비별, 브라우저별 특징을 이해해야만, 안정적인 모바일 웹 서비스를 구현할 수 있다. 각 개발환경에 대한 지식을 쌓고 이를 바탕으로 개발을 진행하는 것도 좋겠지만, 요즘처럼 변화가 빠른 세태 속에서는 일단 앱을 최대한 빨리 출시한 후에 사용자 반응을 살펴가며 개선해나가는 방식이 더 좋은 개발 방법일 것이다. 앱을 빠르고 쉽게 개발하려면 이미 잘 만들어진 프레임워크를 사용해야 한다. 제이쿼리 모바일(jQuery Mobile)은 다양한 스마트폰, 태블릿, 데스크탑에 맞는 모바일 웹을 개발할 수 있는 HTML5 기반 UI 프레임워크로서, 비교적 적은 노력으로 괜찮은 모바일 웹을 개발할 수 있다. 테마 지원 또한 강력한 편으로 서비스에 적합한 브랜드 이미지를 표현할 수 있다. 또한, 제이쿼리 모바일을 이용하면 웹이 아닌 웹앱도 만들 수 있다. 현재 스마트폰에서 실행되는 대부분의 앱들은 네이티브(Native)로 구현되어 있다. 네이티브 앱은 플랫폼 종속적인 다양한 기능을 활용할 수 있고, 속도도 빠르다는 장점이 있다. 하지만 다양한 기기와 플랫폼으로 인해 개발 및 테스트와 유지보수에 대한 비용 늘어난다는 단점이 있다. 이러한 네이티브 앱의 단점으로 인해 웹앱에 대한 관심은 지속적으로 증가하고 있으며, 개발자 입장에서 한 번의 개발로 다양한 기기에서 동일하게 돌아가는 앱을 만들 수 있다는 점은 굉장한 매력으로 작용한다. 제이쿼리 모바일을 이용해 만든 모바일 웹에 폰갭(PhoneGap)과 같은 도구를 이용하면, 네이티브 앱에서 사용하던 플랫폼 종속적인 다양한 기능을 사용할 수 있게 되어 단순히 웹 화면을 보여주기만 하는 앱이 아닌 네이티브 앱과 동일한 기능을 가진 앱을 웹 기반 기술로 손쉽게 제작할 수 있다. 모바일 웹 및 웹앱 개발 경험이 많지 않은 개발자들에게 제이쿼리 모바일을 적극 추천한다. 비교적 UI 개발에 약한 개발자들도 쉽게 디자인할 수 있도록 고려되어 있으며, 자바스크립트를 이용해 다양한 기능을 개발할 수 있는 좋은 프레임워크다. 이 책은 그러한 개발자들의 여정에 동반자가 되어 줄 것이다.

목차
1장 제이쿼리 모바일 프로젝트 준비
시작하며
HTML 페이지 빌드
제이쿼리 모바일 다운로드
제이쿼리 모바일 구현
커스텀 데이터 속성 설정
요약
2장 제이쿼리 모바일 페이지 작업
시작하며?
한 개의 HTML 파일에 여러 페이지 추가
제이쿼리 모바일의 링크 처리
여러 파일로 작업하기
제이쿼리 모바일과 URL
추가적인 사용자 정의
페이지 제목
콘텐츠 프리페칭
페이지 전환 효과 변경
요약
3장 헤더와 푸터, 툴바로 페이지 개선
시작하며
헤더 추가
아이콘 달기
뒤로가기 버튼 만들기
푸터 작업
전체 화면을 위한 위치가 고정된 헤더와 푸터 만들기
전체 화면 모드
내비게이션 바 작업
여러 페이지에 걸쳐 푸터 내비게이션 바 유지시키기
요약
4장 리스트
리스트 만들기
리스트 기능
인셋 리스트 만들기
리스트 디바이더 만들기
자동 디바이더
리스트에 카운트 버블 넣기
썸네일과 아이콘
분할된 버튼 리스트 만들기
검색 필터
요약
5장 실전 응용: 간단한 호텔 모바일 사이트 구축
캠든 호텔 웹사이트의 개요
홈페이지
호텔 찾기
호텔 객실 리스팅
호텔 접속
요약
6장 폼과 제이쿼리 모바일
시작하며
폼을 이용해 할 수 있는 작업
라디오 버튼과 체크박스
select 메뉴
검색, 토글, 슬라이드 필드
검색 필드
토글 필드 전환
슬라이더 필드
네이티브 폼 컨트롤
mini 필드
요약
7장 모달 다이얼로그와 위젯
다이얼로그 만들기
그리드로 내용 표현
반응형 그리드 만들기
접히는 블록으로 콘텐츠 작업
팝업
반응형 테이블
패널
요약
8장 멋진 모바일 애플리케이션 만들기: 메모장 예제
모바일 애플리케이션이란?
모바일 애플리케이션 디자인
요구사항 나열
와이어프레임 만들기
노트 추가 페이지 와이어프레임 디자인
노트 목록 페이지 와이어 프레임 표현
노트 보기/삭제 페이지 와이어 프레임
HTML 작성
자바스크립트로 기능 추가
메모장 데이터 저장
로컬 스토리지
유용한 상용구
노트 추가 기능 구현
바인딩 함수 추가
데이터 수집과 저장
노트 목록 보기 만들기
동적으로 리스트뷰에 노트 추가
노트 보기
.on() 함수
동적으로 새로운 페이지 생성
노트 삭제
요약
9장 자바스크립트를 이용한 제이쿼리 모바일 설정과 다양한 도구
제이쿼리 모바일 설정
제이쿼리 모바일 도구
페이지 함수와 도구
Path와 URL 관련 도구
제이쿼리 위젯과 폼 도구
요약
10장 이벤트
물리적 이벤트
페이지 이벤트 다루기
$(document).ready?
실제 예제 만들기
요약
11장 외관과 기능 개선
무엇을 할 수 있나?
제이쿼리 모바일의 시각적인 구성 요소
둥근 모서리
그림자 효과 적용
text-shadow
box-shadow
CSS 그라디언트
제이쿼리 모바일 테마 기본 적용
Bars (.ui-bar-?)
콘텐츠 영역 (.ui-body-?)
버튼과 리스트뷰 (.ui-btn-?)
견본 혼합 및 주변과 어울리게 하기
사이트 전체의 활성화 상태
기본 아이콘
사용자 정의 테마 제작과 사용
테마롤러란?
테마롤러 사용
미리 보기
색상
검사기
도구 모음
메모장 애플리케이션에 적용할 테마 만들기
테마 내보내기
사용자 정의 아이콘 제작과 사용
CSS 스프라이트
아이콘 디자인
고해상도와 저해상도
다양한 해상도 적용
메모장 애플리케이션 업데이트
커스텀 테마 추가
커스텀 아이콘 추가
요약
12장 네이티브 애플리케이션 만들기
HTML로 네이티브 애플리케이션 제작
폰갭으로 작업
폰갭 기능 추가
요약
13장 RSS 리더 애플리케이션 예제
RSS 리더 애플리케이션
RSS 리더 애플리케이션 만들기
displayFeeds 함수
피드 저장
RSS 피드 추가
피드 보기
항목 보기 만들기
더 나아가기
요약