추가 적립 안내

웹 애플리케이션 개발 세계의 첫 길잡이!

『웹 엔지니어의 교과서』는 웹 엔지니어가 알아야 할 생생한 프런트 엔드와 서버사이드 기술 안내서다. 웹 엔지니어로서 계속 일하려면 강점이 될 분야의 전문성과 다른 분야에 대한 폭넓은 시야가 필요하다. 이 책은 현업에서 많이 사용하는 프런트와 서버 쪽 기술을 이해하기 쉽게 정리했다. 책은 서버사이드, NoSQL, 프런트 엔드, 시각화, 로그 처리, 환경 구축 자동화와 같이 웹 개발자로서 알아야할 기술을 실습해보면서 이해할 수 있도록 구성했다.

신입 웹 엔지니어가 알아야 할 생생한 프런트 엔드와 서버사이드 기술 안내서!

이제는 풀 스택 엔지니어가 아니라도 웹 기술에 대한 폭넓은 시야가 필요하다 : 최근 풀 스택 엔지니어라는 말이 화제가 되고 있다. 이 말에 이견도 있겠지만 웹 엔지니어로서 계속 일하려면 강점이 될 분야의 전문성과 다른 분야에 대한 폭넓은 시야가 필요하다. 이 책은 현업에서 많이 사용하는 프런트와 서버 쪽 기술을 이해하기 쉽게 정리했다.

다양한 기술 중 현업에서 많이 사용하는 기술과 서비스를 다뤘다 : Ruby on Rails, PHP, NoSQL, 프런트 엔드 구현, 로그 처리, 데이터 시각화, 환경 구축 자동화 등 현업에서 많이 사용하는 기술을 다뤘으며, 손을 움직여 직접 실습할 수 있게 구성했다.

현업 웹 엔지니어가 신입사원이 꼭 알아두길 바라는 내용을 다뤘다 : 이 책에서 설명한 내용은 우리 회사의 신입사원이 꼭 알아두었으면 하는 관점에서 선정했다. 웹 엔지니어가 어떤 일을 하는지부터 프런트 엔드, 서버사이드 기술까지 골고루 담았으므로 신입사원 교육에도 사용할 수 있다.

1장 웹 엔지니어

SECTION 01 웹 엔지니어는 어떤 일을 할까
- 웹 엔지니어
- 웹 엔지니어가 하는 일
SECTION 02 필요한 기술 영역
- HTML
- CSS
- 프런트 엔드
- 서버사이드
- 데이터베이스
- 웹 서버
- AWS
- GitHub
SECTION 03 계속 새롭게 등장하는 기술
- NoSQL 데이터베이스
- JavaScript 프레임워크
- Fluentd
- 그래프로 시각화
- 가상화 기술
- 프로비저닝 도구
SECTION 04 앞으로도 웹 엔지니어로 살아가기

2장 Ruby on Rails로 개발

SECTION 05 Ruby의 개요
SECTION 06 Ruby on Rails의 등장
- Rails의 기본 이념
- RESTful 설계
SECTION 07 MVC(Model - View - Controller)
- 모델
- 뷰
- 컨트롤러
- Concerns 디렉터리
SECTION 08 Rails로 애플리케이션 개발
- Rails 개발 환경 준비
- Rails 다루기
- OAuth 인증 사용
- OAuth 인증 구현
- Gists 목록 가져오기
- 비동기 처리
SECTION 09 테스트하기
- 테스트 데이터의 통합 관리
- 시간 관련 테스트
- 목과 스텁 활용
SECTION 10 편리한 gem 소개
- Pry
- Better Errors
- MailCatcher
SECTION 11 gem을 찾는 방법
SECTION 12 정리

3장 PHP로 개발

SECTION 13 최근 PHP
SECTION 14 PHP 프레임워크
- 풀 스택 프레임워크
- 마이크로 프레임워크
SECTION 15 PHP 실행 환경 구축
- PHP 설치
- phpini 설정
SECTION 16 Composer 사용
- Composer 설치
SECTION 17 PSR 알아보기
SECTION 18 PHP 애플리케이션 개발 환경 구축
- 프로젝트 만들기
- API 만들기
SECTION 19 개발에 편리한 도구
- REPL
- 코딩 규칙 점검·분석
- 나머지 도구
SECTION 20 PHP 개발 환경, 에디터
SECTION 21 정리

