한빛출판네트워크

75가지 핵심 문법과 예제로 익히는 RxJS 기초

RxJS 프로그래밍

이 책에 관심을 두시는 분들이 저처럼 비동기와 이벤트 기반의 프로그램을 작성하는데 여러 가지 장점이 있어 이 책을 선택했을 것입니다. 

분량이 생각보다 많습니다. 전체 페이지가 568 페이지나 되고, RxJS 기본 외에 실전 학습을 위한 앵귤러, 리액트 등에서 활용 방법까지 설명하고 있습니다.

부록A에는 ES2015 기본 문법과 부록 B에서는 RxJS 5, 6의 차이점에 대해서 자세히 기술하고 있습니다.

책의 흐름은 다음과 같습니다.

우선 1장에서는 RxJS를 이해하기 위한 리액티브 프로그래밍에 대해서 설명합니다. 그리고 개발환경 구축과 개발에 필요한 node.js, npm, Git 등에 대해 간단히 소개합니다.

2장에서는 RxJS 기본 개념을 설명합니다. 핵심이라고 할 수 있는 옵저버 패턴, 옵저버블, 생성함수 등에 대해서 설명합니다.

4장부터 필터링, 변환, 조합, 수학 및 결함, 유틸리티, 조건, 등 RxJS 연산자를 살펴 봅니다.

10장부터는 실전 코딩에 필요한 에러 처리, 서브젝트, 멀티캐스팅, 스케줄러, 테스트 증에 대해 설명합니다.

마지막으로 제가 생각하는 본 서적의 대상 독자층은 이렇습니다.

1. 일반적인 JavaScript 지식은 중상 정도 되어야 이 책의 충분한 가치를 체험할 수 있습니다.

2. JavaScript 함수형 프로그래밍에 대한 지식이 있으면 학습에 도움이 됩니다.

3. ES2015+에 대한 사전 경험이 있으시면 소스 분석에 도움이 됩니다. 물론 책 후반부에 친절하게도 ES2015+에 대해서 설명이 되어 있습니다.

4. 프로젝트 진행 시 이벤트 처리나 비동기 처리를 좀 더 편하게 구현하고자 하는 개발자에게 추천 드립니다.

들어가며

백엔드 개발자로 경력을 쌓아오던 중 그동안은 편의를 위한 간단한 운영툴 정도의 웹 개발만 해왔었기 때문에 jquery 외에는 다른 라이브러리들은 크게 고려하지 않고 개발을 진행해왔었다. 하지만 최근들어서는 서비스를 제공하기 위한 웹 개발을 하다보니 점차 기능도 많아지고 난이도 높은 개발들이 증가되고 있어서 프론트엔드 개발이 내 발목을 잡게 되었다. 자바스크립트에 대한 기본이 부족하고, 라이브러리 사용 경험 또한 적어서 공부의 필요성을 느끼고 강의도 다니며 자바스크립트 학습에 지속적으로 시간을 들이게 되었다.

프론트엔드 개발 중에 가장 고민되고 어려웠던 부분이 ajax를 사용하여 백엔드 서버와 데이터를 주고 받을 때 이 부분을 어떻게 하면 일관되게 처리하고, 버그가 발생하지 않도록 빈틈없이 처리를 할 수 있을까였다. 어떤 경우에는 동기식으로 서버의 처리 결과가 마무리 되는 것을 기다려야 할 때도 있었고, 비동기 식으로 프론트에서 주기적으로 상태를 체크해야하는 부분도 있었기 때문에 점차 로직이 복잡해지고 다양한 버그를 발생시켰다. 그러던 중 75가지 핵심 문법과 예제로 익히는 RxJS 기초 RX JS 프로그래밍을 알게 되었고, 여유 있을 때마다 카페에 와서 찬찬히 읽어보았다.

책을 읽으며

75가지 핵심 문법과 예제로 익히는 RxJS 기초 RX JS 프로그래밍 책을 읽으면서 이런 부분에서 매우 효과적으로 처리를 할 수 있겠다는 생각이 들었다. 하지만 곧바로 도입해서 사용하기에는 내용이 생각보다 많았고, 개념 또한 숙지해야할 부분들이 많아서 충분한 학습 시간이 필요할 것이라 생각이 들었다.

