웹 애플리케이션 개발에 있어 필요한 기본 요소를 빠짐 없이 소개한다. 웹 기술의 기본이라고 할 수 있는 HTML과 CSS를 시작으로 동적인 요소를 추가할 자바스크립트와 이를 활용한 서버 관련 기술인 NodeJS, 웹 애플리케이션을 개발하기 위한 기본적인 기술에 대해 상세하게 소개한다. 그리고 부트스트랩이나 jQuery, 앵귤러JS와 같은 웹 프레임워크를 활용해 웹 애플리케이션을 더 효율적이고 멋지게 만드는 방법을 설명한다. 모바일 기기를 통해 웹에 접속하는 사용자가 많아지면서 반응형 웹의 인기가 높아졌다. 이런 추세에 맞춰 웹 개발용 프론트엔드 프레임워크인 부트스트랩에 대해서도 설명한다.

[목 차]

1장. HTML 요소
__DOCTYPE
____속성
____설명
__html
____속성
____설명
__문서 메타데이터
____head
____title
____link
____meta
____style
____base
____-script
____no-script
__시맨틱 콘텐츠
____body
____section
____nav
____article
____Heading
____header
____footer
____address
____aside 64
____p
__content 섹션
____hr
____pre
____blockquote
____ol
____ul
____li
____dl
____dt
____dd
____figure
____figcaption
____div
____main
__인라인 요소
____a
____abbr
____bdo
____br
____cite
____code
____dfn
____em
____kbd
____mark
____q
____s
____samp
____small
____span
____strong
____sub
____sup
____time
____var
____wbr
__삽입된 콘텐츠
____img
____-i-frame
____-embed
____-object
____param
____video
____audio
____source
____track
__테이블
____table
____caption
____tbody
____thead
____tfoot
____tr
____td
____th
__폼
____form
____fieldset
____legend
____label
____input
____button
____select
____optgroup
____option
____textarea
__드로잉 요소
____canvas
____svg

2장. HTML 속성
__전역 속성
____accesskey
____class
____contenteditable
____data-*
____dir
____draggable
____hidden
____id
____lang
____spellcheck
____style
____tabindex
____title
__그 외 속성
____accept
____accept-charset
____action
____alt
____async
____autocomplete
____autofocus
____autoplay
____autosave
____cite
____cols
____colspan
____datetime
____disabled
____download
____content
____controls
____for
____form
____formaction
____height
____href
____hreflang
____label
____list
____loop
____max
____maxlength
____media
____method
____min
____multiple
____name
____novalidate
____pattern
____placeholder
____poster
____readonly
____rel
____required
____reversed
____rows
____rowspan
____scope
____selected
____size
____src
____start
____step
____type
____value
____width
____wrap

3장. CSS 개념과 애플리케이션
__기본 선택자
____단순 선택자
__연결자
____자손 연결자
____자식 연결자
____인접 형제 연결자
____일반 형제 연결자
____선택자 명시도
__가상 클래스
____링크 가상 클래스
____사용자 액션 가상 클래스
____구조적 선택자
__상태 선택자
____:checked
____:default
____:disabled과 :enabled
____:empty
____:in-range와 :out-of-range
____:invalid와 :valid
____:not 또는 부정
____:optional과 :required
____:lang()
__가상 요소
____::before와 ::after
____::first-letter
____::first-line
____::selection
__생성된 콘텐츠
____content
____인용 부호

4장. CSS 프로퍼티: 파트 1
__애니메이션
____기본 마크업과 CSS
____최종 CSS 코드
__백그라운드
____background-attachment
____background-blend-mode
____background-clip
____background-color
____background-image
____background-origin
____background-position
____background-repeat
____background-size
____background
__박스 모델
____width
____height
____padding
____margin
____Border
____box-sizing
____max-height
____max-width
____min-height
____min-width
____-object-fit
____-object-position
__Border radius
____border-radius
__Unit
____상대적 길이 단위
____뷰포트: 상대 길이 단위
____절대 길이 단위
____각도 데이터 타입
____해상도 단위
____시간 단위
____칼럼
__플렉스박스
____flex-grow
____flex-shrink
____flex-basis
____flex-direction
____flex-wrap
____flex-flow
____align-content
____align-items
____align-self
____order
____justify-content
____flex
__요약

