Do it! HTML+CSS+자바스크립트 웹 표준의 정석(전면개정판)(Do it! 시리즈)

웹 분야 도서 1위! 누적 판매 부수 13만 부!

한권으로 끝내는 웹 기본 교과서!
《Do it! HTML+CSS+자바스크립트 웹 표준의 정석》 전면 개정판 출간!

2021년 초판 발행 이후 수많은 웹 개발 입문자와 함께한 《Do it! HTML5+CSS3+자바스크립트 웹 표준의 정석》의 전면 개정판이 출간되었습니다. 초판을 출간한 뒤 새롭게 등장한 최신 기술과 트렌드를 반영하고자 절반이 넘는 내용을 수정했고, 그 결과 지금 웹 개발에 입문하는 사람에게 딱 맞는 책으로 다시 태어났습니다.

최신 웹 표준부터 반응형 웹, ES6+까지
실무에 가장 가까운 웹 기본을 익힌다!

생성형 AI가 등장하면서 개발자라는 직업이 사라질 것이라고 누군가는 말했지만, 이 책은 다르게 말합니다. 생성형 AI 역시 개발을 아는 만큼 편리하게 사용할 수 있는 도구일 뿐이라고요. 그리고 웹 개발을 바닥에서 떠받치는 핵심 기술이 HTML, CSS, 자바스크립트라는 건 변하지 않습니다.
이 책은 웹에 입문한 독자가 기본을 완벽하게 다질 수 있도록 HTML의 태그가 무엇인지부터 친절하게 알려 줍니다. 또한 이 책을 다 공부하면 바로 실무에 활용할 수 있도록 반응형 웹, ES6+ 등 최신 기술과 트렌드까지 파악할 수 있습니다.

실습→복습→평가까지 한 번에!
체계적인 학습 설계로 공부 효과가 3배!

이 책은 한 번만 읽어도 세 번 읽은 것 같은 효과를 얻을 수 있도록 구성했습니다. 장이 시작할 때마다 '이 장을 다 공부하면!' 코너에서 학습 목표를 미리 파악한 뒤 다양한 예제를 직접 코딩하며 실습을 진행합니다. 장 하나를 다 공부하면 '확인' 코너의 질문에 답하며 그 장에서 무엇을 배웠는지 돌아봅니다. 마지막으로 '되새김 문제'로 배운 내용을 얼마나 이해했는지 스스로 평가합니다. 이렇게 체계적인 구성에 따라 공부하다 보면 1번 읽었는데 마치 3번을 읽은 것과 같은 학습 효과를 기대할 수 있습니다.

500여 개의 다양한 예제를 풀며
기본부터 활용까지 확실하게 익힌다!

HTML, CSS, 자바스크립트의 기초를 충분히 배웠다면 그 내용을 활용해 직접 코딩하는 것이 중요합니다. 그래서 소스 코드의 빈칸을 손으로 직접 채우는 손코딩부터 프로그램을 단계별로 따라 하며 만들어 보는 'Do it! 실습'까지 다양한 방식의 예제 500여 개를 수록했습니다. 예제를 풀 때는 배운 코드를 활용하는 데 집중할 수 있도록 모든 파일을 미리 제공합니다. 결과 파일도 함께 제공하니 자신이 직접 작성한 코드의 결과와 비교하며 공부할 수 있습니다.

〈넷플릭스 사이트 따라 만들기〉 PDF 전자책과
주요 구문을 한눈에 볼 수 있는 '웹 치트 시트'를 특별 부록으로 드려요

이 책에서 배운 내용을 한꺼번에 활용할 수 있는 PDF 책 〈넷플릭스 사이트 따라 만들기〉를 드립니다. 웹 개발에 입문하는 사람이라면 누구나 볼 수 있도록 온라인 서점에서 무료로 제공합니다. 책을 다 읽은 뒤에는 꼭 이 PDF 책을 보며 실제 서비스와 비슷한 사이트를 만들어 보세요. 실제로 웹을 만들 때 책으로 공부한 기술을 어떻게, 어떤 순서로 사용하는지 배울 수 있습니다.
책 맨 뒤에는 그동안 앞에서 소개한 태그와 속성, 문법을 한눈에 볼 수 있는 '웹 치트 시트'를 수록했습니다. 코딩하다가 갑자기 태그나 속성이 기억나지 않을 때 바로바로 펼쳐볼 수 있게 한 곳에 싹 모아뒀습니다. 찢어서 책상 옆에 붙여 두면 즉시 찾아볼 수 있어서 편리합니다.