먼저 책에서 소개하는 RxJS는 ReactiveX 프로젝트에서 출발한 리액티브 프로그래밍을 지원하는 자바스크립트 라이브러리이다. 이를 이해하기 위해서는 리액티브 프로그래밍이라는 개념을 알아야하는데, 리액티브 프로그래밍은 비동기 프로그래밍 패러다임 중 하나이고, 자바스크립트에서 발생하는 이벤트를 비동기로 처리해서 변화에 유연하게 반응하는 것을 의미한다. 이 리액티브 프로그래밍은 자바스크립트에만 적용되는 것이 아니라 RxJava와 같이 다른 언어에서도 사용할 수 있는 프로그래밍 기법이라고 생각하면 좋을 것 같다. RxJS와 리액티브 프로그래밍에 대해서는 책의 도입부에서 자세하게 다루고 있으니 충분히 이해할 수 있을 것이라 생각된다.

책 제목처럼 각 개념들이 등장할 때마다 예제로써 독자들의 이해를 돕고 있다. 굉장히 자세하게 개념들을 하나씩 설명하고 있지만 개인적으로는 그림이 많이 포함되어 있었다면 이해가 더 쉽지 않았을까하는 아쉬운 마음이 들었다. 책을 읽어가며 글로는 잘 이해가 되지 않아 몇 번이나 다시 읽었던 적이 여러번이었기 때문이다. 그래도 여러번 읽고나면 이해에는 크게 무리가 없었다. 책 구성 또한 기본 이해부터 라이브러리의 각 요소들을 하나씩 풀어가며 설명하고 있기 때문에 읽는 재미가 있었다. 책의 주제가 RxJS이다 보니 RxJS에 대한 설명이 선행된 후 후반부에서 ES2015+에 대한 설명이 이어진다. 만약 ES2015+에 대한 기본 지식이 없는 경우에는 후반 부를 먼저 읽고 난 후에 앞부분을 읽는 다면 이해에 더 도움이 될 것이라 생각이 든다.

마치며

75가지 핵심 문법과 예제로 익히는 RxJS 기초 RX JS 프로그래밍 책은 비단 RxJS를 위한 것이 아니라 ES2015+에 대한 지식을 익히고 싶은 독자들에게도 충분히 도움이 될 것이라 생각한다. 나 또한 처음에는 RxJS라는 생소한 단어로 인해 뭔가 새로운 지식을 익혀야 한다는 부담감과 실무에 도입할 수 있을지에 대한 의구심 때문에 꺼려지는 부분이 있었는데 읽다보니 이는 라이브러리일 뿐이고 개발의 효율을 위해 얼마든지 도입할 수 있으며, 자바스크립트 기본과도 동떨어져 있지 않다는 것을 느꼈다. 이러한 이유로 자바스크립트를 사용하여 개발을 하고 있고, 실력 향상에 갈증을 느끼는 독자들이라면 꼭 한번 읽어볼만한 책이라고 생각한다.

솔직히, 이 책을 제외하고도 RxJS 책이 한 권 있습니다. 두 책을 비슷한 시기에 읽다보니 자연스레 비교하며 읽게 되었는데요!

본격적인 리뷰를 시작하기에 앞서 설명드리자면 기본적인 부분에 있어서 철저히 RxJS 문서를 기반으로 하는 설명이 있다고 생각합니다. 어느 정도 지식이 있는 상태에서라면 그냥 문서를 읽지... 라고 생각하겠지만 친절하게 번역해서 상황에 맞는 예제와 다이어그램으로 설명을 해주며 예제 또한 실제 문서에서 보여주는 예제를 각색하여, 문서를 이해하기도 쉽게 도와줍니다.

Part. 1 RxJS 소개

Part 1 이하에는 RxJS 소개와 개발 환경 구축, RxJS의 기본 개념, 생성 함수 가 설명되며 RxJS의 가장 중요한 개념인 Observable, Observer, Subject, Subscription에 대한 기본적인 설명과 Observable을 생성하기 위한 함수들과 기능들에 대해 말해줍니다.

기초적이면서도 시작점인 부분이기에 RxJS 책에선 가장 중요한 부분입니다.