5장. CSS 프로퍼티: 파트 2
__폰트
____font-family
____font-feature-settings
____font-size
____font-size-adjust
____font-stretch
____font-style
____font-variant
____font-variant-ligatures
____font-weight
____font
__트랜스폼
____transform
____transform-origin
____transform-style
____Transition
__포지셔닝
____position
____top
____bottom
____left
____right
____vertical-align
__텍스트
____color
____text-align
____text-decoration
____text-decoration-line
____text-decoration-color
____text-decoration-style
____text-indent
____text-overflow
____text-rendering
____text-shadow
____text-transform
____text-underline-position
____direction
__테이블
____table-layout
____border-collapse
____border-spacing
____empty-cells
____caption-side
__단어와 단락
____hyphens
____word-break
____word-spacing
____word-wrap
____line-height
____orphans
____quotes
____widows
____writing-mode
____letter-spacing
____white-space
____tab-size
__페이징
____page-break-after
____page-break-before
____page-break-inside

6장. CSS 프로퍼티: 파트 3
__페이지 박스
____bleed
____설명
____marks
__리스트
____list-style
____list-style-type
____list-style-position
____list-style-image
__카운터
____counter-reset
____counter-increment
__섀도우 드롭(drop shadow)
____box-shadow
__디스플레이와 가시성 속성
____all
____clear
____display
____opacity
____filter
____overflow
____overflow-x
____overflow-y
____visibility
____z-index
__마스킹과 클리핑
____mask
____mask-clip
____mask-composite
____mask-image
____mask-mode
____mask-origin
____mask-position
____mask-repeat
____mask-size
____mask-type
____mask-border
____mask-border-source
____mask-border-mode
____mask-border-slice
____mask-border-width
____mask-border-outset
____mask-border-repeat
____clip-path
__이미지 렌더링과 오리엔테이션(방향)
____image-orientation
____image-rendering
__사용자 인터페이스
____cursor
____pointer-events
____outline
__3차원
____perspective
____perspective-origin
____backface-visibility
__요약

7장. CSS 함수
__필터
____brightness()
____contrast()
____grayscale()
____invert()
____hue-rotate()
____blur()
____saturate()
____sepia()
____트랜스폼
____matrix()
____matrix3d()
____rotate3d()
____rotateX()
____rotateY()
____rotateZ()
____scale()
____scale3d()
____scaleX()
____scaleY()
____scaleZ()
____skew()
____skewX()
____skewY()
____steps()
____translate()
____translate3d()
____translateX()
____translateY()
____translateZ()
__색상
____hsl()와 hsla()
____rgb()와 rgba()
__그래디언트
____linear-gradient()
____radial-gradient()
____repeating-linear-gradient()
____repeating-radial-gradient()
__값
____attr()
____반응형 테이블
____calc()
____url()
____cubic-bezier()
__기타
____drop-shadow()
____element()
____image()
____설명
____opacity()
____perspective()
____rect()
__at-규칙
____@charset
____@-document()
____@font-face
____구글 폰트
____@import
____@key-frames
____@media
____@namespace
____@page
____@supports
__전역 CSS 키워드 값
____auto
____inherit
____initial
____none
____normal
____unset
____revert
____요약

8장. 자바스크립트 구현, 기본 문법, 변수 타입
__자바스크립트의 역사
____자바스크립트의 발전
__자바스크립트 구현
____코어 자바스크립트(ECMAScript)
____DOM
____BOM
____클라이언트 단의 자바스크립트(Client-side JavaScript)
____외부 자바스크립트 파일 로딩하기
____자바스크립트로 첫 번째 프로그램 만들기
____서버 단의 자바스크립트
____Rhino를 사용해 스크립트 만들기
____Node.js
____설명
__언어적 문법
____Language
____Type
__문자 세트
____대소문자 구별
____화이트스페이스와 줄 바꿈
____유니코드 이스케이프 시퀀스
____정규화
____식별자
____예약 키워드
____주석
____리터럴
____문장
____세미콜론
__데이터 타입
____연산자 타입
____undefined 타입
____널 타입
____숫자 타입
____불린 타입
____문자열 타입
____오브젝트 타입
__변수, 범위, 메모리
____변수 선언
____변수 범위
____프리미티브와 레퍼런스 값
____실행 컨텍스트와 범위
____가비지 컬렉션

