Do it! 모던 자바스크립트 프로그래밍의 정석

고경희

2010년『Doit!HTML5+CSS3』를출간한후웹관련강의와집필을꾸준히해왔다.웹초창기부터ASP와자바등을소개하는전문도서를번역하면서웹기술에관심을가지기시작했고,이후HTML과DHTML(DynamicHTML),CSS,자바스크립트등웹관련기술을더쉽게익힐수있는도서60여종을집필했다.특히2021년출간한『Doit!HTML+CSS+자바스크립트웹표준의정석』은웹개발에입문하는사람의필독서로자리매김하여2년째웹분야베스트셀러1위를이어오고있다.홍익대학교컴퓨터공학과를졸업하고동대학원에서인공지능을공부한뒤,현재DevelopmentTechnologies분야에서마이크로소프트공인최고기술자(MicrosoftMostValuableProfessional)로활동하고있다.

첫째마당.자바스크립트의기본기다지기

01자바스크립트시작하기
__01-1자바스크립트를위한기본상식
__01-2웹개발에서자바스크립트의역할
__01-3코드작성을위한편집기설정하기
__01-4간단한스크립트부터시작하기

02프로그래밍의기본,변수와자료형살펴보기
__02-1프로그램에서입력받고출력하는방법
__02-2프로그램과친해지려면변수부터익히자
__02-3컴퓨터가세상을보는방법,자료형
__02-4자바스크립트의장점이자단점,자료형변환
__[Doit!]실습화씨온도를섭씨온도로변환하기

03연산자와제어문
__03-1프로그램동작을가리키는기호,연산자
__03-2프로그램흐름을자유롭게조절하는조건문
__[Doit!]실습짝수와홀수를구별하는프로그램만들기
__03-3같은동작을손쉽게반복하는반복문
__[Doit!]실습소수인지의여부확인하기

04프로그래밍한발더나가기,함수와스코프
__04-1프로그래밍의꽃,함수
__[Doit!]실습웹개발자도구창의디버깅기능살펴보기
__04-2변수의유효범위,스코프
__[Doit!]실습웹개발자도구창에서스코프확인하기
__04-3이름없이사용하는함수표현식
__[Doit!]실습입력값을표시하는콜백함수만들기
__04-4전개구문
__04-5시간을고려하는타이머함수

둘째마당.웹문서와자바스크립트

05DOM의기초
__05-1DOM과DOM트리
__05-2웹요소에접근하기
__05-3자바스크립트로스타일수정하기
__05-4DOM에서폼다루기

06이벤트와이벤트처리기
__06-1이벤트알아보기
__06-2이벤트처리하기
__[Doit!]실습모달박스만들기
__06-3event객체
__[Doit!]실습자바스크립트로캐러셀만들기
__06-4이벤트전파

07DOM활용하기
__07-1DOM트리와노드리스트
__07-2웹문서에새로운노드추가하기
__[Doit!]실습장바구니에상품추가하기
__[Doit!]실습시간에따라다른이미지표시하기
__07-3노드삭제하기
__[Doit!]실습나만의도서목록만들기

셋째마당.자바스크립트와객체

08자주사용하는내장객체알아보기
__08-1웹브라우저의최상위객체,window
__08-2Date객체활용하기
__[Doit!]실습만보걷기,오늘까지며칠째일까?
__[Doit!]실습디지털시계만들기
__08-3Math객체활용하기
__[Doit!]실습웹문서의배경이미지를무작위로변경하기

09자바스크립트객체만들기
__09-1객체알아보기
__09-2생성자함수와클래스
__[Doit!]실습생성자함수와클래스를사용해원기둥의부피구하기
__09-3객체의키와값에접근하기
__09-4프로토타입과클래스에서의상속
__[Doit!]실습프로토타입을상속하는새로운객체만들기
__[Doit!]실습클래스상속연습하기

10효율적으로문자열과배열활용하기
__10-1문자열에접근하기
__10-2문자열메서드활용하기
__[Doit!]실습보안을위해이메일주소의일부감추기
__10-3정규표현식으로문자열다루기
__10-4문자열과배열변환하기
__[Doit!]실습영문자열의첫번째글자를대문자로바꾸기
__10-5똑똑하게배열사용하기
__10-6배열의다양한메서드살펴보기

11배열과객체,좀더깊게살펴보기
__11-1에크마스크립트2015의기능복습하기
__11-2구조분해할당하기
__11-3배열을변형하는메서드
__11-4Map과Set
__[Doit!]실습개설요청과목정리하기
__11-5이터레이터와제너레이터
__[Doit!]실습전철노선도만들기

넷째마당.서버와통신하기

12HTTP통신과JSON
__12-1HTTP통신
__12-2JSON
__12-3서버에서자료가져오기
__[Doit!]실습JSON자료를가져와서화면에표시하기1
__[Doit!]실습JSON자료를가져와서화면에표시하기2
__12-4예외처리하기