Part. 2 RxJS의 연산자, Part. 3 효과적인 RxJS 사용

이 부분들은 간단히 말해 Part. 1에서 생성된 Observable을 어떻게 다룰지에 대한 소개를 담은 챕터이다. RxJS를 상황마다 유연하게 사용하려면 이 부분을 자세히 알아야 하지만 RxJS공식 문서 를 보면 알 수 있듯이 엄청난 수의 Operators가 있기 때문에 보통은 이 모든 동작을 외울 수 없습니다. (es5 ~ es8까지의 모든 기능을 외울 수 없는 것처럼...) 익숙한 JS 개발자라면 기능들을 천천히 살피는 것이 모를 때 어떻게 찾아야 하는지 에 대해 도움이 된다는 것을 알 수 있을 것입니다.

Part. 4 실전 RxJS

이 책에서 가장 흥미로웠고, 읽기 전부터 기대했던 부분인데요. ES6 (ES2015+)와의 async / await과 함께 사용하는 방법이나 (Vue는 없지만) React, Angular 와의 콜라보, redux / redux-observable 라이브러리로 사용하는 RxJS 등등, 실전에서 사용하는 방법들에 대한 설명이 이어집니다.

이번 책 리뷰의 내용은 개념적으로 크게 어려운 부분이 없어 이정도로 정리하려 합니다. 이 책에서는 첫 부분에 말한 장점이 단점이기도 한데요, 친절하게 번역해서 상황에 맞는 예제와 다이어그램으로 설명을 해주며 예제 또한 실제 문서에서 보여주는 예제를 각색 이라는 말은 영어 번역이 어려운 초보자에게 하는 설명입니다. 라는 말일 수 있고, es2015 문법도 자세히 설명하는 것이 책을 읽는 독자의 미니멈 수준을 너무 낮게 잡은게 아닐까~ 생각들게 하였습니다.

초보적인 부분에 큰 도움이 될 수는 있겠지만, 실무적인 부분에 참고할 부분이 적었던 것은 사실입니다. 이러한 부분에 있어 약간의 아쉬움을 가지고 이번 리뷰 마무리 하겠습니다. 감사합니다.

최근 Reactive Programming(이하 RP) 란 힙한 키워드에 꽂혀 몇몇 자료들과 동영상을 봤는데 도대체 무슨 일이 벌어지고 있는지 알 수가 없었다. RP란 것이 단순히 라이브러리 API를 익히는 수준이 아니라, 문제를 바라보는 시각 자체를 바꿔야만 하는 것이기 때문에 그렇다(고 한다).

이런 개념을 익히는데는 블로그나 동영상보다는 좀 더 긴 호흡으로 많이 생각해 볼 수 있는 책이 더 낫겠다는 생각이 들어, 이 핑키하고 아기자기하여 소장하는 맛이 있는 책을 골랐다. JVM 환경에서 RP를 적용하려는 계획을 갖고있는데 RxJS 책을 고른 이유는 1) RP의 개념이 언어별로 크게 다르지 않(다고 들었)고, 2) 가장 익숙한 언어가 아닌 언어로 된 책을 볼때면 코드 한 줄도 집중해서 보게 되는 효과가 있어서 그렇다.

(JS 환경에서 적용할 계획은 없어서 4부는 자세히 읽어보지 않았다.)

이 책이 주는 것

- Rx 의 개념

Observable, Subject, Observer, Scheduler와 각종 연산자들의 개념이 적절한 예제와 함께 잘 소개되어있다. API 문서 마냥 각각의 설명을 늘어놓지 않고 친절한 블로그 글처럼 미묘한 동작의 차이점을 이해할 수 있도록 상세한 예제들을 소개해줘서 큰 도움이 된다.

- 1부(RxJS 소개)에 Observable 생성함수 부분을 포함한 것

1부는 RxJS에 대한 큰 틀의 이해를 할 수 있도록 한 부분인데 여기에 Observable 생성함수 내용이 포함되었다. 그래서 이벤트, 배열, 문자열 등 모든 것이 Observable의 item이 될 수 있음을 알게되어 RP를 이해하는데 큰 도움이 되었다.

- 꼼꼼함