9장. 자바스크립트 표현식, 연산자, 문장, 배열
__표현식
____기본 표현식
____오브젝트 초기화
____함수 정의 표현식
____프로퍼티 액세스 표현식
____호출 표현식
____오브젝트 생성 표현식
____평가 표현식
__연산자
____개요
____산술 연산자
____논리 연산자
____지정 연산자
____누승 지정자 (**=)
____관계 연산자
__문장
____표현문
____복합 빈 문장(Compound empty statement)
____선언문
____조건문
____루프
____점프와 라벨 문장
__배열
____배열 타입
____배열 타입 오브젝트
____배열 만들기
____배열 요소에 읽고 쓰기
____자바스크립트의 다차원 배열
____배열 내 프로퍼티
____배열 메소드
____ECMA 배열 메소드

10장. 자바스크립트 객체 지향 프로그래밍
__다형성
____캡슐화
____상속
____추상화
__오브젝트
____오브젝트 만들기
____디자인 패턴
____프로퍼티 getter와 setter
____프로퍼티 삭제
____테스팅 프로퍼티
____프로퍼티 열거
____프로퍼티 속성
____오브젝트 속성
____객체 직렬화
____오브젝트 메소드
__함수와 메소드
____함수 invoke하기
____함수 정의하기
____함수의 인수와 파라미터
____파라미터와 반환 값
____네임스페이스로서 함수
____클로저
____함수 프로퍼티
____메소드
____함수 생성자
__클래스와 모듈
____클래스와 프로토타입
____생성자
____클래스 정의하기
____ECMA5 스크립트 내의 클래스
____모듈
__상속
____프로토타입 체인
____생성자 훔치기
____조합 상속
____프로토타입 상속
____기생 상속
____기생 조합 상속
____서브클래스
__빌트인 오브젝트
____전역 오브젝트
____날짜 오브젝트
____getTime()
____getMilliseconds()
____getMinutes()
____getHours()
____getDate()
____getDay()
____getMonth()
____getFullYear()
____날짜 설정 메소드
____수학 오브젝트
____RegExp 오브젝트
____문자열 오브젝트
____배열 오브젝트

11장. 자바스크립트와 ECMAScript 6의 확장
__호환성과 목표 사항
__자바스크립트의 서브셋과 확장
____자바스크립트 서브셋
____자바스크립트 확장
____const
____let
____비구조화 할당
____for each
____반복자
____생성기
____변수
____생성자 표현식
__범위 지정 변수와 상수
____단축 함수
____다중 catch절
__E4X - XML을 위한 ECMAScript
__ECMAScript 6의 주요 기능
____화살표 함수
____클래스
____향상된 오브젝트 리터럴
____템플릿 문자열
____비구조화된 할당
____바인딩
____반복자와 for...of 연산자
____제너레이터
____유니코드 지원
____모듈
____모듈 로더
____컬렉션
____프록시
____심볼
____서브클래스로 만들 수 있는 빌트인
____프라미스
____코어 수학 라이브러리 API
____2진과 8진 리터럴
____Reflect API
____꼬리 호출

12장. 서버 단 자바스크립트: NodeJS
__파일과 프로세스 관리
____모듈
____OS 모듈
____process 모듈
____파일 함수
____파일 모듈
____path 모듈
____REPL
____node
____에러 처리
__유틸리티
____이벤트
____암호화
____버퍼
____콘솔
____npm
____스트림
____setEncoding
__net 모듈
____createServer
____net.Server
____net.Socket
__HTTP 모듈
____createServer
____http.Server
____IncomingMessage
____ServerResponse
____http.clientRequest