13비동기프로그래밍
__13-1비동기처리방식
__13-2프로미스
__[Doit!]실습커피주문하고완료하는프로미스만들기
__[Doit!]실습프로미스를반환하는then()메서드확인하기
__[Doit!]실습프로미스체이닝으로프로미스연결하기
__13-3fetchAPI
__13-4async함수와await예약어
__[Doit!]실습서버에서회원정보가져와표시하기1
__[Doit!]실습서버에서회원정보가져와표시하기2

다섯째마당.캔버스로웹브라우저창에그림그리기

14캔버스로도형,텍스트,이미지그리기
__14-1캔버스알아보기
__14-2캔버스에기본도형그리기
__[Doit!]실습캔버스로개구리얼굴그리고파일로저장하기
__14-3캔버스에텍스트그리기
__14-4캔버스에이미지표시하기

15캔버스로그래픽요소다루기
__15-1다양한그래픽스타일지정하기
__[Doit!]실습나만의드로잉앱만들기
__15-2그래픽요소변형하기
__[Doit!]실습버튼을클릭할때마다도형회전시키기
__15-3그래픽요소합성하기

16캔버스에서애니메이션실행하기
__16-1객체를사용해도형그리기
__[Doit!]실습무작위로여러개의도형그리기
__16-2애니메이션효과추가하기
__[Doit!]실습왔다갔다움직이는원만들기
__[Doit!]실습궤적이남는애니메이션만들기
__[Doit!]실습여러개의도형이무작위로움직이는애니메이션만들기

여섯째마당.API활용하기

17웹API활용하기
__17-1API알아보기
__17-2웹스토리지API
__[Doit!]실습웹스토리지다루기
__[Doit!]실습로컬스토리지를활용해할일목록프로그램만들기
__17-3지오로케이션API

18공개API활용하기
__18-1공개API알아보기
__18-2지도API사용하기
__[Doit!]실습카카오맵API를사용하기위한API키받기
__[Doit!]실습지도에이지스퍼블리싱의위치표시하기
__18-3‘공공데이터포털’사이트활용하기
__[Doit!]실습오픈API의활용신청하기
__[Doit!]실습오픈API를활용해자료가져오기
__[Doit!]실습지도에전국캠핑장표시하기

찾아보기

“모던자바스크립트의모든것을한권에!”
최신문법부터네이버？카카오API를활용한실무까지다담았다

자바스크립트는이제웹부터서버,앱에이르기까지쓰지않는곳이없는언어가되었다.웹개발에입문하면서자바스크립트의기초만가볍게공부했다면실전에뛰어들었을때너무나도넓은자바스크립트의세계에당황할것이다.이책은자바스크립트를어디서부터공부해야할지몰라헤매는독자를위해준비했다.이책한권만제대로읽으면최신문법부터API활용까지지금알아야할자바스크립트의모든것을대부분배울수있다.

“프런트엔드？백엔드개발자모두의필독서!”
입문자부터숙련된개발자까지누가봐도도움이되는책

자바스크립트는해마다업그레이드되면서새로운기능이계속추가된다.그중핵심기능을될수있는한많이담았다.자바스크립트가처음이라면이책의처음부터끝까지차근차근공부해보자.기본문법을안다면앞부분은필요한만큼만살펴보고,‘셋째마당.자바스크립트와객체’부터집중해서읽어보자.자바스크립트를훨씬깊이이해할수있을것이다.ECMAScript2015(ES6)이후에추가된최신문법도배울수있다.리액트(React.js)든노드(Node.js)든모든웹개발의뿌리인자바스크립트를탄탄하게다져보자.

“프로그래밍,직접해보며배우자!”
‘Doit!시리즈’만의효과적인학습설계를체험해보자

프로그래밍은직접실천하면서배우는게가장효과적인학습방법이다.기본문법부터간단한예제와‘1분복습’으로자세히알아본다.실전예제인‘Doit!실습’에서는코딩을시작하기전에프로그램을어떻게개발할지고민하며개발자가갖춰야할사고력을기른다.각장마지막에있는‘마무리문제’에도전하면자바스크립트의다양한문법을자유롭게활용할수있는응용력까지키울수있다.

“웹분야1위저자와함께공부하자!”
저자직강동영상제공

저자가직접제작한동영상강의를무료로제공한다.책과함께공부하거나,책을읽다가막히면강의영상을찾아보자.마치과외를받는것처럼학습효과가올라갈것이다.

“독학도문제없다!”
30일학습계획표제공

이책의마지막한쪽을넘길때까지독자여러분과함께해줄페이스메이커‘30일학습계획표’를준비했다.한달동안조금씩꾸준히공부하는계획을세우고잘지켜나간다면반드시완독할수있을것이다.

함께배우고,나누고,성장하는‘Doit!스터디룸’으로오세요!
혼자계획을세우고공부하다보면금방지치기마련이다.나와비슷한고민을하는독자를만나어려운내용을공유해보자.서로도움을주고받으며공부하다보면더보람차다.멀리가려면친구와함께해보자.
-Doit!스터디룸카페:cafe.naver.com/doitstudyroom

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