일대일 과외를 받는 듯한
저자 직강 동영상 무료 제공

저자가 직접 해설해 주는 직강 동영상과 함께 공부해 보세요. 도중에 포기하지 않고 더 쉽게 책을 완독할 수 있습니다. 웹 개발을 독학하려고 계획을 세웠거나, 학교에서 공부한 내용을 복습하고 싶다면 동영상 강의를 꼭 활용해 보세요.

독학과 교재 모두 추천!
공부 속도에 맞는 학습 계획표 2종 제공

목표를 세우고 공부하면 두꺼운 책도 끝까지 읽을 수 있습니다. 차근차근 공부하고 싶다면 '30일 정석 코스', 짧은 기간 집중해서 빠르게 끝내고 싶다면 '15일 집중 코스'로 공부 계획을 세워 보세요. 계획한 대로 책을 다 읽고 나면 웹 개발의 기초를 완전히 정복할 수 있을 거예요. 강의 계획에 참고하기도 좋으니 학원이나 대학 교재로도 적극 활용해 보세요.


함께 배우고, 나누고, 성장하는 'Do it! 스터디룸'으로 오세요!

혼자 계획을 세우고 공부하다 보면 금방 지치기 마련입니다. 어려운 내용은 나와 비슷한 고민을 하는 독자를 만나 공유해 보세요. 서로 도움을 주고받으며 공부하다 보면 더 보람차니까요. 내가 잘 이해한 내용은 남을 도와주고 내가 잘 이해하지 못한 내용은 도움을 받으면서 공부하면 복습 효과도 누릴 수 있습니다. 멀리 가려면 친구와 함께해 보세요.
? Do it! 스터디룸: cafe.naver.com/doitstudyroom

이 책, 이런분께 추천해요!

? 프런트엔드, 백엔드 개발자를 지망하는대학생
? 최신 웹 표준 기술을 알고 싶은 웹 개발자
? 웹 개발 분야도정복하고 싶은 웹 디자이너
? 간단한웹 페이지를직접 만들고싶은 마케터
? 창업을준비하며 웹 사이트를 직접 만들고 싶은 CEO

예제 소스 파일은 이지스퍼블리싱 홈페이지의 자료실 또는 저자 깃허브에서 제공합니다

? 이지스퍼블리싱 홈페이지: www.easyspub.co.kr → [자료실] 클릭 → 도서명 검색
? 저자 깃허브: https://github.com/funnycom/doit-hcj-new

첫째마당 웹과 HTML 시작하기

01 웹은 어떻게 움직일까
__01-1 여러 형태의 웹 사이트
__01-2 네트워크 이해하기
__01-3 웹의 기본 동작 이해하기
__01-4 웹 접근성 알아보기
__01장 되새김 문제

02 웹 개발 시작하기
__02-1 웹 개발, 어디서부터 시작할까
__02-2 웹 개발 환경 설정하기

03 HTML 기본 문서 만들기
__03-1 HTML과 첫 만남
__03-2 HTML의 구조 파악하기
__03-3 HTML 파일 만들기
__03-4 웹 문서의 구조를 만드는 시맨틱 태그
__03장 되새김 문제

04 웹 문서에 다양한 내용 입력하기
__04-1 텍스트 입력하기
__04-2 목록 만들기
__04-3 표 만들기
__04-4 이미지 삽입하기
__04-5 오디오와 비디오 삽입하기
__04-6 하이퍼링크 삽입하기
__04장 되새김 문제

05 입력 양식 작성하기
__05-1 폼 삽입하기
__05-2 사용자 입력을 위한 input 태그
__05-3 input 태그의 주요 속성
__05-4 폼에서 사용하는 여러 가지 태그
__05장 되새김 문제

둘째마당 CSS 다루기

06 CSS의 기본
__06-1 스타일과 스타일 시트
__06-2 CSS 기본 선택자 알아보기
__06-3 캐스케이딩 스타일 시트 알아보기
__06장 되새김 문제

07 텍스트를 표현하는 다양한 스타일
__07-1 글꼴 관련 스타일
__07-2 웹 폰트와 아이콘 폰트 사용하기
__07-3 텍스트 관련 스타일
__07-4 목록 스타일
__07-5 표 스타일
__07장 되새김 문제

