Do it! 쉽게 배우는 웹앱 & 하이브리드앱

첫째마당 모바일을 위한 HTML5와 CSS3 기본기 익히기

01 웹 표준, 모바일 환경의 이해
01-1 웹 표준의 기본 지식
01-2 웹앱, 네이티브앱, 하이브리드앱

02 작업 환경 준비하기
02-1 개발 툴 준비하기
02-2 브라우저 / 에뮬레이터 / 웹 서버 준비하기
02-3 Hello World 예제 만들어 보기

03 HTML5 시맨틱 마크업 이론 익히기
03-1 시맨틱 마크업 개념 알아보기
03-2 기본적인 HTML5 마크업 사용법
03-3 W3C HTML 웹 표준 인증받기

04 CSS3 기본 기능 익히기
04-1 레이아웃 작업 순서
04-2 인라인 스타일, 내부 스타일 시트,외부 스타일 시트 사용법
04-3 상속 개념 알아보기

05 CSS3 고급 기능 익히기
05-1 선택자를 잘 알아야 하는 이유
05-2 태그 선택자
05-3 클래스 선택자
05-4 아이디 선택자
05-5 하위 선택자
05-6 그룹 선택자
05-7 전체 선택자
05-8 하이퍼링크 사용법 : 앵커 유사 클래스 선택자

06 CSS3 좌표계 사용법 익히기
06-1 레이아웃 위치 개념 알아보기
06-2 컨테이너 안에서 자유롭게 위치 잡기
06-3 CSS3 단위 이해하기
06-4 BOX(상자) 모델을 이용한 위치 잡기

07 CSS3 레이아웃 사용법 익히기
07-1 float 사용법
07-2 clear 사용법
07-3 여러 개의 열 레이아웃 만들기

둘째마당 미디어쿼리와 제이쿼리 모바일로 모바일 UI 디자인하기

08 반응형 웹 디자인하기
08-1 원하는 글꼴을 마음껏! 웹 폰트 사용하기
08-2 반응형 웹 디자인 준비하기
08-3 실전에서 미디어 쿼리 응용하기

09 스마트폰 UI 기법 익히기
09-1 모바일 UI 프레임워크
09-2 JQuery Mobile을 배워보자
09-3 JQuery Mobile로 스마트폰 UI를 시작하자
09-4 화면 구성을 위한 UI 작성하기

10 스마트폰 페이지 전환 효과 익히기
10-1 목록 만들기
10-2 다양한 페이지 링크 연결

셋째마당 실전! 직접 만드는 모바일 웹 프로젝트

11 아이콘 메뉴 페이지 만들기 응용
11-1 웹앱 프로젝트 기획
11-2 메인 페이지 만들기

12 내비게이션 메뉴 만들기 응용
12-1 툴바 기본 사용법 익히기
12-2 Fotorama 사용법 익히기
12-3 캠퍼스 이미지 페이지 만들기

13 자바스크립트 기초 익히기
13-1 HTML5 시대에 떠오르는 언어 자바스크립트
13-2 자바스크립트 언어로 프로그래밍 기초 배우기
13-3 JQuery로 최신 스타일 자바스크립트 기초 배우기

14 이미지 전환 효과 만들기
14-1 CSS3 트랜지션으로 애니메이션 효과 만들기
14-2 대학교 소개 페이지 만들기
14-3 자바스크립트 JQuery로 터치 기능 생명 불어넣기

15 동영상 연결하기
15-1 HTML5로 동영상 연결하기
15-2 VideoJS를 이용하여 세련된 동영상 플레이어 만들기

16 지도에 내 위치 표시하기
16-1 구글 맵을 표시하기
16-2 현재 내 위치를 찾아보기
16-3 캠퍼스 맵 완성하기

넷째마당 웹앱 & 하이브리드앱 만들기

17 무료 FTP 서버 등록 및 배포하기
17-1 무료 FTP 서버에 배포하기
17-2 네이티브앱 같은 웹앱 만들기

18 폰갭을 사용하여 하이브리드앱 만들기
18-1 폰갭으로 하이브리드앱을 안드로이드폰에서 실행하기
18-2 폰갭으로 하이브리드앱을 아이폰에서 실행하기

19 구글 플레이와 애플 앱스토어에 올리기
19-1 구글 플레이에 올리기
19-2 애플 앱스토어에 올리기

부록 안드로이드폰 에뮬레이터 /CSS 디자이너/Chorme To Mobile

01 안드로이드폰 에뮬레이터 설치하기
02 드림위버 CC에서 CSS 디자이너 사용하기
03 Chrome To Mobile 사용법