연산자를 참 많이 소개해준다. RxJS에 존재하는 모든 API를 담은 것은 아니지만 필자의 경험상 유용하게 쓰였던 것들이 엄선되었으리라 생각한다. 이 부분을 너무 꼼꼼하게 읽다가 나가떨어지지 않도록 주의해야한다.

- 친절함

마치 나처럼 JS가 편하지 않지만 RP 개념을 알기 위한 독자들을 정확히 예상한듯, RP를 설명하는데 필요한 개념들을 친절하게 설명해준다. 이 책을 잘 읽으면 RxJS 뿐만 아니라 ES2015+, 모던 프론트엔드 개발 환경(앵귤러 & 리액트), JS 테스트 환경에 대한 뜻밖의 지식을 얻게 될 것이다.

이 책에 없는 것

- 왜 RxJS를 써야하는가?

사실 RxJS를 익히기 이전에 더 중요한 것이 이 내용이다. RP는 하루만에 뚝딱 익히기는 어려운 주제이기 때문에 끈기있게 배움을 이어가기 위해서는 강한 동기가 필요하다. 단순히 힙한 주제에 대한 호기심을 넘어서 실제로 RP가 내게 도움이 되는 것인지 알기 위해서는 다른 자료들을 많이 참고해보고 적용해볼만한 상황인지 판단하는 것이 좋다.

- 실용적 예제

실제 문제를 RxJS로 해결하는 사례가 소개되어 있지 않은 점이 다소 아쉽다. 4부의 내용도 라이브러리 & 프레임워크 레벨에서 RxJS가 어떻게 사용될 수 있는지에 대한 것이라 유저 레벨에서의 요구사항을 해결하는 예는 되지 못한다. 이 역시 다른 자료들을 참고해보고 RP가 어떻게 쓰이는지를 겪고 나면 책 내용을 다시 곱씹게 되는 좋은 기회가 된다.

다 읽으면 남에게 주지 않고, 내 책장에 꽂아두고 오래오래 우려먹을 사골같은 책을 만나 기분이 좋다.

RxJS프로그래밍 - 리뷰

이 책을 한마디로?

숙련된 개발자가 옆에서 rxjs가 뭔지 그리고 ES5가 뭔지를 상세히 알려주는 책입니다. 경험이 우러나오는 RXJS의 기본 책입니다. 그러나 MDN에 있는 예제를 그대로 베끼거나 어떨때는 ES5, 어떨 때는 ES5가 아닌 통일되지 않은 느낌은 아쉬움을 줍니다. 

별점을 매기자면?

★★★★☆

4점입니다. 내용면에서 자바스크립트 개발자라면 자바스크립트를 배우고 이 책을 공부하라고 추천할 정도로 내용면에서 탁월하다 못해 일품입니다. 

마음에 드는 부분

1.  파이퍼블 연산자 설명부분

파이퍼블 연산자를 연결해 새로운 옵저버블 인스턴스를 생성할 수 있는 이유는 파이퍼블 연산자 각각의 구현을 보면 알 수 있다. 

const sink = toSubScriber(observerOrNext, error, complete);

if(operator){

    operator.call(sink, this.source)

}else{

    sink.add(this._trySubscribe(sink))

}

//연산자가 없을 때는 최종옵저버 this._subscribe(sink)에 결과를 전달한다. 

_trySubscribe(sink){

    try{

        return this._subscribe(sink)

    }

    catch(err){

        sink.syncErrorThrown = true; 

        sink.syncErrorValue = err; 

        sink.error(err)

    }

}

2. 정리하는 부분이 좋습니다.

Next : 다음에 전달할 값 또는 이벤트를 발행한다.  

Error : 애러나 예외가 발생하면 이를 전달받는다. 구독 종료 

Complete : 정상적으로 옵저버블 구독을 완료하면 호출된다. 구독 종료 

3. 자바스크립트를 자세하게 설명하는 부분이 좋습니다.

스케줄러는 옵저버가 옵저버블을 구독할 때 어떤 순서로 어떻게(동기, 비동기 등) 실행할 지 실행 컨텍스트를 관리하는 역할의 자료구조이다.  

단일 스레드인 자바스크립트에서는 비동기 방식으로 asyncScheduler가 있고 동기방식으로는 트램폴린 방식으로 큐를 사용하는 queueScheduler가 있다.   