13장. 부트스트랩: 스타일리시CSS 프론트엔드 프레임워크
__부트스트랩 기본 소개
____HTML5 doctype
____모바일 우선
____반응형 이미지
____컨테이너
__시작하기
____깃허브 프로젝트
____Bootstrap 다운로드
____bower로 설치하기
____npm으로 설치하기
____composer로 설치하기
__레이아웃
____고정 레이아웃
____유동 레이아웃
____반응형 레이아웃
____지원되는 장치
__그리드 시스템
____그리드 옵션 요약표
____미디어 쿼리
____반응형 열 재설정
____열 오프셋
____열 중첩
____열 배치
____LESS 변수와 믹스인
____믹스인
____변수
__타이포그래피
____제목
____본문
____리드 본문
____강조
____작은 텍스트
____굵은 텍스트
____기울임 텍스트
____정렬
____약어
____기본
____두문자어
____주소
____인용구
__표
____기본
____줄무늬 행
____경계선 있는 표
____행 호버링
____좁은 폭 행
____맥락적인 클래스
____반응형 표
__목록
____순서 없는 목록
____순서 있는 목록
____스타일 없는 목록
____인라인 목록
____설명 목록
____수평 설명
__부트스트랩의 폼
____수직 폼
____인라인 폼
____수평 폼
____부트스트랩의 폼 입력
____텍스트 영역
____도움말 텍스트
____체크박스
____선택 목록
____라디오 버튼
____정적 컨트롤
____입력 포커스
____비활성화 입력
____유효 상태
____컨트롤 크기 조절
__이미지
____보조 아이콘
__내비게이션 요소
____탭
____필
____양쪽 정렬
____비활성화 링크
__내비게이션 바
____기본 설정
____폼
____버튼
____텍스트
____일반 링크
____상단에 고정
____하단에 고정
____정적 상단
____반전된 내비게이션 바
__패널
____기본
____제목
____꼬리말
____그룹
__경로
__라벨과 배지
____라벨
____배지
__페이지네이션
____기본 설정
____페이저
__프로그레스 바
__고급 부트스트랩/자바스크립트 플러그인
____버튼
____기본
____버튼 툴바
____크기 조절
____중첩
____수직형
____양쪽 정렬 링크형
____드롭다운
____단일 버튼
____분할 버튼
____툴팁
____위치 설정
____팝오버
____기본 생성
____위치 설정
____닫기
____경보
____탭
____아코디언
____모달
____모달 크기
____미디어 객체
____캐러셀
____자동 완성
____자동 완성 만들기
____자바스크립트를 통한 자동 완성 사용하기
____스크롤스파이
____데이터 속성을 통한 스크롤스파이 활성화
____자바스크립트를 통한 스크롤스파이 활성화
____애픽스
____데이터 속성을 통한 애픽스 활성화
____자바스크립트를 통한 애픽스 활성화
__사용자 정의 부트스트랩
__부트스트랩으로 만든 웹사이트
__부트스트랩 관련 참고 자료

14장. jQuery: 유명한 자바스크립트 라이브러리
__jQuery의 발전
__시작하기
____JQuery 설치하기
__jQuery 사용하기
__선택자
____요소 선택자
____ID 선택자
____클래스 선택자
__이벤트
____마우스 이벤트
____키보드 이벤트
____폼 이벤트
____브라우저 이벤트
__효과와 애니메이션
____animate()
____stop()
____숨김, 나타냄, 토글
____페이드 효과
____슬라이드 효과
__콜백
____callbacks.add()
____callbacks.fire()
____callbacks.remove()
____callbacks.disable()
__체이닝
__jQuery와 문서 객체 모델
__jQuery 순회
____조상
____parent()
____parents():
____parentsUntil():
____자손
____find()
____형제
____반환
____필터링
__jQuery에서 AJAX 사용하기
____jQuery의 Ajax Load
____jQuery의 Ajax Get
____jQuery의 Ajax Post
__다양한 jQuery 함수
____noConflict()
____param()
____index()
____each()
____data()
____removeData()
__jQuery 플러그인
__jQuery 참고 자료

