HTML 태그의 사용법부터 HTML5의 주요한 태그를 상세히 학습하고, CSS의 기본 작성법부터 다양한 CSS3의 사용 예시 및 사용법 그리고 CSS라이브러리 부트스트랩을 다룬다. 자바스크립트 기본문법과 함수형 자바스크립트, 그리고 자바스크립트 라이브러리 jQuery의 기본문법, Ajax요청, 캔버스제어 등도 쉬운 예제부터 고급 예제까지 차근차근 학습하면서 익히자.
Contents
Chapter 1 HTML5, CSS3, 자바스크립트의 개요
Section 01. HTML5, CSS3, JavaScript를 알아보자 !
Section 02. HTML5, CSS3, JavaScript는 다양한 곳에 쓰인다
(1) 웹 사이트 작성
(2) 사물 인터넷 구현
(3) 게임 작성
(4) 인공지능 프로그래밍
학습정리
Chapter 2 코드를 작성하고 실행하는 개발 환경 설정
Section 01. 자바, 톰캣, 이클립스 기반의 웹 개발 환경
(1) JDK(Java Development Kit) 다운로드, 설치 및 환경 변수 설정
(2) 웹 컨테이너 톰캣(Tomcat) 다운로드, 설치 및 환경 변수 설정
(3) 통합개발 환경 이클립스(Eclipse) 다운로드, 설치 및 실행
(4) 이클립스에서 웹 애플리케이션 작성
Section 02. 클라우드 기반의 코드 학습 및 테스트 사이트를 사용한 웹 프로그래밍
(1) w3schools.com
(2) jsbin.com
학습정리
Chapter 3 문서를 구조화하는 HTML
Section 01. HTML 개요 및 기본 태그
(1) HTML 개요
(2) HTML 기본 태그
Section 02. HTML5 문서 구조 및 주요 태그
(1) HTML5 문서 구조
(2) HTML5 주요 태그와 속성
학습정리
Chapter 4 태그를 표현하는 CSS와 Advanced CSS(CSS3)
Section 01. CSS 개요 및 CSS 기본 사용법
(1) CSS 개요
(2) CSS 기본 사용법
Section 02. CSS의 주요 속성과 값
(1) 색상과 배경(Colors and Backgrounds) 지정
(2) 폰트(Fonts) 지정
(3) 텍스트(Text) 지정
(4) 테이블(Table) 지정
(5) 테두리(Border) 지정
(6) 박스 모델(Box mode) 지정
(7) 가시성(Visibility)과 위치(Positioning) 지정
Section 03. 미디어 쿼리(Media Query)
(1) 미디어 쿼리의 개요
(2) 미디어 쿼리 사용 방법
Section 04. Advanced CSS(CSS3)의 추가기능
(1) Advanced CSS 개요
(2) 테두리와 배경 : border-radius, box-shadow, background-image, background-size
(3) 텍스트 효과 : text-shadow
(4) 그래디언트 : linear-gradient, radial-gradient
(5) 트랜스 폼 : transform
(6) 트랜지션 : transition
(7) 애니메이션 : @keyframes, animation
(8) 필터 : filter
(9) 이미지 스타일 : 각종 기능을 사용한 이미지 표현
(10) 웹 폰트 : @font-face
(11) 다단 : column-count, column-width
Section 05. 부트스트랩(Bootstrap)
(1) 사용법과 기본 기능
(2) 주요기능
학습정리
Chapter 5 동작을 처리하는 자바스크립트(JavaScript)와 제이쿼리(jQuery) 라이브러리
Section 01. 자바스크립트의 개요
(1) 자바스크립트란?
(2) 자바스크립트 사용 방법
(3) 자바 스크립트의 문장 구조
(4) 데이터타입
(5) 자바스크립트 프로그래밍 권고사항
Section 02. 제어문
(1) 조건문
(2) 반복문
(3) 기타 제어문
Section 03. 함수와 객체
(1) 함수개요와 내장함수
(2) 사용자 정의 함수
(3) 클로저
(4) 객체
Section 04. 제이쿼리를 사용한 태그 제어와 Ajax
(1) 개요
(2) 제이쿼리 기본 사용법
(3) HTML 엘리먼트 내용에 접근하기
(4) 제이쿼리 이벤트 처리
(5) 제이쿼리 Ajax
학습정리
Chapter 6 애니메이션을 만드는 캔버스(Canvas)
Section 01. 자바스크립트로 Canvas 제어
(1) HTML5 캔버스의 사용법
(2) 캔버스 제어하기
(3) 도형, 문자열, 이미지 그리기
Section 02. 캔버스를 사용한 애니메이션
(1) 캔버스에서 애니메이션을 구현하는 순서
(2) 애니메이션 제어
학습정리
Chapter 7 뭔가 만들어 보죠!(반응형 웹 사이트 만들기)
Section 01. 프로젝트 구조 설계
(1) 웹 앱의 구조도 작성
(2) 필요 페이지 명세서
Section 02. 프로젝트 작성
(1) 웹 앱 프로젝트 작성 및 구조 생성
(2) HTML5 보일러 플레이트를 사용한 반응형 웹 사이트 템플릿 사용
(3) 필요 페이지 작성
Section 03. 실행 및 배포하기
(1) 웹 앱 실행하기
(2) 웹 앱 배포
학습정리
Author
김은옥
현재 프로브미디어 대표로 국가인재개발원, 서울시 인재개발원, 한국지역정보개발원 등의 주요 공무원 교육원에서 빅데이터 분석, 인공지능, 파이썬, Java 및 JSP 프로그래밍 강사로 활동하고 있습니다. 주요 저서로는 <기초부터 활용까지 실전으로 배우는 Ajax 웹 프로그래밍>, <막힘없이 배우는 Java Programming>, , , <고등학교 교과서(모바일 콘텐츠, 웹 프로그래밍)>, <안드로이드 프로그래밍>, 등이 있습니다.
현재 프로브미디어 대표로 국가인재개발원, 서울시 인재개발원, 한국지역정보개발원 등의 주요 공무원 교육원에서 빅데이터 분석, 인공지능, 파이썬, Java 및 JSP 프로그래밍 강사로 활동하고 있습니다. 주요 저서로는 <기초부터 활용까지 실전으로 배우는 Ajax 웹 프로그래밍>, <막힘없이 배우는 Java Programming>, <JSP 웹 프로그래밍 입문>, <JSP 2.3 웹 프로그래밍>, <고등학교 교과서(모바일 콘텐츠, 웹 프로그래밍)>, <안드로이드 프로그래밍>, <HTM5&CSS3 그리고 jQuery> 등이 있습니다.