HTML5 및 모바일 웹 개발 교육

본 교육 자료는 HTML5와 모바일 웹 개발을 위한 제주지역 웹 개발자 및 컴퓨터 공학 학생들을 대상으로 한 융합 IT 전문가 교육 과정의 자료입니다. 프론트 엔드 웹 개발자를 대상으로 하는 10일간 혹은 1학기간 각 3시간의 강의와 실습 과제가 가능한 프로그램으로 구성되어 있습니다.

교육 소개

• 일시: 2010년 8월 16일(월) ~ 27일(금)
• 장소: 다음 GMC 및 제주 벤처 마루
• 강사: 윤석찬

교육 프로그램

• 교육 자료는 "Downloads"항목을 보시면 받으실 수 있습니다.
• 선수 교육
• 웹 표준 기반 개발 방법론
• 자바스크립트 기초
• 강의 교재: 실전 HTML5 가이드 (다운로드 가능)

0일차 HTML5의 소개와 현황

• HTML5의 역사 및 소개
• HTML5 오픈 콘퍼런스 동영상 보기 (다운로드 가능)

1일차 HTML5 마크업

• XHTML2.0과 HTML5의 설계 모델
• HTML5의 새로운 구조 및 시맨틱 마크업에 대한 소개
• 레이아웃 설계 및 마크업 활용법

2일차 Rich Web과 WebForm

• Canvas 2D 그래픽 소개 및 실습 https://developer.mozilla.org/en/canvas_tutorial
• Video/Audio 마크업 및 동영상 변환
• WebForm 소개 및 실습 http://olav.dk/wf2/demo/default.asp

3일차 (실습) HTML5 기반 티스토리 스킨 만들기

• 블로그 마크업 소개 및 HTML5 기본 마크업 안내
• 티스토리 스킨 소개 및 실습

4일차 CSS3

• CSS3 소개 및 주요 기능

5일차 Interaction API

• File API
• Drag & Drop API http://playground.html5rocks.com/#drag_from_desktop
• Geolocation API http://playground.html5rocks.com/#get_current_position
• 실습 예제: 오프라인 이미지 업로더

6일차 JS라이브러리- jQuery

• jQuery 기초 및 실습
• 실습 위치: http://code.google.com/apis/ajax/playground/#jquery

7일차 Storage API

• DOM Storage API (localStorage, globalStorage)
• Web SQL Database
• IndexedDB
• Off-line Cache

8일차 HTML5 모바일 웹 개발

• 모바일 웹 개발 방법론
• 아이폰 웹앱 개발 방식
• iUi 라이브러리

9일차 실습

• jQTouch 기반 HTML5 모바일 웹앱 만들기

10일차 고급 JS API

• Web Socket
• Web Worker

참고 사이트

• http://html5doctors.com HTML5 마크업에 대한 자료가 많음 ★★★
• http://html5demos.com HTML5 API에 대한 데모가 있음 ★★
• http://html5gallery.com HTML5 + CSS 마크업 예제가 많음 ★★★
• http://html5rocks.com 구글의 HTML5 코드 샘플 및 튜토리얼 ★★★★★
• http://html5test.com/ 웹브라우저별 지원 정도 제공 ★★★★
• http://www.apple.com/html5/ 애플의 HTML5 데모 사이트 ★

블로그 글

• HTML5의 모든것 ★★★★
• HTML5와 HTML4의 차이점 ★★★
• 15 Useful HTML5 Tutorials and Cheat Sheets ★★★
• 28 HTML5 Features, Tips, and Techniques you Must Know ★★★★