15장. AngularJS: 구글의 맞춤형 프레임워크
__모듈(ngApp)
____module
____config
____run
__라우팅(ngRoute)
____ngView
____$routeProvider
____$route
____$routeParams
__의존성 주입
____앵귤러에서의 의존성 주입
____injector
____$injector
__컨트롤러
____ngController
____$scope
____데이터 바인딩과 템플릿
____이벤트 바인딩
__범위
____다이제스트 사이클
____$watch
____$apply
____계층
__서비스
____팩토리
____서비스
____제공자
____값
____상수
____$http
____유용한 메소드
____중요한 서비스
__프라미스
____$q
__표현식
____자바스크립트의 표현식
__지시자
____정규화
____범위
____DOM 변경
____이벤트 바인딩
____지시자 정의 객체
____주요 지시자
__전역
____extend
____noop
____isUndefined
____copy
____bind
__폼
____ngModel
____검증
__테스트
____Jasmine과 Karma로 단위 테스트하기
____ngMock
____단위 테스트 컨트롤러
____단위 테스트 지시자
____단위 테스트 서비스

웹 애플리케이션 개발에 있어 필요한 기본 요소를 빠짐 없이 소개한다. 웹 기술의 기본이라고 할 수 있는 HTML과 CSS를 시작으로 동적인 요소를 추가할 자바스크립트와 이를 활용한 서버 관련 기술인 NodeJS, 웹 애플리케이션을 개발하기 위한 기본적인 기술에 대해 상세하게 소개한다. 그리고 부트스트랩이나 jQuery, 앵귤러JS와 같은 웹 프레임워크를 활용해 웹 애플리케이션을 더 효율적이고 멋지게 만드는 방법을 설명한다. 모바일 기기를 통해 웹에 접속하는 사용자가 많아지면서 반응형 웹의 인기가 높아졌다. 이런 추세에 맞춰 웹 개발용 프론트엔드 프레임워크인 부트스트랩에 대해서도 설명한다.

★ 이 책에서 다루는 내용 ★

■ 주요 HTML 요소 및 속성에 관한 설명과 예제
■ CSS 프로퍼티 및 함수의 개념과 사용법
■ 자바스크립트 문법과 표현식
■ 다양한 자바스크립트 패턴과 자바스크립트 객체 지향 프로그래밍의 기본
■ 웹 애플리케이션의 클라이언트 단 스크립팅을 위한 최신 ECMASCript 6 구현
■ 신속한 웹사이트 프론트엔드 개발을 위한 새로운 방법과 부트스트랩
■ jQuery를 이용한 자바스크립트 확장
■ 자바스크립트 서버 단 프로그래밍을 위한 핵심 Node.js 모듈
■ AngularJS의 중요 모듈, 컨트롤러, 지시자, 서비스

★ 이 책의 대상 독자 ★

고급 웹 개발자뿐 아니라 초보자도 유용하게 읽을 수 있도록 작성됐다. 웹 개발자라면 누구나 소중한 리소스를 얻을 수 있을 것이다. HTML, CSS, 자바스크립트, NodeJS, 부트스트랩, jQuery, Angular에 대한 콘셉트를 찾아볼 수 있다.

★ 이 책의 구성 ★

