Make you a better developer
더 나은 프런트엔드 웹 개발자가 되기 위한 필독서

HTML, CSS, 자바스크립트를 배웠다고 해서 효율적인 웹을 개발할 수 있는 것은 아니다. 더 나은, 더 실력 있는 웹 개발자라면 사용자를 끌어들일 수 있도록 검색 엔진에 잘 읽히는 웹을 개발해야 한다. 그리고 다양한 기기 환경에 최적화된 웹, 쉽고 빠르며 필요한 콘텐츠를 우선으로 제공하는 웹을 개발해야 한다. 이 책은 이러한 웹을 개발하는 데 반드시 알아야 할 실무 기술과 노하우를 제시하여 더 나은 개발자가 되도록 돕는다.

★이 책의 주요 내용
● 프런트엔드 웹 개발 라이프 사이클
● 다양한 기기 환경에 최적화된 웹사이트 구축
● 사용자 중심 웹 개발 실무 예시
● 사용자를 유입시키는 검색 엔진 최적화
● 유지 보수 및 관리가 쉬운 설계 기법
● 노코드·로우코드 솔루션 활용 방법
● 더 나은 웹 개발자가 되기 위해 필요한 인사이트

★대상 독자
● HTML, CSS, 자바스크립트를 포함한 기본적인 웹 개발 지식을 갖춘 개발자
● 웹 개발 스킬을 향상하고자 하는 개발자

추천사
● 기획, 디자인, 개발 어느 한쪽으로 치우침 없이 다루려는 저자의 노력이 돋보이고, '더 나은 웹페이지 만들기' 특명을 완주하겠다는 단호함이 책 곳곳에 나타난다. 웹을 잘 알고 있다고 생각했던 독자라도 책에서 안내하는 실무 테크닉과 저자의 풍부한 경험이 절대 가볍지 않다고 느낄 것이다. 이제 막 웹 개발을 시작하는 독자에게는 벅찰 수 있지만, 더 나은 웹 개발자가 되기 위한 초석을 다지고 싶다면 이 책으로 웹 개발 시 치열하게 고민하는 방법을 배우길 바란다.
- 복종순 (데브옵스 엔지니어)

● 프런트엔드 개발 기본 지식은 있지만 더 깊이 있는 개발자가 되고 싶은 분에게 이 책을 추천한다. HTML, CSS, 자바스크립트 영역별로 ‘더’ 알면 좋은 깊이 있는 내용이 담겨 있다. 특히 신규 개발을 위한 정보 수집부터 운영까지의 웹 개발 라이프 사이클을 설명하는 2장은 개발자가 전체적인 프로젝트 진행 흐름과 다른 파트의 업무를 이해하고, 이를 활용하여 효율적으로 협업하는 데 많은 도움이 된다.
- 원종필 (프런트엔드 개발자)

● 이 책은 전공 공부나 선배들의 조언만으로는 얻을 수 없는 내용을 담고 있다. 직접 부딪히며 경험해야 알 수 있는 실무 지식과 실사용자를 위한 고려사항까지 웹 개발에 대한 모든 것을 다룬다. 이 책을 읽고 중구난방으로 흩어져 있던 지식이 차곡차곡 정리되었다. 주니어 개발자에게 이 책을 추천한다.
- 이경진 (웹 개발자)

● 이 책은 프런트엔드 환경에서 어떤 프로세스로 개발하는지, 어떤 원리와 원칙으로 서비스가 완성되는지 명쾌하게 안내한다. 더 나아가 단순히 동작하는 웹 서비스가 아니라, 사용자 경험을 고려한 설계로 ‘친절한 웹’의 초석을 다지는 방향을 예시와 함께 제시한다. 더 나은 프런트엔드 웹 개발자로 성장하고 싶다면 이 책과 함께하는 것을 강력히 추천한다.
- 이종원 (시스템 엔지니어)

● 웹 애플리케이션 개발 전후에 반드시 진행하는 실무 프로세스와 HTML, CSS, 자바스크립트, 타입스크립트를 활용하기 위한 필수 지식이 담겨 있다. 또한 사용자 중심의 웹 개발 방법뿐만 아니라 사용자와 서비스를 연결해주는 전 과정을 구현하는 방법을 안내한다. 마지막으로 인공지능 시대의 개발자에게는 서비스 관점에서 사용자를 이해하고 비즈니스의 핵심 기술을 파악하는 능력이 필요한데, 이를 위한 인사이트도 얻을 수 있다.
- 최낙현 (프런트엔드 개발자)

1장 웹은 어디에나 있다

1.1 웹은 어떤 모양을 가지고 있을까?
1.2 문서 공유를 위해 탄생한 HTML
1.3 브라우저를 탑재한 기기의 종류

2장 웹 개발을 위한 라이프 사이클

2.1 웹 개발 라이프 사이클
2.2 개발 전에 이루어지는 것
2.3 개발 후에 이루어지는 것

3장 더 나은 HTML 개발

3.1 HTML은 무엇인가?
3.2 잘 읽히는 웹과 그렇지 못한 웹
3.3 브라우저 렌더링 최적화
3.4 웹 리소스 최적화
3.5 웹 요소 최적화
3.6 웹 이미지 최적화
3.7 웹 비디오와 오디오 최적화
3.8 웹 공유 최적화
3.9 웹 검색 최적화

4장 더 나은 CSS 개발

4.1 CSS는 무엇인가?
4.2 W3C 표준화 제정 단계
4.3 CSS 선택자
4.4 CSS 박스 모델과 요소 크기
4.5 레이아웃을 만들기 위한 CSS
4.6 반응형 웹
4.7 사용자 지정 CSS 속성 사용하기
4.8 공간 시스템 디자인
4.9 CSS 네이밍 컨벤션

5장 더 나은 자바스크립트 개발

5.1 바닐라 자바스크립트
5.2 ES2015~ES2022 최신 구문
5.3 64비트 부동소수점
5.4 자바스크립트 메모리 관리
5.5 코딩 컨벤션
5.6 쿠키와 개인정보보호법
5.7 프로토타입 이해
5.8 Proxy 객체로 구현하는 최신 프런트엔드 프레임워크
5.9 HTTP 응답 상태 코드
5.10 Node.js: 브라우저 밖의 자바스크립트

6장 타입스크립트: 자바스크립트에 타입을 더하다

6.1 타입스크립트를 사용해야 하는 이유
6.2 타입스크립트 사용하기
6.3 타입스크립트의 타입
6.4 인터페이스
6.5 컴파일 설정

7장 사용자 기기에 따른 고려사항

7.1 데스크톱에서의 웹
7.2 모바일에서의 웹
7.3 키오스크에서의 웹
7.4 모빌리티 서비스에서의 웹

8장 더 나은 웹 개발자 되기

8.1 노코드와 로우코드가 개발자를 대체할까?
8.2 인공지능 시대 개발자에게 필요한 역량

9장 개발 환경 구성

9.1 비주얼 스튜디오 코드 설치
9.2 Node.js 설치
9.3 유용한 비주얼 스튜디오 코드 확장 프로그램 설치