4. from, defer 함수를 설명하는 부분이 좋습니다.

From : 프로미스 안 구현 부분이 언제 실행되든 상관없을 때, defer 함수는 옵저버블을 구독하는 시점에 프로미스를 생성하여 프로미스 안 구현 부분이 실행되어야 할 때 사용한다.  

From: 이미실행, 완료한 프로미스를 옵져버블로 만들 때 적합, defer 함수는 프로미스 실행시점이 구독하는 시점이어야 할 때 적합하다.

아쉬운 부분

1. 어떤 것은 옵저버블 인스턴스이고 객체인가에 대한 차이점 설명 부족

2. 통일되어있지 않은 느낌

 - 61쪽은 ES5로 subscribe를 구현하지만  65쪽은  ES5가 아닌것으로 구현합니다.통일되어있지 않는 느낌을 줍니다.

61쪽과 65쪽

 - 79쪽에는 “이제부터” subscribe화살표함수를 쓴다고 했지만 82쪽에는 다시 화살표함수를 쓰지 않습니다.

79쪽과 82쪽

3. 오타가 좀 있습니다.

리뷰 블로그 : http://jhc9639.blog.me/221372596558 

"75가지 핵심 문법과 예제로 익히는 RxJS 기초"를 정독하게되면 우리는 일관된 방식으로 안전하게 데이터 흐름을 처리할 수 있는 능력이 생기게됩니다.

1. 구성

챕터 1에서 리액티브 프로그래밍과 RxJS의 간략한 소개, 챕터 2에서 코드를 통한 RxJS Overview를 다루고 챕터 3부터 13까지는 RxJS 라이브러리 레퍼런스에 가까운 내용들로 이루어져있다. 챕터 14부터 mocha를 통해 JS 코드를 테스트 하는 방법, 비동기 프로그래밍, 앵귤러, 리액트와 RxJS 조합, RxJS용 리덕스 라이브러리에 대해 다룬다.

2. 특징 및 내용

챕터 2에서 간략하지만 전체적으로 RxJS에 대해 집고넘어가는 구성덕분에 그 뒤 내용을 이해하기 훨씬 수월하다.

책의 부제로 달려있는 75가지 핵심 문법과 예제로 익히는 RxJS 기초 라는 내용에 맞게 자주 쓰일법한 함수들을 마블 다이어그램과 함께 간략한 예제를 통해 이해하기 쉽도록 소개하고있다. JS와 비동기에 익숙하지 않다면 이해하기 힘든 내용들도 존재하는데 책의 코드를 하나하나 따라쳐보고 실제 동작을 확인하며 읽는다면 크게 어려운 정도는 아니다. 다만 챕터 10개에 달하는 분량동안은 계속 레퍼런스, RxJS 공식 문서에서도 확인할 수 있는 내용들이 실무에 크게 도움 안되는 예제 코드들과 반복되고 있어 그래서 이걸 어떻게 쓸 수 있다는거야? 생각하는 사람에겐 피로감을 줄 수도 있다. RxJS 메소드들을 마블 다이어그램과 함께 구성된 수긍가는 예제들로 소개해 이해하기 크게 어렵지않다.

탭처 14부터는 실전 RxJS라 해서 실무에 적용할 수 있도록 예제를 소개하는데 이 부분은 반쯤 도움이 되었다. 대부분이 라이브러리 소개와 Getting Started 정도의 내용이라 기존 앵귤러, 리액트, mocha같은 라이브러리와 어떻게 조합해서 써야하는지 초기 방향을 잡는데 실마리를 제공해주긴 하나 바로 실무에 적용할만큼의 인사이트를 주진 못했다. 리덕스를 쓰고 있었다면 RxJS와 함꼐 재구성한 리덕스 내용과 redux-observable 라이브러리를 로그인 예제로 풀어나가는 부분은 도움이 될 듯 하다.

3. 추천

기존에 RxJS가 뭔지는 궁금했으나 옵저버 옵저버블 내용이 잘 와닿지 않아 포기했거나, 책을 곁에 두고 이 상황에 적절한 메소드가 뭐였지 할 때 마다 간단히 펼쳐보고 싶은 사람에게 추천한다. 실무에 바로 적용할 수 있는 내용인지는 의구심이 드나 입문서로 보기에 아주 좋은 책이다.