1장, *HTML 요소*에서는 웹페이지를 만들 때 필요한 모든 요소를 살펴본다. HTML5을 집중적으로 다룬다.
2 장, *HTML 속성*에서는 HTML 요소와 같이 사용할 수 있는 속성을 살펴본다.
3장, *CSS 개념과 애플리케이션*에서는 선택자(selector)에 대해 주로 설명한다. 선택자는 CSS 속성이 어떤 요소에 적용될지를 결정한다.
4장, *CSS 프로퍼티: 파트I*에서는 애니메이션, 백그라운드, 박스 모델, CSS 유닛, 칼럼, 플렉스박스(Flexbox)의 프로퍼티를 다룬다.
5장, *CSS 프로퍼티: 파트2*에서는 폰트, 트랜스폼(transform), 전환(transition), 포지션(position), 텍스트, 테이블, 단어(word,) 단락(paragraph), 페이징(paging)을 다룬다.
6장, *CSS 프로퍼티: 파트3*에서는 페이지 박스, 리스트, 카운터, 섀도우 드롭(drop shadow), 디스플레이(display)와 가시성(visibility), 마스킹(masking)과 크리핑(clipping), 사용자 인터페이스 및 3D의 프로퍼티를 다룬다.
7장, *CSS 함수*에서는 필터, 트랜스폼, 색상, 그래디언트, 값을 다룬다. at-규칙, 전역 키워드 값, 기타 항목 등의 별도 개념도 다뤘다.
8장, *자바스크립트 구현, 기본 문법, 변수 타입*에서는 문법과 변수, 그리고 타입을 포함한 자바스크립트의 구현과 기본적인 언어 사항을 다뤘다. 이 장에서는 기본적인 스크립팅을 이해하고 시작할 수 있도록 해준다.
9장, *자바스크립트 표현식, 연산자, 문장, 배열*에서는 기본적인 자바스크립트 언어를 이해하고 더불어 고급 내용으로 나아간다. 자바스크립트 표현식, 기본 연산자, 문장, 배열을 소개하고, 더 나은 이해를 돕기 위해 예제를 포함한다.
10장, *자바스크립트 객체 지향 프로그래밍*에서는 객체 지향 프로그래밍의 기본 개념을 설명한다. 상속(inheritance), 다형성(polymorphism), 추상화(abstraction), 캡슐화(encapsulation)를 다룬다. 그리고 오브젝트, 클래스, 관련 메소드를 사용하는 방법을 배운다. 더 나은 이해를 돕기 위해 다양한 예제를 포함한다.
11장, *자바스크립트와 ECMAScript 6의 확장*에서는 2015년에 출시된 ECMAScript 6의 모든 새로운 기능을 다룬다. 오브젝트, 패턴, 문법적인 변경 사항, 기존 오브젝트의 새로운 메소드 등까지 모든 기능을 상세히 다룬다.
12장, *서버 단 자바스크립트: NodeJS*에서는 클라이언트 단이 아닌 서버 단에서의 자바스크립트를 작성하는 방법을 배운다. 특별한 NodeJS 오브젝트와 패러다임을 배우며, 자바스크립트와 관련된 다른 장의 개념도 다시 사용한다.
13장, *부트스트랩: 스타일리시 CSS 프론트엔드 프레임워크*에서는 반응형 웹사이트를 만들기 위한 직관적인 프레임워크인 부트스트랩에 대해 이야기한다. 부트스트랩은 자바 스크립트, HTML, CSS를 포함한다. 부트스트랩 프레임워크에 대한 자세한 내용을 제공하며, 반응형 레이아웃과 웹페이지를 만들 수 있게 해준다. 각 토픽은 관련 예제를 포함한다.
14장, *jQuery: 유명한 자바스크립트 라이브러리*에서는 HTML의 다양한 내용을 지원하는 자바스크립트 라이브러리인 jQuery를 집중적으로 설명한다. 신속한 개발을 위한 HTML 문서의 요소, 메소드, 이벤트 핸들링, 애니메이션, AJAX에 대해 배운다.
15장, *AngularJS: 구글의 맞춤형 프레임워크*에서는 외부 라이브러리를 다루는 내용 중 마지막 부분이다. 구글에 의해 소개된 가장 유명한 프레임워크인 Angular를 사용해 애플리케이션을 개발할 때 필요한 주요 콘셉트를 설명한다.

★ 지은이의 말 ★

이 책은 웹 개발자가 알아야 하는 많은 내용을 다룬다. 새롭거나, 알고 있거나, 이미 잊어버린 내용도 다룬다. 이 책의 첫 두 장에서는 HTML의 기본적인 요소(element)와 속성(attribute)을 다룬다. 다음 네 장에서는 CSS의 개념과 문법을 다룬다. 그다음 다섯 장에서는 자바스크립트에 대해 살펴본다. 마지막으로는 외부 라이브러리를 다룬다. 여기서는 부트스트랩(Bootstrap), jQuery, Angular를 포함한다. 이 책은 레퍼런스 가이드이므로, 쭉 읽어보는 참고서 형태를 취하지는 않았다. 각 장과 개념은 개별로 읽기 편하며, 필요할 때 관련 정보를 빨리 살펴볼 수 있도록 구성돼 있다.

★ 옮긴이의 말★