4장 NoSQL 데이터베이스

SECTION 22 NoSQL 데이터베이스와 관계형 데이터베이스의 차이
- 관계형 데이터베이스의 특징
SECTION 23 Redis
- Redis를 사용하는 이유
- Redis 설치
- redis-cli 사용
- Ruby에서 Redis 사용
- 순위 정보 다루기
SECTION 24 MongoDB
- MongoDB를 사용하는 이유
- MongoDB 설치
- mongo 셸 사용
- Ruby로 MongoDB 사용
- 로그 기록
SECTION 25 정리

5장 프런트 엔드 구현

SECTION 26 프런트 엔드 개발
- jQuery 간단 사용법
- DOM 요소 가져오기
- jQuery 오브젝트
- CoffeeScript와 TypeScript 등장
SECTION 27 CoffeeScript
- 공식 사이트에서 CoffeeScript 맛보기
- CoffeeScript 도입
- CoffeeScript 사용
SECTION 28 TypeScript
- 공식 사이트에서 TypeScript 맛보기
- TypeScript 도입
- TypeScript 사용
SECTION 29 Grunt
- Grunt 도입
- Grunt로 처리 자동화
SECTION 30 JavaScript 프레임워크 등장
- DOM 변경에 약한 jQuery
- 대규모화된 프런트 엔드 개발
SECTION 31 AngularJS 특징
- HTML을 그대로 템플릿으로 사용
- 양방향 데이터 바인딩
- DI 컨테이너
SECTION 32 AngularJS 사용
- AngularJS의 도입
- AngularJS의 간단한 예
- DOM 조작
- 컨트롤러 사용
- TODO 리스트 구현
- 서버 통신
SECTION 33 서비스
- $location
- $timeout
- $cookieStore(ngCookies)
- 초기화 처리
SECTION 34 정리

6장 로그

SECTION 35 로그는 왜 중요한가
- 버그 조사
- 이상 징후 감지
- 가설 검증
- 감사 로그
SECTION 36 Fluentd 등장 배경
SECTION 37 Fluentd와 syslogd 차이
- 로그 수집 방법과 저장소 등 유연한 사용자화
- 로그에 태그를 붙여 쉽게 관리
- 다양한 언어를 지원하는 모듈 제공
SECTION 38 Fluentd 사용
- 입출력 플러그인
- Fluentd 도입
- Fluentd 구조
- Fluentd에 메시지 전송
- 로그 감시
- 로그를 다른 Fluentd 서버로 전송
- 호스트 이름 부여
- MongoDB에 저장
- Fluentd의 권장 구성
SECTION 39 로그 시각화
SECTION 40 엘라스틱서치
- 엘라스틱서치 도입
- 엘라스틱서치 사용
- Fluentd에서 엘라스틱서치로 데이터 전송
- 인덱스 삭제
SECTION 41 키바나
- 키바나 도입
- 키바나 사용
SECTION 42 정리

7장 데이터 시각화

SECTION 43 왜 구글 차트인가
SECTION 44 막대 그래프
- 유스케이스
- 예제 표시
- 그래프 사용자화
SECTION 45 누적 막대 그래프
- 유스케이스
- 예제 표시
- 그래프 사용자화
SECTION 46 꺾은선 그래프
- 유스케이스
- 예제 표시
- 그래프 사용자화
SECTION 47 산포도
- 유스케이스
- 예제 표시
- 그래프 사용자화
SECTION 48 외부 JSON 파일과 URL 읽기
- JSON 데이터 작성
- JSON 데이터 구조 확인
- JSON 파일로 HTML 파일 만들기
- 웹 브라우저에 HTML 파일 표시
SECTION 49 정리
- AWStats
- Webalizer
- 구글 웹 로그 분석
- New Relic
- Datadog
- Mackerel

8장 환경 구축 자동화