RxJS의 기본개념부터 막혔다 ... 무슨말인지 쏙쏙 들어오지 않았다
아직 버퍼, 메모리, 스트림 등 나에게 많이 들어봤지만 섞어놓으니 조합이 되지 않는 용어. 

내자신이 공부가 더 필요하다고 느낌 ... 

그래서 개인적으로 나같은 사람들에게는 추천하고싶지 않다. 그렇지만 나는 읽었다.

함수, 여러가지 연산자, 예외처리, 서브젝트, 스케쥴러를 다루고 있다. 
설명이 세세해서 좋지만 이해가 가지 않은부분은 과감히 패스
나중에 다시 읽어보는게 좋겠다고 생각하여 예제 위주로 나는 읽어봤다.

나에겐 앵귤러 경험이 있어서 챕터 16을 읽으면서 실전에서 이렇게 사용할 수 있겠구나 싶었고, 리액트도 그다음 챕터에서 다루고 있다. 리액트의 기본개념을 몰라도 읽으면서 어느 정도의 감은 올듯 싶다.

그리고 내가 이책에서 제일 좋았던 부분은 ECMAScript 2015, ES2015를 다루고 있다. 
나름 여러가지 안다고 생각했지만 책을 읽으면서 나의 개념을 다시 잡을 수 있어서 좋았다.

나의 발전을위해서라도 다시 한번 꼭 읽어보고 싶은 책.

정말 진지하게 관심을 가지고 RxJS를 내 것으로 만들 생각을 가진 이들이라면 이 책은 후회하지 않을 선택일 것입니다. :-)

개인 블로그 리뷰 : http://blog.naver.com/toima0406/221371034819

오 'ㅅ') 나왔어. 
국내에 정식으로 RxJS 이름 달고 나온 2번째 책이 나와버렸어.
// 첫번째는 루비페이퍼의 'RxJS 퀵스타트' 였음. 한빛미디어 까비.

기존에 한빛미디어에서 출판된 '함수형 반응형 프로그래밍' 도서에도 RxJS 의 소개 챕터가 있긴 했지만, 

그에 할당된 볼륨이 매우 적었는데, 이 도서는 568 페이지 볼륨 전체를 RxJS 와 javascript 에 관해 채우고 있다. 

본인도 2016 년도부터 RxJS 에 관심을 가지고 사용하던 바, 이 책의 등장은 매우 반가웠다.
챕터 순으로 RxJS 소개와 개념, Observable 생성 함수와 연산자(operator), 에러 처리, 서브젝트, 스케쥴러를 순차적으로 다루고 있는데, 

설명이 매우 'ㅅ')! 세세한데다 필자들의 분석이나 실무 경험에 따른 생각도 녹여두고 있어 초심자에게 많은 도움이 될 것으로 생각한다.
// 두 필자 모두 카카오 근무
// Learn RxJS 사이트나 RxJS in Action 도서를 함께 보는 것을 추천한다.

챕터 15 에서 비동기 처리를 위한 generator, promise, async, await 와 RxJS 를 함께 다루는데, 
기존에 이들 각각에 대한 이해가 있으신 분들에게도 일독을 권한다.

본인 개인적으로는
RxJS 로 redux 를 구현해보는 챕터 17 과,
redux-observable 을 다루는 챕터 18 의 구성이 강추. 'ㅅ')/
// redux-thunk 는 이 책 저 책에서 여러번 다뤄진 바가 있으나,
// 아마도 국내 저자의 도서로서는 redux-observable 을 다루는 첫 사례가 아니려나 'ㅅ')b 구웃

RxJS, React 에 관심이 있는 2018 년도의 Front-end 개발자라면, 
이 책을 읽어 손해 보는 일은 없을 것이다.

.

친절하게도, 부록으로 ES2015+ 관련 기초와 

현재 RxJS 의 최신 버전인 6 버전대와 과거 버전들과의 차이점까지 짚어주는 챕터가 있다. 

// 여기까지 오면 이건 뭐... 깨알 같은 버릴데 없는 구성임.