MEAN 스택, 서버와 클라이언트를 넘나드는 풀스택 엔지니어의 선택
MEAN은 서버와 클라이언트 양쪽을 모두 다루는 풀스택 엔지니어를 위한 기술이며, 한번 익혀두면 여러 상황에서 돌파구를 발견할 가능성을 높여준다. 그만큼 개발자의 경쟁력을 높일 수 있음을 의미한다. 스택의 모든 구성 요소가 자바스크립트를 사용하므로 진입 장벽이 낮고 팀 내 협업, 노하우 공유, 의사소통에 큰 도움을 준다.
이 책은 오랜 개발과 번역 경험을 두루 갖춘 베테랑 역자가 원서의 예제를 완결된 형태로 재구성해서 독자의 시간을 절약해주고 아쉬운 설명을 보강해 완성도를 높였다. 책의 흐름에 발맞춰 예제를 조금씩 확장해 나가다 보면 어느 순간 자신만의 멋진 풀스택 앱을 만들 수 있을 것이다.
- 지은이 : 애덤 브레츠, 콜린 J. 이릭
- 옮긴이 : 박재호
- ISBN : 978-89-6848-218-2 93000
- 발행일 : 2015년 9월 1일
- 페이지수 : 348
- 정가 : 28,000원
- 구매(예스24) : http://goo.gl/KNlRGg
『풀스택 개발자를 위한 MEAN 스택 입문』 - 미리보기
1. 풀스택개발자를위한MEAN스택입문애덤브레츠,콜린J.이릭지음
박재호옮김
웹 / 자바스크립트
정가 28,000원
스타트업을 위한 가장 확실한 선택,
MEAN 스택
지금은 스타트업 무한 경쟁 시대다. 살아남기 위해서는 누구보다 빠르게 자신의 아이디어
를 세상에 선보여야 하기에 클라이언트 개발자, 서버 개발자, DB 전문가가 각기 다른 언
어를 사용하던 기존 개발 방식으로는 경쟁에서 뒤처질 수밖에 없다.
그리하여 등장한 MEAN 스택은 이 모든 계층을 자바스크립트만으로 개발할 수 있게 해
준다. 가장 적은 노력으로 빠르게 제품을 완성해주는 MEAN 스택, 그 최신 개발 기법을
담은 이 책과 함께 지금 당장 꿈에 도전해보자!
•Node.js를 설치하고, Node.js 프로그래밍 모델의 핵심을 파악한다.
•Node.js로 MongoDB에서 데이터를 삽입, 검색, 갱신, 삭제한다.
•Express의 핵심 기술을 빠르게 익히고, 라우트와 미들웨어를 파악한다.
•데이터 결합, 지시자, 컨트롤러, 라우팅, 서비스와 같은 AngularJS의 핵심을 마스터한다.
•MEAN 스택만으로 완벽하게 작동하는 앱을 구축한다.
•원서보다 완벽하게 다듬은 예제 코드로 독자의 시간을 절약해준다.
MEAN은 서버와 클라이언트 양쪽을 모두 다루는 풀스택 엔지니어를 위한 기술이며, 한 번 익혀
두면 여러 가지 상황에서 돌파구를 발견할 가능성을 높여준다. 그만큼 개발자의 경쟁력을 높일
수 있음을 의미한다. 모든 구성 요소가 자바스크립트를 사용하므로, 자바스크립트만 어느 정도
이해하고 있다면 이를 지렛대로 활용해서 진도를 빨리 뽑을 수 있다. 이게 바로 기존 다른 스택
과 비교한 MEAN의 가장 큰 특장점이다. - 박재호, 엑셈 CTO
예제 소스 : http://www.hanbit.co.kr/exam/2218
관련 도서
몽고디비
완벽 가이드
(개정2판)
클라이언트
-서버 웹 앱
만들기
하이브리드
앱을 구현하는
기술
애덤 브레츠, 콜린 J. 이릭 지음
박재호 옮김
Node.js
풀 스 택 개 발 자 를 위 한
MEAN
스택 입문
체계적으로 배우는
MongoDB, Express, AngularJS,
Node.js
2. www.hanbit.co.kr
이것이
프로그래밍이다!
이것이 안드로이드다
진정한 안드로이드 개발자로
이끌어줍니다.
SDK 5.0 롤리팝 호환!
책만 보고,
동영상 강좌로도 만족하지 못했다면 Daum
카페 '슈퍼드로이드'에서 만나요
cafe.daum.net/superdroid
박성근 저 | 1,164쪽 | 45,000원
이것이 C언어다
세상에 없던 새로운
C언어 입문서 탄생!
삼성, LG에서 펼쳐졌던
전설의 명강의를 풀타임 동영상 강좌로!
이보다 더 확실한 방법은 없다, 칠판강의
전체 동영상 강좌 유투브 전격 공개!
http://goo.gl/tJK3Tu
서현우 저 | 708쪽 | 25,000원
이것이 자바다
가장 중요한 프로그래밍 언어를 하나
배워야 한다면, 결론은 자바다!
중급 개발자로 나아가기 위한 람다식,
JavaFX, NIO 수록
자바의 모든 것을 알려주는 인터넷 강의
궁금한 것은 카페에서!
cafe.naver.com/thisisjava
신용권 저 | 1,224쪽 | 30,000원
저자직강동영상 제공!
3. 모던 웹을 위한
JavaScript +
jQuery 입문
www.hanbit.co.kr
지금은
모던 웹 시대!
HTML5 분야 부동의 1위 도서
HTML5 표준안 확정에 맞춘 완전 개정판의 귀환!
HTML5 권고안과 최신 웹 브라우저 환경 대응
윤인성 저 | 624쪽 | 30,000원
모던 웹 디자인을 위한
HTML5 +
CSS3 입문
자바스크립트에서 제이쿼리, 제이쿼리 모바일까지
한 권으로 끝낸다!
시대의 흐름에 맞춰 다시 쓴 자바스크립트 교과서
윤인성 저 | 980쪽 | 32,000원
페이스북, 월마트, 링크드인은 왜
Node.js를 선택했는가?
이 물음에 대한 답은 Node.js가 보여주는 빠른 처리 능력 때문이다.
윤인성 저 | 484쪽 | 25,000원
모던 웹을 위한
Node.js
프로그래밍
필요한 것만 배워
바로 현장에서 쓰는 HTML5
순서대로 읽으며 실습할 수 있는 HTML5 자습서
김상형 저 | 700쪽 | 32,000원
HTML5 +
CSS3 정복
4.
5. 애덤 브레츠, 콜린 J. 이릭 지음 박재호 옮김
MEAN 스택 입문
풀 스 택 개 발 자 를 위 한
7. 애덤 브레츠, 콜린 J. 이릭 지음 박재호 옮김
풀 스 택 개 발 자 를 위 한
MEAN
스택 입문
8. 엄마와 아빠에게,
일곱 살 때 닌텐도를,
열 살 때 컴퓨터를 사주셔서 감사합니다.
- 애덤
이 책을 부인 엘레이나와
아들 CJ와 카터,
엄마에게 바칩니다.
당신들을 아주 사랑합니다!
- 콜린
9. 5
벌써 MEAN 관련 서적을 세 권째 번역하게 되었다. 요즘과 같이 기술 변화가 급격하게 이뤄지
는 상황에서 특정 분야에 대한 책이 지속적으로 나온다는 사실은 시사하는 바가 크다. 기술서의
경우에는 집필하는 사람 역시 개발자이므로 개발자의 마음을 끄는 뭔가 비밀이 숨어있음을 암
시하기 때문이다. MEAN은 서버와 클라이언트 양쪽을 모두 다루는 풀스택 엔지니어를 위한 기
술이며, 한 번 익혀두면 여러 가지 상황에서 돌파구를 발견할 가능성을 높여준다. 그만큼 개발
자의 경쟁력을 높일 수 있음을 의미한다. MEAN 스택으로 프로그램을 작성하려면 웹 관련 전
체 그림을 이해해야 하며 기술적으로도 알아야 하는 내용이 상대적으로 많다. 하지만 모든 구성
요소가 자바스크립트를 사용하므로, 자바스크립트만 어느 정도 이해하고 있다면 이를 지렛대로
활용해서 진도를 빨리 뽑을 수 있다. 이게 바로 기존 다른 스택과 비교한 MEAN의 가장 큰 특장
점으로 볼 수 있다.
MEAN은 노드에 큰 빚을 지고 있다. 구현부터 테스트와 배포에 이르기까지 기존 노드 생태계
를 그대로 활용할 수 있기 때문이다. 프로그래밍 언어별 패키지 저장소에 올라온 모듈 수를 통계
로 정리한 http://www.modulecounts.com/에 따르면 노드의 npm으로 제공되는 모듈이
이미 17만 5천 개를 넘어서 여느 경쟁자가 넘보지 못하는 수준에 이르렀음을 보여준다. 물론 모
든 모듈이 완벽하지는 않겠지만 어지간한 모듈은 이미 개발되어 있기 때문에 출발점으로 삼을
만한 기댈 언덕이 많다. 따라서 이 책은 1부에서 기본이 되는 노드를 충분히 설명한 다음에 2부
몽고디비, 3부 익스프레스, 4부 앵귤러까지 MEAN의 각 구성 요소를 설명하고, 마지막으로 5
부 개발 환경으로 넘어간다. 중간 중간에 MEAN의 구성 요소는 아니지만 대안으로 사용 가능
한 몇 가지 기술(예를 들면 NoSQL 계열 대신 관계형 DBMS를 사용할 경우 유용한 MySQL
모듈, 익스프레스 대안으로 급성장 중인 하피)도 소개하므로 다른 MEAN 서적과 비교해서 조
금 색다른 느낌이 올 것이다.
이 책은 MEAN 기술을 활용해서 HR 앱이라는 직원 관리용 애플리케이션의 기능을 하나씩 완
성해나가는 방법을 사용하므로, 무작위로 관심 있는 부분을 읽는 방법 대신 순서대로 읽는 방
법을 권장한다. 실행하기 어려운 코드 조각 상태로 제공되는 원서 예제를 재구성해서 한국어판
옮긴이의 말
10. 6
예제는 독자 여러분의 시간을 절약하기 위해 빌드와 실행을 최대한 고려한 완결된 상태로 제공
되므로 예제 코드를 참조하면서 책을 읽으면 더욱 이해가 쉬울 것이다. 이 책에서 소개한 예제
를 조금씩 확장해 나가다 보면 어느 순간 자신만의 멋진 HR 앱을 만들 수 있을 것이다. 독자 여
러분의 행운을 빈다!
박재호
옮긴이 박재호 jrogue@gmail.com
포항공과대학교 컴퓨터공학과 학부와 대학원을 졸업했다. 블로그 ‘컴퓨터 vs 책’(jhrogue.blogspot.com)을 운영하고 있다.
『English for Developers』, 『Blog2Book, 열씨미와 게을러의 리눅스 개발 노하우 탐험기』, 『IT EXPERT, 임베디드 리눅스』(이
상 한빛미디어)를 저술했고, 『리눅스 시스템 프로그래밍(1판)』, 『The Art of Project Management』, 『리눅스 디바이스 드라이
버(개정3판)』, 『임베디드 하드웨어 이해와 설계』, 『Rapid Development』(이상 한빛미디어), 『피플 웨어』, 『클린 코드』(이상 인사이
트), 『조엘 온 소프트웨어』(에이콘) 등을 번역했다.
11. 7
현대적인 도구를 사용하면 자바스크립트, HTML, CSS만으로도 상용 수준의 앱을 만들 수 있
다. 자바스크립트 기술을 기반으로 하는 몽고디비MongoDB, 익스프레스Express, 앵귤러AngularJS, 노
드Node.js의 조합은 너무나 인기가 있어서 MEAN 스택으로 불리고 있다. 이 책에서는 이러한
MEAN 스택을 자세히 탐험할 것이다.
이 책은 모든 서버 쪽 작업의 토대가 되는 노드에 관한 설명부터 시작한다. 개인 컴퓨터에서 노
드를 구동하는 방법과 노드의 패키지 관리자인 npm을 사용해서 모듈을 내려받는 방법을 설명
한다. 노드 프로그래밍 모델의 핵심적인 측면 또한 설명할 것이다.
그 다음에는 NoSQL 데이터베이스인 몽고디비로 이동할 것이다. 노드 앱에서 몽고디비를 활
용하는 방법과 몽고디비에서 데이터를 생성, 검색, 갱신, 삭제하는 방법을 설명할 것이다.
노드와 몽고디비를 제대로 이해하고 나면 익스프레스 웹 서버로 이동할 것이다. 라우팅이나 미
들웨어와 같은 익스프레스 앱의 기초를 소개한다. 직전에 설명한 내용을 토대로 노드, 몽고디
비, 익스프레스의 통합 방법을 설명할 것이다.
다음으로 앵귤러를 설명한다. 데이터 바인딩, 지시자, 컨트롤러, 라우팅, 서비스와 같은 앵귤러
기본 원리를 자세히 소개한다.
마지막으로 MEAN 앱의 디버깅과 테스트 방법을 설명하며 이 책을 마무리한다.
MEAN 스택은 풀스택 자바스크립트를 총망라하지는 않는다. 배워야 할 자바스크립트 도구의
전체 생태계가 존재하며, 이 책에서는 그중에서도 몇 가지만 소개한다. 걸프Gulp와 그런트Grunt
와 같은 작업 실행기를 소개한다. 두 도구는 따분하고 반복적인 작업을 자동화하는 데 큰 도움
을 준다. 또한 코드 품질 개선에 사용되는 린트 도구인 JSHint도 살펴본다. 이런 과정을 밟으
면서 MEAN 스택을 사용해서 인적 자원human resource (HR) 앱을 처음부터 개발해본다.
이 책에 대하여
12. 8
대상 독자
이 책은 중급 수준의 웹 디자이너와 개발자에게 적합하다. HTML, CSS, 자바스크립트에 대한
경험이 있다고 가정한다.
보충 자료
● 다음은 이 책의 웹사이트다. 여기에는 링크, 추가 내용, 참고 자료 등이 포함되어 있다.
http://www.learnable.com/books/mean1/
● 이 책의 코드는 다음 주소에서 내려받을 수 있다.
http://www.hanbit.co.kr/exam/2218
13. 9
옮긴이의 말 ��������������������������������������������������������������������������������������������������������������������
5
이 책에 대하여 ����������������������������������������������������������������������������������������������������������������
7
CHAPTER 1 MEAN 스택, 자바스크립트의 거침없는 질주
1.1 풀스택 자바스크립트의 등장 ������������������������������������������������������������������������������������������
22
1.1.1 노드 ��������������������������������������������������������������������������������������������������������������
23
1.1.2 노드 생태계 ����������������������������������������������������������������������������������������������������
24
1.1.3 몽고디비 ��������������������������������������������������������������������������������������������������������
25
1.1.4 앵귤러 �����������������������������������������������������������������������������������������������������������
26
1.2 마치며 ����������������������������������������������������������������������������������������������������������������������
28
CHAPTER 2 노드란
2.1 자바스크립트의 친숙함 �������������������������������������������������������������������������������������������������
33
2.2 I/O 문제 ��������������������������������������������������������������������������������������������������������������������
35
2.2.1 웹 서버 예 ������������������������������������������������������������������������������������������������������
36
2.2.2 I/O 문제에서 벗어나기 ��������������������������������������������������������������������������������������
37
2.2.3 실세계 데이터 �������������������������������������������������������������������������������������������������
38
2.3 첫 노드 서버 ��������������������������������������������������������������������������������������������������������������
40
2.3.1 노드 설치 �������������������������������������������������������������������������������������������������������
40
2.3.2 REPL �����������������������������������������������������������������������������������������������������������
40
2.3.3 서버 작성 �������������������������������������������������������������������������������������������������������
41
CONTENTS
Node.jsPart I
14. 10
2.3.4 서버 동작 �������������������������������������������������������������������������������������������������������
43
2.4 마치며 ����������������������������������������������������������������������������������������������������������������������
44
CHAPTER 3 모듈과 노드 패키지 관리자
3.1 노드 패키지 관리자 ������������������������������������������������������������������������������������������������������
46
3.1.1 npm install 명령 ���������������������������������������������������������������������������������������������
46
3.1.2 npm search 명령 �������������������������������������������������������������������������������������������
48
3.2 package.json �����������������������������������������������������������������������������������������������������������
49
3.3 node_modules 디렉터리 ��������������������������������������������������������������������������������������������
51
3.3.1 모듈 의존성 ����������������������������������������������������������������������������������������������������
52
3.4 require( ) ������������������������������������������������������������������������������������������������������������������
53
3.4.1 require( )의 다른 용법 ��������������������������������������������������������������������������������������
55
3.5 모듈 작성 ������������������������������������������������������������������������������������������������������������������
55
3.5.1 모듈 기능 �������������������������������������������������������������������������������������������������������
56
3.5.2 캐시 ��������������������������������������������������������������������������������������������������������������
58
3.5.3 npm link 명령 ������������������������������������������������������������������������������������������������
60
3.6 마치며 ����������������������������������������������������������������������������������������������������������������������
61
CHAPTER 4 노드 프로그래밍 모델
4.1 이벤트 루프 ���������������������������������������������������������������������������������������������������������������
63
4.1.1 동시성 착각 ����������������������������������������������������������������������������������������������������
65
4.2 비동기식 코딩 ������������������������������������������������������������������������������������������������������������
66
4.3 콜백 함수 ������������������������������������������������������������������������������������������������������������������
66
4.3.1 호출 관례 �������������������������������������������������������������������������������������������������������
67
4.3.2 예외 처리 �������������������������������������������������������������������������������������������������������
68
CONTENTS
15. 11
4.3.3 콜백 지옥 �������������������������������������������������������������������������������������������������������
69
4.4 이벤트 전송자 ������������������������������������������������������������������������������������������������������������
71
4.4.1 EventEmitter 확장 ������������������������������������������������������������������������������������������
72
4.5 이벤트 듣기 ���������������������������������������������������������������������������������������������������������������
73
4.6 예외 처리 ������������������������������������������������������������������������������������������������������������������
75
4.6.1 uncaughtException 이벤트 ����������������������������������������������������������������������������
76
4.7 프라미스 �������������������������������������������������������������������������������������������������������������������
76
4.7.1 프라미스 연쇄 �������������������������������������������������������������������������������������������������
79
4.8 마치며 ����������������������������������������������������������������������������������������������������������������������
80
CHAPTER 5 핵심 모듈
5.1 명령행 인자 ���������������������������������������������������������������������������������������������������������������
81
5.2 파일시스템 작업 ����������������������������������������������������������������������������������������������������������
82
5.2.1 __filename과 __dirname ��������������������������������������������������������������������������������
82
5.3 현재 작업 디렉터리 ������������������������������������������������������������������������������������������������������
83
5.3.1 파일 읽기 �������������������������������������������������������������������������������������������������������
84
5.3.2 파일 쓰기 �������������������������������������������������������������������������������������������������������
85
5.4 스트림 ����������������������������������������������������������������������������������������������������������������������
86
5.4.1 읽기 가능 스트림 ���������������������������������������������������������������������������������������������
87
5.4.2 쓰기 가능 스트림 ���������������������������������������������������������������������������������������������
88
5.4.3 표준 스트림 ����������������������������������������������������������������������������������������������������
89
5.5 웹 프로그래밍 ������������������������������������������������������������������������������������������������������������
90
5.5.1 서버 생성 �������������������������������������������������������������������������������������������������������
90
5.5.2 라우트 �����������������������������������������������������������������������������������������������������������
92
5.5.3 요청 헤더 접근하기 ������������������������������������������������������������������������������������������
93
5.6 마치며 ����������������������������������������������������������������������������������������������������������������������
93
16. 12
CHAPTER 6 노드 서버 구축하기
6.1 서버 계획 ������������������������������������������������������������������������������������������������������������������
95
6.2 앱 구조 잡기 ��������������������������������������������������������������������������������������������������������������
96
6.3 작업 착수 ������������������������������������������������������������������������������������������������������������������
96
6.4 라우팅 ����������������������������������������������������������������������������������������������������������������������
98
6.5 데이터베이스 모듈 �������������������������������������������������������������������������������������������������������
99
6.6 데이터베이스에 질의하기 ��������������������������������������������������������������������������������������������
102
6.7 응답 생성기 �������������������������������������������������������������������������������������������������������������
103
6.8 통합하기 �����������������������������������������������������������������������������������������������������������������
106
6.9 마치며 ��������������������������������������������������������������������������������������������������������������������
109
CHAPTER 7 몽고디비란
7.1 NoSQL 데이터베이스 �����������������������������������������������������������������������������������������������
113
7.2 몽고디비 역사 ����������������������������������������������������������������������������������������������������������
114
7.3 개인용 컴퓨터에 몽고디비 설치하기 ������������������������������������������������������������������������������
114
7.4 클라우드 호스트 ��������������������������������������������������������������������������������������������������������
115
7.4.1 허로쿠 통합 ��������������������������������������������������������������������������������������������������
116
7.5 몽고디비 셸 �������������������������������������������������������������������������������������������������������������
117
7.5.1 새로운 데이터 삽입 ����������������������������������������������������������������������������������������
119
7.5.2 데이터 검색 ��������������������������������������������������������������������������������������������������
120
7.5.3 데이터 갱신 ��������������������������������������������������������������������������������������������������
122
7.5.4 데이터 삭제 ��������������������������������������������������������������������������������������������������
123
MongoDBPart II
CONTENTS
17. 13
7.5.5 컬렉션 삭제 ��������������������������������������������������������������������������������������������������
123
7.5.6 데이터베이스 삭제 �����������������������������������������������������������������������������������������
124
7.6 마치며 ��������������������������������������������������������������������������������������������������������������������
125
CHAPTER 8 몽구스로 몽고디비 쉽게 다루기
8.1 몽구스 노드 모듈 �������������������������������������������������������������������������������������������������������
128
8.1.1 스키마 ���������������������������������������������������������������������������������������������������������
128
8.1.2 몽구스 스키마 예제 ����������������������������������������������������������������������������������������
130
8.1.3 몽구스 모델 ��������������������������������������������������������������������������������������������������
132
8.1.4 더 많은 문서 생성 ������������������������������������������������������������������������������������������
134
8.1.5 단순 질의 �����������������������������������������������������������������������������������������������������
138
8.1.6 갱신 ������������������������������������������������������������������������������������������������������������
140
8.2 마치며 ��������������������������������������������������������������������������������������������������������������������
141
CHAPTER 9 예제 앱에 몽고디비와 몽구스 접목하기
9.1 몽구스 모델 추가 �������������������������������������������������������������������������������������������������������
144
9.1.1 Employee 모델 ��������������������������������������������������������������������������������������������
145
9.1.2 Team 모델 ���������������������������������������������������������������������������������������������������
147
9.2 데이터베이스 채워 넣기 ����������������������������������������������������������������������������������������������
148
9.3 데이터베이스 접근 �����������������������������������������������������������������������������������������������������
156
9.4 마치며 ��������������������������������������������������������������������������������������������������������������������
157
18. 14
CHAPTER 10 SQL, 몽고디비의 대안
10.1 관계형 데이터베이스와 SQL �������������������������������������������������������������������������������������
159
10.2 mysql 모듈 ������������������������������������������������������������������������������������������������������������
163
10.3 데이터베이스 연결 ���������������������������������������������������������������������������������������������������
163
10.3.1 연결 풀 ������������������������������������������������������������������������������������������������������
165
10.4 연결 닫기 ���������������������������������������������������������������������������������������������������������������
166
10.5 질의 수행 ���������������������������������������������������������������������������������������������������������������
167
10.6 마치며 �������������������������������������������������������������������������������������������������������������������
170
CHAPTER 11 익스프레스란
11.1 익스프레스의 구성 요소 ��������������������������������������������������������������������������������������������
175
11.1.1 라우터 ������������������������������������������������������������������������������������������������������
175
11.1.2 미들웨어 ����������������������������������������������������������������������������������������������������
177
11.1.3 라우트 ������������������������������������������������������������������������������������������������������
178
11.2 하나로 합치기 ���������������������������������������������������������������������������������������������������������
181
11.3 익스프레스 앱 생성 ��������������������������������������������������������������������������������������������������
184
11.3.1 제이드 ������������������������������������������������������������������������������������������������������
185
11.4 마치며 �������������������������������������������������������������������������������������������������������������������
185
ExpressPart III
CONTENTS
19. 15
CHAPTER 12 익스프레스 앱 아키텍처
12.1 준비 ����������������������������������������������������������������������������������������������������������������������
187
12.2 서버 시작 ���������������������������������������������������������������������������������������������������������������
188
12.3 app.js �������������������������������������������������������������������������������������������������������������������
188
12.3.1 app.use ���������������������������������������������������������������������������������������������������
188
12.3.2 cookieParser �������������������������������������������������������������������������������������������
190
12.3.3 정적 파일 다시 살펴보기 �������������������������������������������������������������������������������
191
12.3.4 오류 처리 ���������������������������������������������������������������������������������������������������
191
12.3.5 app.set ����������������������������������������������������������������������������������������������������
194
12.4 Router 객체 �����������������������������������������������������������������������������������������������������������
194
12.4.1 Router 객체 사용 ���������������������������������������������������������������������������������������
195
12.5 연습 ����������������������������������������������������������������������������������������������������������������������
196
12.5.1 데이터베이스 상호작용 흉내 내기 �������������������������������������������������������������������
197
12.5.2 HTML 생성 �����������������������������������������������������������������������������������������������
197
12.6 마치며 �������������������������������������������������������������������������������������������������������������������
200
CHAPTER 13 예제 앱에 익스프레스 접목하기
13.1 package.json 갱신 �������������������������������������������������������������������������������������������������
201
13.2 npm start 스크립트 ������������������������������������������������������������������������������������������������
203
13.3 라우트 정의 ������������������������������������������������������������������������������������������������������������
204
13.3.1 직원 라우트 ������������������������������������������������������������������������������������������������
204
13.3.2 팀 라우트 ���������������������������������������������������������������������������������������������������
205
13.4 index.js 갱신 ����������������������������������������������������������������������������������������������������������
207
13.5 마치며 �������������������������������������������������������������������������������������������������������������������
210
20. 16
CHAPTER 14 하피, 익스프레스의 대안
14.1 하피란 �������������������������������������������������������������������������������������������������������������������
211
14.2 익스프레스와 비교 ���������������������������������������������������������������������������������������������������
212
14.2.1 라우트 구성 ������������������������������������������������������������������������������������������������
214
14.2.2 라우팅 ������������������������������������������������������������������������������������������������������
216
14.2.3 내장 기능 ���������������������������������������������������������������������������������������������������
216
14.2.4 이벤트 ������������������������������������������������������������������������������������������������������
217
14.2.5 플러그인 ����������������������������������������������������������������������������������������������������
218
14.3 마치며 �������������������������������������������������������������������������������������������������������������������
222
CHAPTER 15 앵귤러란
15.1 단일 페이지 앱 ��������������������������������������������������������������������������������������������������������
225
15.1.1 SPA 프레임워크 �����������������������������������������������������������������������������������������
227
15.2 모델-뷰-컨트롤러 아키텍처 ���������������������������������������������������������������������������������������
228
15.3 앵귤러 내려받기 ������������������������������������������������������������������������������������������������������
229
15.3.1 소스 코드에서 빌드하기 ��������������������������������������������������������������������������������
230
15.3.2 출시 ���������������������������������������������������������������������������������������������������������
231
15.4 앵귤러 “Hello World” ���������������������������������������������������������������������������������������������
232
15.5 마치며 �������������������������������������������������������������������������������������������������������������������
234
AngularJSPart IV
CONTENTS
21. 17
CHAPTER 16 데이터 바인딩
16.1 단방향 데이터 바인딩 �����������������������������������������������������������������������������������������������
235
16.2 양방향 데이터 바인딩 �����������������������������������������������������������������������������������������������
237
16.2.1 단순한 예제 ������������������������������������������������������������������������������������������������
238
16.3 기술적인 개괄 ���������������������������������������������������������������������������������������������������������
240
16.3.1 $watch ����������������������������������������������������������������������������������������������������
241
16.3.2 다이제스트 루프 ������������������������������������������������������������������������������������������
241
16.4 단순한 컨트롤러 ������������������������������������������������������������������������������������������������������
241
16.5 목록을 사용한 데이터 바인딩 �������������������������������������������������������������������������������������
243
16.6 마치며 �������������������������������������������������������������������������������������������������������������������
245
CHAPTER 17 앵귤러 지시자
17.1 지시자란 ����������������������������������������������������������������������������������������������������������������
247
17.1.1 일반적인 지시자를 사용하는 예제 �������������������������������������������������������������������
249
17.2 지시자 생성 ������������������������������������������������������������������������������������������������������������
250
17.2.1 사용자 정의 지시자 예제 �������������������������������������������������������������������������������
253
17.3 마치며 �������������������������������������������������������������������������������������������������������������������
254
CHAPTER 18 컨트롤러
18.1 구문 ����������������������������������������������������������������������������������������������������������������������
255
18.2 의존성 �������������������������������������������������������������������������������������������������������������������
257
18.3 예제 확장하기 ���������������������������������������������������������������������������������������������������������
258
18.3.1 익스프레스 통합 ������������������������������������������������������������������������������������������
258
22. 18
18.3.2 자바스크립트 ����������������������������������������������������������������������������������������������
260
18.3.3 HTML ������������������������������������������������������������������������������������������������������
262
18.4 단순한 서비스 ���������������������������������������������������������������������������������������������������������
263
18.4.1 EmployeeService 사용 ������������������������������������������������������������������������������
265
18.5 마치며 �������������������������������������������������������������������������������������������������������������������
266
CHAPTER 19 클라이언트 쪽 라우팅
19.1 ngRoute로 시작하기 �����������������������������������������������������������������������������������������������
268
19.2 앱 개괄 ������������������������������������������������������������������������������������������������������������������
268
19.3 코드 ����������������������������������������������������������������������������������������������������������������������
269
19.3.1 라우터 ������������������������������������������������������������������������������������������������������
270
19.3.2 서비스와 컨트롤러 ���������������������������������������������������������������������������������������
272
19.3.3 뷰 ������������������������������������������������������������������������������������������������������������
274
19.3.4 하나로 합치기 ���������������������������������������������������������������������������������������������
274
19.4 마치며 �������������������������������������������������������������������������������������������������������������������
276
CHAPTER 20 예제 앱에 앵귤러 접목하기
20.1 홈페이지 ����������������������������������������������������������������������������������������������������������������
278
20.1.1 CSS와 이미지 파일 �������������������������������������������������������������������������������������
279
20.2 app.js �������������������������������������������������������������������������������������������������������������������
281
20.3 템플릿 파일 ������������������������������������������������������������������������������������������������������������
287
20.3.1 팀과 직원 목록 뷰 ����������������������������������������������������������������������������������������
288
20.3.2 개별 팀 뷰 ��������������������������������������������������������������������������������������������������
289
20.3.3 개별 직원 뷰 �����������������������������������������������������������������������������������������������
290
20.4 마치며 �������������������������������������������������������������������������������������������������������������������
293
CONTENTS
23. 19
CHAPTER 21 작업 실행기
21.1 걸프란 �������������������������������������������������������������������������������������������������������������������
298
21.2 걸프 설정 ���������������������������������������������������������������������������������������������������������������
299
21.3 걸프 파일 설계 ��������������������������������������������������������������������������������������������������������
300
21.3.1 css 작업 ���������������������������������������������������������������������������������������������������
301
21.3.2 javascript 작업 ������������������������������������������������������������������������������������������
303
21.3.3 watch 작업 �����������������������������������������������������������������������������������������������
306
21.4 마치며 �������������������������������������������������������������������������������������������������������������������
307
CHAPTER 22 디버깅
22.1 debugger 문 ���������������������������������������������������������������������������������������������������������
309
22.1.1 크롬의 디버거 실행 ��������������������������������������������������������������������������������������
311
22.1.2 디버거 제어 ������������������������������������������������������������������������������������������������
312
22.1.3 변수 변경 ���������������������������������������������������������������������������������������������������
313
22.2 노드의 내장 디버거 ��������������������������������������������������������������������������������������������������
314
22.3 node-inspector ����������������������������������������������������������������������������������������������������
317
22.3.1 node-debug ��������������������������������������������������������������������������������������������
319
22.4 마치며 �������������������������������������������������������������������������������������������������������������������
320
개발 환경Part V
24. 20
CHAPTER 23 테스트
23.1 노드 테스트 ������������������������������������������������������������������������������������������������������������
322
23.1.1 테스트 정의 ������������������������������������������������������������������������������������������������
322
23.1.2 skip( )과 only( ) ������������������������������������������������������������������������������������������
325
23.1.3 테스트 훅 ���������������������������������������������������������������������������������������������������
326
23.1.4 단정 ���������������������������������������������������������������������������������������������������������
327
23.2 앵귤러 테스트 ���������������������������������������������������������������������������������������������������������
329
23.2.1 설정 ���������������������������������������������������������������������������������������������������������
331
23.2.2 테스트 코드 설정 �����������������������������������������������������������������������������������������
333
23.2.3 컨트롤러 테스트 ������������������������������������������������������������������������������������������
335
23.2.4 테스트 실행 ������������������������������������������������������������������������������������������������
337
23.2.5 다음 단계 ���������������������������������������������������������������������������������������������������
339
23.3 마치며 �������������������������������������������������������������������������������������������������������������������
339
찾아보기 ���������������������������������������������������������������������������������������������������������������������������
340
CONTENTS
25. 21
웹 프로그래밍을 제대로 이해하는 일은 여러 해가 걸리는 복잡한 작업이다. 이런 복잡성의 일부
는 정말 많은 동작 부분에서 기인한다. 효율적인 프로그래머가 되려면 최소한 네트워킹, 프로토
콜, 보안, 데이터베이스, 서버 쪽 개발, 클라이언트 쪽 개발을 포함해서 다양한 주제의 기초 지
식 정도는 이해하고 있어야 한다. 웹 프로그래머들은 오랫동안 다양한 프로그래밍 언어를 메들
리로 엮어서 개발을 진행해왔다.
클라이언트 쪽 프로그래밍만 보더라도 마크업을 위한 HTML, 스타일을 위한 CSS, 기능을 위한
자바스크립트를 알아야 한다. 프런트엔드 개발은 그 자체만으로도 복잡하지만, 대부분 ‘세 가지
큰’ 언어로 국한된다는 행운이 따랐다. 서버 쪽은 완전히 다른 이야기가 전개되고 있었다. 서버
는 자바, PHP, 펄, 그밖에 여러분이 상상하는 거의 모든 언어가 사용되었다. 또한 대다수 웹 앱
은 영속적인 데이터 저장소로 데이터베이스를 활용했다. 역사적으로 데이터베이스와 통신을 위
해 개발자들은 SQL도 이해해야 했다.
단순한 웹 앱 하나를 만들려고 해도 개발자들은 HTML, CSS, 자바스크립트, SQL, 그리고 서
버 쪽 언어까지 이해하고 있어야 한다. 더욱이 서버 쪽 앱이 단일 언어로 작성될 수 있을 것이라
는 보장도 없다. 낙관적으로 보더라도 최소한 다섯 가지 언어를 이해해야 앱을 만들 수 있다. 물
론 아직 클라이언트-서버 통신에 사용되는 데이터 교환 형식은 고려하지 않았다. Ajax의 x가
XML을 대표한다는 사실을 기억하자. 최근 많은 웹 앱이 XML에서 더욱 단순한 JSON으로 이
동해왔다. 하지만 이 역시 개발자들이 반드시 넘어야 하는 장벽일 뿐이다.
MEAN 스택,
자바스크립트의 거침없는 질주
CHAPTER 1
26. 22 1장 - MEAN 스택, 자바스크립트의 거침없는 질주
HTML, CSS, SQL은 엄격하게 말해 프로그래밍 언어는 아니지만, 각각에는 개발자들이 반드
시 알아야 하는 구문과 기묘한 특성이 존재한다. 다섯 가지 ‘언어’를 완전히 이해하고 언어 사이
를 끊임없이 전환하는 작업을 하다 보면 주눅이 들기 마련이다. 지금까지 이런 작업을 시도했다
면 한 번에 여러 구문을 섞어서 개발했을 가능성이 크다.
이런 상황은 개발자들을 프런트엔드 또는 백엔드 개발로 분리해서 다른 팀에 참여하게끔 하는
전문화를 이끌었다. 불행히도 이런 전문화가 프로젝트를 빠르게 완료하거나 품질을 높일 수 있
게 보증하지는 않는다. 실제로 개발팀의 분리는 결정을 오락가락하게 하고 논쟁을 일으켰으며,
프로젝트의 큰 그림을 보지 못하는 프로그래머를 양산해왔다. 그래서 전체 개발 스택을 가로지
르는 단일 언어에 대한 요구가 매우 명백해졌다. 다음 절에서는 자바스크립트가 다른 언어가 이
루지 못한 방식으로 풀스택full-stack 언어로 성장한 배경을 설명한다.
1.1 풀스택 자바스크립트의 등장
자바스크립트는 오랫동안 클라이언트 쪽 스크립트를 위한 업계 표준이 되어왔다. 자바스크립트
는 1995년 브랜든 아이크Brendan Eich가 모카Mocha라고 알려진 스크립트 언어를 열흘 만에 개발한
직후 혜성처럼 등장했다. 모카는 1995년 9월 넷스케이프 내비게이터와 함께 출시되었으며, 그
무렵 라이브스크립트LiveScript로 이름이 바뀌었다. 그리고 1995년 12월에 드디어 자바스크립트라
는 현재 이름으로 정착된다. 자바스크립트라는 이름이 선택된 이유는 넷스케이프가 그 당시 유행
이었던 썬의 자바 프로그래밍 언어에 편승하려 했기 때문이다.
초창기 브라우저 전쟁 동안, 마이크로소프트 인터넷 익스플로러와 넷스케이프 내비게이터는 조
금이라도 상대방을 더 앞지르기 위해 지속적으로 노력하고 있었다. 넷스케이프의 자바스크립트
에 대항하기 위해 마이크로소프트는 1996년 8월 인터넷 익스플로러 3.0에 JScript라는 독자적
인 구현을 탑재해서 출시했다. 1996년 11월, 자바스크립트는 ECMA 국제 표준화 단체에 제출
되었고, 1997년 6월에 ECMA-2621
로 표준화되었다.
1 http://www.ecma-international.org/publications/standards/Ecma-262.htm
27. 231장 - MEAN 스택, 자바스크립트의 거침없는 질주
당시의 자바스크립트는 성능이 떨어지며 아마추어 개발자만 사용하는 언어라는 평판을 얻었다.
아직 브라우저 업체들이 자바스크립트를 개선하기 위한 수년간의 시간, 노력, 비용을 투자하기
전의 이야기였다. 현대적인 자바스크립트 엔진은 과거의 어떤 자바스크립트 해석기도 비교 자체
가 불가능할 정도의 성능을 보일 만큼 엄청나게 최적화되었다. 클라이언트 쪽에서 가까운 미래
에 자바스크립트를 왕좌에서 몰아낼 (다트Dart와 같은) 경쟁 언어를 찾기란 쉽지 않다. 자바스
크립트는 모든 주요 브라우저가 지원하는 유일한 프로그래밍 언어이기 때문이다. 그리고 컴퓨팅
환경의 전반적인 개선과 함께, 자바스크립트는 범용 프로그래밍에도 적합한 언어가 되었다.
1.1.1 노드
2009년, 란 달Ryan Dahl은 확장 가능한 네트워크 앱 개발에 주로 사용되는 프레임워크인 노드Node.
js를 만들었다. 노드는 구글의 V8 자바스크립트 엔진2
과 조이엔트Joyent의 libuv3
라이브러리를
기반으로 만들어졌다. 노드는 자바스크립트를 서버 쪽 프로그래밍에서도 쓸 수 있는 대안으로
만들었다. 추가로 노드는 브라우저의 샌드박스 모델에 갇혀 이전에는 결코 달성하지 못했던 완
벽한 시스템 자바스크립트 API를 제공했다. 노드의 출현으로 자바스크립트 개발자도 파일시스
템에 접근하고, 네트워크 소켓을 열고, 자식 프로세스를 만들 수 있게 되었다.
노드의 가장 뛰어난 특징 중 하나는 많은 기능을 적은 코드에 빽빽하게 채우는 능력이다. 노드는
프로젝트 홈페이지에서 이런 특징을 과시하고 있다.4
다음은 노드 홈페이지에서 직접 가져온 코
드로, 겨우 여섯 줄로 간단한 웹 서버를 구현한다.
리스트 1-1 노드로 만든 간단한 웹 서버
var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('Hello Worldn');
}).listen(1337, '127.0.0.1');
console.log('Server running at http://127.0.0.1:1337/');
2 크롬 브라우저에 사용된 것과 같은 엔진. https://code.google.com/p/v8/
3 하위 플랫폼을 추상화한 비동기 I/O 라이브러리. https://github.com/joyent/libuv
4 http://www.nodejs.org
28. 24 1장 - MEAN 스택, 자바스크립트의 거침없는 질주
당장은 코드를 완벽하게 이해할 필요가 없으니 간단하게만 설명하겠다. 첫 줄의 require는
http 모듈을 불러온다. 이 모듈은 HTTP 클라이언트와 서버를 생성하는 기능을 제공한다. 다음
으로 서버가 시작되어 포트 1337을 열어두고, 연결을 요청받으면 ‘Hello World’라는 메시지로
응답한다. 마지막 줄은 간단한 콘솔 메시지를 출력하여 개발자에게 무슨 일이 일어났는지 알려
준다.
1.1.2 노드 생태계
노드가 서버 쪽 자바스크립트 구현을 위한 첫 번째 시도는 아니지만,5
현재까지 가장 성공한 제
품임은 확실하다. 기술의 인기도를 가늠하는 수단으로 특정 기술을 둘러싼 생태계의 크기를 측정
하는 방법이 있다. 노드는 월마트, 페이팔, 링크드인, 마이크로소프트와 같은 대기업에서 채택해
왔다. 심지어 스트롱루프, 노드소스, npm과 같은 완전히 새로운 회사도 등장하고 있다.
노드를 사용하는 회사 목록보다 더욱 인상 깊은 것은 노드용으로 개발된 외부 모듈이다. 노드
가 출현한 지 몇 년 안 되는 짧은 기간 동안 77,000개에 이르는 외부 모듈이 노드 패키지 관리
자인 npm에 올라왔다. 다양한 저장소에 존재하는 모듈 수를 추적하는 웹사이트인 모듈 카운츠
6
에 따르면 npm 저장소는 이 책 집필 시점에 매일 170개 정도의 모듈이 새로 추가되는 성장세
를 보이고 있다. 성장률 관점에서 가장 근접한 패키지 관리자는 PHP의 패키지스트Packagist로 하
루에 73개 정도의 모듈이 추가된다. 모듈 카운츠에서 가져온 [그림 1-1]은 노드 모듈 시스템의
성장을 다양한 언어의 패키지 관리자와 비교해서 보여준다.
5 http://en.wikipedia.org/wiki/Comparison_of_server-side_JavaScript_solutions
6 http://modulecounts.com/
29. 251장 - MEAN 스택, 자바스크립트의 거침없는 질주
그림 1-1 다양한 패키지 관리자의 성장 추세
npm(node.js)
Maven Central
(Java)
Rubygems.org
CPAN CPAN(search)
Packagist(PHP)
nuget(.NET)
Clojars(Clojure)
Hackage
(Haskell)
CRAN(R)
Pear(PHP)
PyPI
90000
80000
70000
60000
50000
40000
30000
20000
10000
0
2010년 7월 2011년 1월 2011년 7월 2012년 1월 2012년 7월 2013년 1월 2013년 7월 2014년 1월
사용 가능한 모듈이 워낙 많기 때문에, 개발자들이 겪는 일반적인 문제들의 경우에는 이를 해결
해주는 모듈을 최소 하나는 찾을 수 있다(물론 이런 모듈은 다양한 개발 단계에 있고, 상용 제
품에 쓰기에는 불완전한 모듈도 있을 것이다). 직전에 언급했듯이, 노드의 가장 큰 용도는 웹
서버 개발이다. 따라서 예상하듯이 웹 서버를 구현한 모듈 숫자가 엄청나게 많다. 그중에서 인기
가 가장 많은 익스프레스Express는 전 세계에 걸쳐 26,000개가 넘는 웹 앱을 지탱하고 있다.7
루
비의 시내트라Sinatra 프레임워크에 영향을 받은 익스프레스는 ‘빠르고, 독선적이지 않으며, 최소
화를 추구하는 노드용 웹 프레임워크’를 추구한다.8
익스프레스는 3부에서 자세히 살펴볼 예정
이다.
1.1.3 몽고디비
노드가 서버 영역을 침투하고 있을 때, 데이터베이스 세상에도 새로운 바람이 불고 있었다. 여
러 해 동안, 데이터 저장소를 다루는 주요 수단은 관계형 데이터베이스로 SQL 질의를 날리는
방법이었다. 하지만 SQL에 의존하지 않는 또 다른 데이터 저장소 유형이 있다. NoSQL로 알
7 http://expressjs.com/applications.html
8 http://expressjs.com/