한빛미디어

회사에서 새로 리액트로 프로젝트를 시작하게 되었는데, 마침 리뷰 대상 도서에 리액트 관련 도서가 있어 바로 신청했습니다! 

주로 백엔드 위주의 업무를 진행해왔기 때문에, 리액트를 사용해본 적은 있었지만 제대로 공부해본 적이 없었는데, 기초적인 부분부터 공부할 수 있었습니다. 

또한, 중간중간 개념에 대한 코드가 간략하게 소개되어 있어 도움을 많이 받았습니다. 

책을 읽으면서 중요하게 다가왔던 부분들을 간략하게 추려보았습니다. 

리액트는 애플리케이션을 작성하는 데 필요한 모든 기능을 한꺼번에 제공하지는 않으며 그저 아주 작은 라이브러리다. 그러니 꼭 한번 단 5분만 리액트를 써보자. (15p) 무엇보다도 리액트는 자신을 라이브러리라고 소개한다. 

이 말은 리액트가 모든 유스케이스에 적합한 도구를 제공하지 않고 특정 기능만 구현해 제공하는 데 관심이 있다는 뜻이다. (17p) 

1장 리액트 소개

JSX는 자바스크립트 코드 안에서 바로 태그 기반의 구문을 써서 리액트 엘리먼트를 정의할 수 있게 해주는 자바스크립트 확장이다. (111p) ​ 

우리는 JSX와 함께 최신 자바스크립트 기능을 활용하고 싶기 때문에 우리가 작성한 멋진 소스코드를 브라우저가 해석할 수 있는 코드로 변환해줄 수단이 필요하다. 이런 변환 과정을 컴파일링이라고 부르며 바벨이 그런 일을 해준다. (114p) ​ 

웹팩은 모듈 번들러로 알려져있다. 모듈 번들러는 여러 다른 파일들(자바스크립트, CSS, JSX 등)을 받아서 한 파일로 묶어준다. 모듈을 하나로 묶어서 얻는 2가지 이익은 모듈성과 네트워크 성능이다. (126p) 

5장 JSX를 사용하는 리액트

다만 우리 바람은 여러분이 제어가 되는 컴포넌트가 여러번 재 렌더링된다는 사실을 기억하고 이 컴포넌트 안에 오랜 시간이 걸리는 비용이 많이 드는 처리를 추가하지 말라는 것이다. 적어도 여러분이 리액트 컴포넌트를 최적화할 경우 방금 설명한 지식이 도움이 될 것이다. (168p)

6장 리액트 상태 관리

인터넷에서 데이터를 적재하는 처리는 비동기 작업이다. 데이터를 요청하면 응답이 배달되기까지 시간이 약간 걸리고, 중간에 무언가 잘못될 수도 있다. 리액트 컴포넌트 안에서 프라미스의 pending, success, fail 상태를 처리하는 방법은 useEffect 훅과 상태가 있는 훅을 잘 조화시켜 처리하는 것이다. (271p)

8장 데이터 포함시키기

리액트를 처음 접해본 건 아니었지만, 책을 읽어보면서 지금까지 관용적으로 써왔던 문법들의 의미와 사용하는 이유에 대해서 자세히 알 수 있었습니다. 

(예를 들어 객체 구조 분해나, 리액트 프래그먼트 등이 있었습니다.) 

역시 어떤 기술이든 기본적인 방향성과 개념들을 먼저 잡는 것이 중요하다는 생각이 들었습니다! ​

"한빛미디어 <나는 리뷰어다> 활동을 위해서 책을 제공받아 작성된 서평입니다."