모바일과 클라우드의 등장은 웹 기술에 폭발적인 혁신을 가져왔다. 팀 버너스 리에 의해 소개된 초기의 월드 와이드 웹은 단방향으로 단순히 정보를 전달할 수 있었지만, Ajax와 시맨틱 웹 같은 다양한 기술을 통해 현재는 더욱 다양한 기능을 수행하고 있다. 월드 와이드 웹 기술의 이와 같은 발전과 함께 다양한 개발 기술들이 소개됐으며, 최근 가장 핵심 기술로 자바스크립트가 단연 두각을 나타내고 있다.
새로운 환경에 적합한 좀 더 강력한 프론트엔드와 유연한 백엔드가 필요해졌고, 이를 위해 많은 라이브러리와 프레임워크가 출시됐다. AngularJS나 NodeJS와 같이 자바스크립트로 구현된 다양한 프레임워크는 웹 애플리케이션 개발자들에게 많은 도움을 주고 있다. 하지만 이러한 프레임워크를 활용해 웹 애플리케이션을 개발하려면 HTML이나 CSS 같은 기본적인 기술뿐만 아니라 자바스크립트라는 언어 자체를 이해하고 있어야 한다.
자바스크립트는 Ajax의 등장으로 조명을 받기 시작했다. 원래는 클라이언트 단개발 언어였던 자바스크립트를 기반으로 서버 단 플랫폼인 NodeJS를 이용해 서버도 개발할 수 있게 됐으며, 가장 인기 있는 자바스크립트 라이브러리 중 하나인 jQuery를 통해 Ajax 호출과 DOM 조작이 더욱 쉬워졌다. 또한 MVC 패턴이 적용된 프레임워크로서 SPA 구축에 가장 최적화된 AngularJS 역시 자바스크립트를 기반으로 한다.
이 책은 웹 애플리케이션 개발 입문자에게 필요한 기본 요소를 빠짐없이 소개한다. 웹 기술의 기본이라 할 수 있는 HTML과 CSS를 비롯해 동적인 요소를 추가하기 위한 자바스크립트와 이를 활용한 서버 쪽 기술인 NodeJS, 그리고 웹 애플리케이션 개발에 관련된 기본적인 기술을 상세히 소개한다. 부트스트랩이나 jQuery, AngularJS와 같은 웹 프레임워크를 활용해 웹 애플리케이션을 더 효율적이고 멋지게 만드는 방법을 설명하고, 모바일 기기를 통한 웹 접속이 증가하면서 반응형 웹의 인기가 급증한 추세에 맞춰 웹 개발용 프론트엔드 프레임워크인 부트스트랩에 대해서도 살펴본다.
이 책은 웹 개발에 필요한 핵심 내용뿐 아니라 최근 가장 인기 있는 프레임워크들에 대한 내용도 담고 있으므로 웹 개발 입문자와 숙련된 개발자 모두에게 훌륭한 가이드가 될 것이라 믿는다.