08 CSS 박스 모델
__08-1 CSS와 박스 모델
__08-2 테두리 스타일 지정하기
__08-3 여백을 조절하는 속성
__08-4 웹 문서의 레이아웃 만들기
__08-5 웹 요소의 위치 지정하기
__08장 되새김 문제

09 이미지와 그러데이션 효과로 배경 꾸미기
__09-1 배경색과 배경 범위 지정하기
__09-2 배경 이미지 지정하기
__09-3 그러데이션 효과로 배경 꾸미기
__09장 되새김 문제

셋째마당 반응형 웹 만들기

10 반응형 웹과 미디어 쿼리
__10-1 반응형 웹 알아보기
__10-2 반응형 요소 만들기
__10-3 미디어 쿼리 알아보기
__10장 되새김 문제

11 플렉스 박스 레이아웃으로 배치하기
__11-1 배치를 위한 기본 속성 살펴보기
__11-2 반응형 웹을 위한 속성 살펴보기
__11장 되새김 문제

12 CSS 그리드 레이아웃으로 배치하기
__12-1 CSS 그리드 레이아웃 사용하기
__12-2 그리드 라인과 템플릿 영역으로 배치하기
__12장 되새김 문제

넷째마당 CSS 고급 기능

13 CSS 고급 선택자
__13-1 연결 선택자
__13-2 속성 선택자
__13-3 가상 클래스와 가상 요소
__13-4 CSS 함수 살펴보기
__13장 되새김 문제

14 트랜지션과 애니메이션
__14-1 트랜스폼 알아보기
__14-2 트랜지션 알아보기
__14-3 애니메이션 알아보기
__14장 되새김 문제

다섯째마당 자바스크립트 기초

15 자바스크립트와 첫 만남
__15-1 자바스크립트로 무엇을 할까
__15-2 웹 브라우저가 자바스크립트를 만났을 때
__15-3 자바스크립트 용어와 기본 입출력 방법
__15-4 자바스크립트 스타일 가이드
__15장 되새김 문제

16 자바스크립트 기본 문법
__16-1 변수 알아보기
__16-2 자료형 이해하기
__16-3 연산자 알아보기
__16-4 조건문 알아보기
__16-5 반복문 알아보기
__16장 되새김 문제

17 함수와 이벤트
__17-1 함수 알아보기
__17-2 변수 스코프
__17-3 재사용할 수 있는 함수 만들기
__17-4 함수 표현식
__17-5 이벤트와 이벤트 처리기
__17장 되새김 문제

여섯째마당 문서 객체 모델(DOM)

18 자바스크립트와 객체
__18-1 객체 알아보기
__18-2 자바스크립트의 내장 객체
__18-3 브라우저와 관련된 객체
__18장 되새김 문제

19 문서 객체 모델(DOM) 다루기
__19-1 문서 객체 모델 알아보기
__19-2 DOM 요소에 접근하고 내용 수정하기
__19-3 DOM에서 이벤트 처리하기
__19-4 DOM에서 노드 추가·삭제하기
__19-5 class 속성 추가·삭제하기
__19장 되새김 문제

[Do it! 실전 프로젝트] 넷플릭스 사이트 따라 만들기

찾아보기

고경희 2010년 《Do it! HTML5 + CSS3》 출간 이후 웹 관련 강의와 집필을 꾸준히 해왔다. 특히 2021년 출간한 《Do it! HTML+CSS+자바스크립트 웹 표준의 정석》은 웹 개발 입문자의 필독서로 자리매김하여 출간 후 계속해서 웹 분야 베스트셀러를 이어 오고 있다. HTML과 DHTML(Dynamic HTML), CSS, 자바스크립트 등 웹 관련 기술을 더 쉽게 익힐 수 있는 도서 60여 종을 집필했다. 홍익대학교 컴퓨터공학과를 졸업하고 동 대학원에서 인공지능을 공부했다. 생성형 AI가 등장하면서 급변하는 시대에도 꼭 필요한 웹 기술의 기본을 제대로 공부할 수 있도록 꾸준히 집필을 이어가고 있다.

대표 저서
- 《Do it! HTML+CSS+자바스크립트 웹 표준의 정석》
- 《Do it! HTML5+CSS3 웹 표준의 정석》
- 《Do it! Node.js 프로그래밍 입문》
- 《Do it! 모던 자바스크립트 프로그래밍의 정석》
- 《Do it! 지옥에서 온 문서 관리자 깃&깃허브 입문》 등