SECTION 50 수동 환경 구축의 위험성
- 새로운 서버 추가
- 서버에 라이브러리나 미들웨어 설치
- 간단한 개발 환경 구축
SECTION 51 Vagrant
- Vagrant 도입
- Vagrant로 가상 머신 실행
- 커맨드와 셸 스크립트 실행
- 여러 대의 가상 머신을 한 번에 실행
- 가상 머신에 ssh로 로그인
- Amazon EC2 인스턴스 실행
- 나머지 편리한 플러그인 소개
- Vagrant 가상화 이미지
SECTION 52 Ansible
- Ansible 도입
- 인벤토리 파일 준비
- 간단한 처리 실행
- playbook으로 복잡한 처리 실행
- 멱등성 확보
- 파일 끝 추가
- 나머지 편리한 모듈 소개
SECTION 53 Serverspec
- Serverspec 도입
- Serverspec 초기 설정
- 테스트 드리븐 프로비저닝
SECTION 54 Docker
- Docker 가상화 이미지
- Docker 도입
- Docker 테스트
- Dockerfile로 Docker 이미지 만들기
- Docker 이미지 공유
- Docker로 CI 테스트
SECTION 55 정리

9장 편리한 외부 서비스

SECTION 56 왜 외부 서비스를 이용할까
- 필요한 외부 서비스 찾기
- 도입할 때 주의할 점
SECTION 57 외부 서비스 소개
- Mixpanel - 액세스 분석 도구
- Slack - 커뮤니케이션 도구
- Qiita:Team - 정보 공유 서비스
- CircleCI - 지속적 인티그레이션 서비스
SECTION 58 정리

10장 웹 서버 구축

SECTION 59 아파치
- 아파치 웹 서버 설치
- 동작 환경 설정
- CGI 테스트
- 아파치에서 Rails 사용
SECTION 60 Nginx
- Nginx 설치
- PHP 스크립트 사용

책에서는 웹 서비스를 개발하는 엔지니어를 ‘웹 엔지니어’로 표현합니다. 프런트 엔드 개발의 대규모화, 서버사이드에서 새로운 기술 등장, 로그의 비대화, 가상 환경 구축 기술의 발전 등으로 웹 엔지니어가 담당하는 기술 영역은 매우 넓어졌습니다. 하지만 발전하는 기술에 신경이 쓰여도 프런트 엔드 엔지니어는 프런트 쪽 기술에만, 서버사이드 엔지니어는 서버 쪽 기술에만 눈길이 가기 십상인지라 그 외의 영역은 좀처럼 파악할 수 없는 것이 현실입니다.

최근 ‘풀 스택 엔지니어’라는 말이 화제가 되고 있습니다. 풀 스택 엔지니어란 인프라부터 미들웨어, 모바일, 디자인, 설계, 프로그래밍, 배포까지 무엇이든 잘할 수 있는 엔지니어를 의미합니다. 이 말에 이견을 달 수도 있겠지요. 하지만 웹 엔지니어로서 일을 계속할 것이라면, 강점인 분야에서 전문적인 능력과 다른 분야에 폭넓은 시야를 겸비한 T형 인재가 될 필요가 있습니다. 그렇지만 이런 정보는 좀처럼 정리되어 있지 않아서 따라잡는 데 시간이 걸립니다. 책에서는 웹 엔지니어가 알아야 할 기술을 다음처럼 구성했습니다.

1장 웹 엔지니어 | 2장 Ruby on Rails 개발 | 3장 PHP로 개발 | 4장 NoSQL 데이터베이스 |
5장 프런트 엔드 구현 | 6장 로그 | 7장 데이터 시각화 | 8장 환경 구축 자동화 |
9장 편리한 외부 서비스 | 10장 웹 서버 구축

NoSQL 데이터베이스, 프런트 엔드, 로그 처리, 시각화, 환경 구축 자동화 등 기술과 함께 편리한 외부 서비스도 소개합니다. 이름만 아는 기술과 실제로 테스트한 기술은 커다란 차이가 있습니다. 꼭 손을 움직여서 테스트해 보세요.

웹 엔지니어 세계에서는 계속 새로운 기술이 등장하므로 항상 공부해야 합니다. 처음에는 힘들겠지만, 조금씩 이해하다 보면 어느 순간 갑자기 재미있어지는 법입니다. 즐거움을 느끼는 경지까지 도달할 수 있도록 책이 다양한 기술 속으로 첫발을 내딛는 계기가 되기를 바랍니다.