조슈아 조하난(Joshua Johanan)
인디애나의 사우스벤드에 살고 있는 웹 개발자다. 5년 동안 웹을 개발해왔으며 PHP, 파이썬, 자바스크립트, C# 등 다수의 언어를 사용해 사이트를 구축해왔다. 다양한 언어들 가운데 특히 파이썬과 자바스크립트를 선호한다. 이러한 언어들은 Zend 프레임워크, Django, .Net*s MVC 같은 각기 다른 MVC 프레임워크를 사용할 수 있게 해준다.
이 책을 통해 확인할 수 있듯이 Node.js를 사용하는 백엔드와 다른 많은 라이브러리를 사용하는 프론트엔드 모두에서 자바스크립트를 사용해왔다. Backbone, React, jQuery를 비롯한 이전의 일반적인 자바스크립트를 모두 포함한다.
현재는 건강 관리 관련 운영기구에서 C#으로 웹사이트를 구축하고 있다. 현재의 개발 과정으로는 최신 브라우저 기술을 사용할 수 없지만, 유지 보수와 확장을 위한 개발 기술을 얻을 수 있다.
이 책이 첫 번째 저서며, 자신의 블로그(http:// ejosh.co/de/)를 통해 주기적으로 관련 지식을 소개하고 있다.

탈아 칸(Talha Khan)
열정적인 웹 개발자이자 자바스크립트 전문가며 소프트웨어 컨설턴트다. 또한 UAE에 현재 거주하는 파키스탄 커피 마니아다. 웹 분야에서 5년 이상의 경력을 가지고 있다. 수학과 통계학을 전공했지만 웹 기술을 사랑하고, 이러한 열정을 바탕으로 웹 기술 분야에 뛰어들게 됐다. PHP, MYSQL, HTML, CSS, 자바스크립트 라이브러리를 사용하는 닷넷 스위트(Dot Net Suite)를 사용해 상호연동하는 인터랙티브 웹사이트와 웹 애플리케이션의 개발 분야에서 많은 경험을 쌓았다. 웹 개발 기술을 가르쳐왔을 뿐만 아니라 스택플로우 같은 프로그래밍 포럼에 대한 열성적인 기여자이기도 하다. 때때로 @alphaprofile로 트윗을 남기기도 한다.
지금껏 여러 주요 브랜드와 회사를 위한 다양한 프로젝트를 수행해왔다. 파키스탄의 선도적인 레스토랑과 음식 검색 엔진인 Tossdown.com은 그의 가장 대표적인 작업 결과 중 하나다. 기술 초보자들을 교육하면서 자신의 사업을 실행 중이며, 현재는 UAE의 가장 큰 수영 아카데미인 해밀톤 아쿠어틱스(Hamilton Aquatics)의 소프트웨어 아키텍트로서 일하고 있다.

리카르도 쎄아(Ricardo Zea)
콜롬비아의 메델린 출신이며, 현재 미국 오하이오에 소재한 기업인 데이턴(Dayton)의 열정적이면서 훌륭한 풀스택 디자이너로 일하고 있다. 항상 기술을 향상할 방법을 찾고 있으며 웹에서 어떠한 일을 할 수 있는지, 어떻게 일을 해야 하는지, 왜 해야 하는지 지속해서 생각하고 있다. 이러한 생각을 통해 기술적으로 뛰어난 디자이너가 됐으며, 복잡한 디자인과 웹 기술들을 다른 사람들이 쉽게 이해할 수 있도록 설명하는 능력을 갖추게 됐다.
광고홍보학 석사 학위를 가지고 있으며 사람들의 행동을 이해하는 데 조예가 깊다. 또한 열성적인 PC 게이머이기도 하다. 이러한 점을 통해 뇌의 창조적인 측면을 이성적인 측면으로 쉽게 전환하게 됐고, 기술적으로 견고한 웹과 모바일 디자인을 반응적이며 잘 동작할 수 있도록 가시화하고 만들 수 있게 됐다. 그리고 디자인을 통해 적절한 메시지를 전달할 수 있게 됐다.
팩트출판사가 펴낸 『반응형 웹 디자인 마스터링(Mastering Responsive Web Design)』의 저자이기도 하고, 코드펜 데이턴(CodePen Dayton) 그룹의 운영자다. 또한 데이턴 웹 개발자와 UX 데이턴 그룹의 일원이며, 사이트포인트(SitePoint) 앰버서더(Ambassador) 프로그램의 첫 번째 멤버 중 하나이기도 하다. 월간 「웹 디자인」과 개발자 뉴스레터 *레벨 업!*의 저자다. 그리고 팩트출판사의 『Sass and Compass』, 『Designers Cookbook』, 『Sass Essentials』의 테크니컬 감수자다. 지난 몇 년 동안 콜롬비아의 여러 대학에서 플래시와 코렐드로우(CorelDRAW) 교수로서 활약했다. 15년 동안 웹 디자인 경험을 쌓았으며, 20년간 비주얼과 그래픽 디자인 분야에 몸담았다.
테크 트랜스 그룹 T4
최신 IT 테크놀로지에 대한 리서치를 목적으로 하는 컨설팅 그룹이다. 엔터프라이즈 환경에서 오픈소스를 활용해 프레임워크를 구축하는 데 관심이 많으며, 최근에는 하이브리드 환경에서의 HTML5, MariaDB, 스프링(Spring), Node.js, React.js, Underscore.js 등 웹 전반에 걸친 기술과 빅데이터 흐름에 주목하고 있다. 또한 오픈소스 기반 모바일 데이터베이스와 관련해 컨설팅을 수행하며, 자바스크립트를 기반으로 하는 서버 구축에서 많은 경험을 쌓고 있다.