평소 front-end 관련하여 이것 저것 공부하고 건드려보던 중 facebook에서 개발하여 사용중인 react를 알게 되었다.

react 관련한 따끈한 책이 출판 되었다는 것을 알고 바로 구매하여 읽어보았다.

react를 사용하기 위해 군더더기 없는 내용들로 구성이 되어 있어 좋았다.

특히 webpack이나 es2015 같이 react를 사용하기 위해 필수적이나 보조적인 성격의 항목들은 별도의 부록으로 분리하여 사전 학습을 할 수 있도록 해두어 좋았다.

webpack은 grunt나 gulp와는 별도로 react를 사용하기 위해 필수적인 요소로 여겨지는데 별도의 webpack 부록 항목을 따라하면 개발용 부터 production 용 까지 webpack 구성을 할 수 있게 된다.

현재 개인적으로 grunt와 gulp를 build 도구로 사용하고 있는데 책을 구매하기 전에 webpack 관련하여 공부를 하면서 개념적인 부분에서 많이 헷갈렸었다. 그러나 해당 책에서 간결하게 정리해주어 많은 도움이 되었다.

또한 webpack 구성에서 babel이나 hmr(hot module replacement) 등의 plugin 활용까지 다루고 있어 초반 개발 구성에 많은 도움을 받았다.

es2015 관련 부록은 핵심 부분만 추려서 정리한듯 보인다. 내용이 많지 않아 아쉬움이 있지만 react를 학습하는데 부족하지는 않아 보인다.

특히 책 예제들이 es2015에 맞춰 작성되어 있기 때문에 따라하다 보면 자연스럽게 화살표 함수나 import 구문 같은 es2015 문법을 학습할 수 있다.

react 학습 전에 꼭 부록 부분을 한번 따라해보면 좋을 것 같다.

(webpack 부분만으로도 책 구매 값어치는 충분하다고 개인적으로 생각..)

react 부분은 칸반 앱 이라는 프로젝트를 중심으로 차츰 프로젝트를 업그레이드 하는 형식으로 되어 있다.

이러한 책의 구성은 개인적으로 선호하는데 각 장마다 간단한 sample 예제를 따라해보는 방식이 아니라 프로젝트 하나를 점점 발전시켜 나가는 방식이 학습에 도움이 된다고 생각하기 때문이다.

초판이 그러하듯이 약간의 오탈자 부분을 빼면 아직까지는 내용 면에서 마음에 드는 책이라고 생각한다.

출판사 측에서 신속하게 정오표를 업데이트 해주고 있으므로 확인하면 좋을 듯. 

참고 1.

책 예제에서

React.render() 로 렌더링을 하는데

npm install --save react react-dom 으로 설치를 했다면 최신 버전인 15.x 가 설치된다.

15.x 버전에서는 render가 react-dom 으로 옮겨졌기 때문에

책 예제와 같이 한다면 결과가 나오지 않는다.

import {render} from 'react-dom';

로 import 하고 

react.render() 로 처리하거나

import ReactDOM from 'react-dom';

로 import 하고

ReactDOM.render() 로 사용하면 된다.

빠르게 react 버전이 빠르게 변하고 있기 때문인데(갑자기 15 버전이라니...) 책이라는 구조상 바로바로 반영이 되지 못하는 점이 아쉽다.

번역시에 최신 react 버전을 반영하여 검수가 되었으면 좋았을 듯.

참고 2.

1장 시작하기 GroceryList 이후에 나오는 KanbanBoard 예제 파일은 별도의 github에서 받을 수 있다.

원서에서 해당 예제를 다운로드 받는 방법을 문의한 유저가 있는데(https://github.com/pro-react/sample-code/issues/4)

별도의 repo로 분리를 했다고 답변은 있으나

해당 url의 README(https://github.com/pro-react/kanban-app/blob/master/README.md)에 나온 방법대로 하면 소스가 받아지지 않는다.

아래와 같이 github clone url을 사용하면 된다.

리액트 관련한 국내의 3번째 번역 발간서 입니다.

앞서서는 한빛미디어와 에이콘출판사에서 번역본이 있었는데.

이 책은 http://www.pro-react.com/ 의 책의 번역 발간서 이다

2015년 11월말에 영문원서가 발간된책으로

어찌보면 빠르게 국내 번역서가 나온것으로 확인 된다

개인적으로는 무엇보다 부록A 란의 웹팩관련한 내용을 따로 간추려 구성한 부분이 마음에 든다

프론트엔드 빌드 도구인 gulp grunt 와의 개념적 차이점을 설명 하면서도 

세세한 설명역시 놓치지 않았다.

크게 다루는 레퍼런스 책같이 보여지지만

예제를 통해 단계별로 책을 이어갈수 있다.

현재 외국 저자가 직접 링크라는 깃허브의 소스에는 

리액트 15버전까지 대응하여 샘플예제를 관리 하는것으로 확인이 된다.

책 구매이후에 저자의 원 페이지나 깃허브 소스를 참고하는것도 

많은 도움이 될것이다.

아 정말 이렇게까지 오타 최악 일 줄은 몰랐다.

구성과 내용을 대충 서점에서 훑어보고 산것인데....오타와 업데이트 패치 적용이 이렇게 부실할 줄은 

몰랐다. 꼭 각종 플러그인 설치 후 코드 내용이 업데이트 되었는지 확인해봐야 한다.

근데 웃긴건 그럴거면 머하러 이 책을 보고 하나 싶기도 하다..

정말 그냥 따라서 하는데도 에러와 온갖 삽질로 한달 보름간의 시간을 날린거 같다. 

보통 한달이면 1독하고 예제 한번씩 하고도 남는 시간인데....

심지어 아직 챕터를 다 끝내지도 못했다...

칸반예제가 있는데 router 적용까진 어케든 할 수 있을 것이다.

flux 부터는 완전 헬이다. 

router 와 flux 가 제일 중요한 부분이라 생각되는데... 

그 부분이 제일 세심하게 설명하지 못한 것도 좀 짜증이 난다. 

공식페이지 https://facebook.github.io/react/   를 보고  공부하는게 더 빠를 거 같다는 생각이 

자꾸든다.