메뉴 바로가기 검색 및 카테고리 바로가기

한빛미디어

오래된 내 정보 속 옥의 티를 찾아라(2022.9.22~12.31) / 회원정보 UPDATE하고 선물도 받고!

모던 자바스크립트로 배우는 리액트 입문

유데미 리액트 강의 최고 평가를 받은 인기 강사에게 배우는 실전 리액트

한빛미디어

번역서

판매중

  • 저자 : 자케(오카다 다쿠미)
  • 번역 : 김모세
  • 출간 : 2022-11-07
  • 페이지 : 280 쪽
  • ISBN : 9791169210454
  • 물류코드 :11045
초급 초중급 중급 중고급 고급
4.7점 (15명)
좋아요 : 39

유데미 리액트 분야 베스트셀러 강사가 직접 알려주는 리액트 기본 중의 기본

 

리액트를 공부하다 보면 크게 두 가지 벽에 부딪힌다. 첫 번째 벽은 학습 초기에 리액트의 독특한 표기법이나 세계관에 익숙하지 않아 코드를 제대로 작성하지 못해서 만나고, 두 번째 벽은 리액트 중급자에서 상급자가 될 때 만나게 된다. 이 책은 첫 번째 벽을 넘는 데 도움을 준다. 리액트를 익히는 데 필요한 자바스크립트 기초부터 실무에 유용한 타입스크립트까지 담았다. 대화 형식으로 장별 목표를 먼저 안내하고 풍부한 그림과 예제, 친절한 코드 설명으로 어렵지 않게 익힐 수 있도록 구성했다.

 

 

[상세이미지] 모던 자바스크립트로 배우는 리액트 입문.jpg

 

 

 

자케(오카다 다쿠미) 저자

자케(오카다 다쿠미)

Reach Script 대표이사. SIer(System Integrator), 프리랜서 프런트엔드 엔지니어를 거쳐 회사를 설립했다. 대표이사지만 자신도 펫×테크놀로지 서비스 개발에 참여한다. 온라인 교육 플랫폼 유데미에서 리액트 강의를 운영하고 있으며 최고 평가를 받는 등 베스트셀러 강사로도 자리매김 중이다.

김모세 역자

김모세

소프트웨어 엔지니어, 소프트웨어 품질 엔지니어, 애자일 코치 등 다양한 부문에서 소프트웨어 개발에 참여했다. 재미있는 일, 나와 조직이 성장하고 성과를 내도록 돕는 일에 보람을 느끼며 스스로 도전하는 사람이 되기 위해 노력하고 있다. 『코드 품질 시각화의 정석』(지앤선)을 썼고 『전문가를 위한 파이썬 프로그래밍(제4판)』 『AWS로 시작하는 인프라 구축의 정석』(제이펍), 『구글 앱스 스크립트 완벽 가이드』 『동시성 프로그래밍』(한빛미디어), 『좋은 팀을 만드는 24가지 안티패턴 타파 기법』(에이콘) 등을 옮겼다.

Chapter 1 모던 자바스크립트 기초

1.1 모던 자바스크립트 개요

1.2 DOM, 가상 DOM

1.3 패키지 관리자

1.4 ECMAScript

1.5 모듈 핸들러, 트랜스파일러

1.6 SPA와 기존 웹 시스템의 차이

1.7 정리

 

Chapter 2 모던 자바스크립트 기능 익히기

2.1 const, let을 이용한 변수 선언

2.2 템플릿 문자열

2.3 화살표 함수 ( ) => { } 

2.4 분할 대입 { } [ ]

2.5 디폴트값 =

2.6 스프레드 구문 ...

2.7 객체 생략 표기법

2.8 map, filter

2.9 [덤] 삼항 연산자

2.10 [덤] 논리 연산자의 원래 의미 && || 

2.11 정리

 

Chapter 3 자바스크립트에서 DOM 조작

3.1 자바스크립트를 이용한 DOM 액세스 

3.2 DOM 작성, 추가, 삭제

3.3 자바스크립트를 이용해 DOM 조작하기

3.4 정리

 

Chapter 4 리액트 기본

4.1 React 개발 시작하기

4.2 JSX 표기법

4.3 컴포넌트 사용 방법

4.4 이벤트와 스타일

4.5 Props

4.6 State(useState)

4.7 재렌더링과 부작용(useEffect) 

4.8 export 종류

4.9 정리

 

Chapter 5 리액트와 CSS

5.1 Inline Styles

5.2 CSS Modules

5.3 Styled JSX

5.4 styled components

5.5 Emotion

5.6 Tailwind CSS

5.7 정리

 

Chapter 6 재렌더링 구조와 최적화

6.1 재렌더링이 발생하는 조건 

6.2 렌더링 최적화 1(memo) 

6.3 렌더링 최적화 2(useCallback) 

6.4 변수 메모이제이션(useMemo)

6.5 정리

 

Chapter 7 글로벌 State 관리

7.1 글로벌 State 관리가 필요한 이유 

7.2 Context에서 State 관리

7.3 기타 글로벌 State 취급 방법

7.4 정리

 

Chapter 8 리액트와 타입스크립트

8.1 타입스크립트 기본

8.2 API로 얻은 데이터에 대한 타입 정의 

8.3 Props에 대한 타입 정의

8.4 타입 정의 관리 방법

8.5 컴포넌트 타입 정의

8.6 생략 가능한 타입 정의

8.7 옵셔널 체이닝

8.8 라이브러리 타입 정의

8.9 정리

 

Chapter 9 사용자 정의 훅

9.1 사용자 정의 훅

9.2 사용자 정의 훅 템플릿 작성 

9.3 사용자 정의 훅 구현

9.4 정리

 

부록 리액트×타입스크립트 실전 연습

리액트가 어려운 이유는  

자바스크립트에 대한 이해가 부족하기 때문입니다 

 

리액트 학습에 어려움을 느끼는 사람들은 대부분 자바스크립트에 대한 이해가 부족합니다. 예를 들어 가상 DOM, 모듈 핸들러, 분할 대입, 스프레드 구문, 화살표 함수 가운데 하나라도 제대로 알지 못한다면 리액트를 공부하더라도 이해하기 어려울 수 있습니다. 하지만 걱정하지 않아도 됩니다. 이 책은 바로 리액트를 배우기 어려운 이유를 잘 알고 있는 저자가 썼습니다. 온라인 동영상 학습 플랫폼 유데미에서 강의하고 최고 평가를 받은 리액트 강사가 직접 전하는 리액트 입문서를 만나보세요. 모던 자바스크립트 기초를 익히고 리액트를 배우면 분명 전과는 다른 세상이 보일 것입니다. 

 

 

★ 대상 독자 

  • 리액트를 배우고 싶은 입문자
  • 자바스크립트도 리액트도 어려운 프런트엔드 개발 입문자
  • 기존 자바스크립트에서 모던 자바스크립트로의 변화가 궁금한 개발자
  • 모던 프런트엔드의 개요를 파악하고 싶은 백엔드 또는 인프라 개발자

 

★ 이 책의 구성

 

이 책은 회사에 다니는 주인공의 리액트 학습 과정을 이야기 형식으로 그리고 있습니다. 각 장 도입 부분의 Episode에서 배울 내용을 소개하고 이어서 그와 관련된 기술을 설명합니다.

  • 1~3장에서는 리액트를 공부하기 전에 알아야 할 자바스크립트 기초를 배웁니다. 리액트를 포기하지 않고 학습하기 위해서는 이 부분이 매우 중요합니다.
  • 4~9장에서는 리액트 기본, 리액트에서 CSS 다루기, 재렌더링, 글로벌 State 관리, 리액트 개발에 타입스크립트 사용하기 등 리액트 개발에 필요한 지식을 소개합니다.

 

 

 

 

자바스크립트에 조금씩 흥미를 느끼는 요즘! 눈에 띈 책이라 바로 읽어보았다.

 

 

리액트는 프론트엔드 언어고, 이를 위해서는 자바스크립트 기본이 필요하다고 한다. 개인적으로는 이부분이 참 좋았다. 예를 들어 변수를 선언할 때에도 var, let, const의 사용법 뿐 아니라 어떤 것을 쓰는 것이 더 좋은지를 알려준다. 간단히 자바스크립트에 대한 설명 후 4장에서 리액트로 넘어가는데, 간단하게 체험할 수 있는 사이트로 연습을 할 수 있어 진입장벽 없이 할 수 있는 점이 좋았다.

 

 

중간에 포함되어 있는 대화 형식을 통해 이런 부분이 어려운 부분이었군!과 같은 위로(?)도 얻을 수 있어 마치 옆에서 과외하는 듯 한 느낌이 들게 한다! 리액트와 함께 쓰일 스타일로는 CSS를 적용하고 리액트 연습까지 포함되어있다.

리액트가 뭔지는 들어봤고 굉장히 많이 배우고있다는 것은 알고있었으나.... 아직 초보자에게는 조금은 어려운 책인 것 같다. 그와중에 활용할 수 있는 방법은 우선 책 속의 대화체(만화같은 부분)를 먼저 읽고나서 흐름을 파악한 후에 책을 부분적으로 읽는 것?! 이 방법으로 다시 읽어봐야겠다. !!

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

 

# 모던 자바스크립트로 배우는 리액트 입문

 

- 프론트엔드 개발에서 인기를 끌고 있는 라이브러리인 [리액트(React)]는 자바스크립트를 사용합니다. 그만큼 웹을 공부하는 개발자들 사이에서 거의 필수로 자리 잡은 라이브러리입니다.

- 책에서는 리액트를 공부할 때 두 번의 벽을 만난다고 합니다. 첫 번째는 **학습 초기에 리액트의 독특한 표기법이나 세계관에 익숙하지 않아 코드를 제대로 작성하지 못하는 경우**고, 두 번째 벽은 리액트 중급자에서 상급자가 될 때 만나는 경우라고 합니다. [모던 자바스크립트로 배우는 리액트 입문]은 리액트의 첫 번째 벽을 경험하는 입문자를 대상으로 쓰인 책입니다.

 

## 입문자에게 적합한 구조

 

- 입문자를 혼란스럽게 만드는 경우로, 이것을 왜 익혀야 하고 어떻게(어디에)? 사용해야 하는지 모르는 경우가 있습니다. 특히 각 장 도입 부분에서 학습할 내용을 먼저 확인하는 과정이 입문자에게 보다 쉽게 배경을 파악할 수 있도록 도와줍니다.

- 또한 풍부한 예제와 자세한 설명은 프로그래밍이 처음이고 리액트를 처음 배우는 입문자에게는 매우 적합한 도서라고 생각합니다.

 

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

KakaoTalk_Photo_2022-11-28-03-39-39.jpg

 

 

최근 신규로 서비스를 만든다고 하면, SPA 프레임워크를 고려하는 곳이 많다. 그리고 가장 많이 언급되는 프레임워크는

리액트와 뷰가 되지 않을까 싶다. 각각의 장점이 있기 때문에 어떤게 좋다 나쁘다 할 수는 없지만, 아직은 리액트가 조금 더 

 

우세하지 않은가 싶긴 하다. 그리고 이런 프레임워크들은 모던 자바스크립트를 최대한 수용하고 활용하고 있기 때문에 

 

기본적으로 알아야 제대로 쓰일 수 있다. 이 책은 읽기 쉽게 되어있다. 딱딱하지 않게 중간중간 대화체로 설명이 되어 있으며

 

예제도 어렵지 되어 있습니다. 아무래도 대상이 입문자를 위해서 쓰여져서 그런 것 같습니다.

 

전체적으로 심화 내용은 다루지는 않지만, 리액트를 다루기 위해서 기본적으로 알아야하는 내용들을 다루기 때문에 

 

리액트가 어려워 주저했던 분이라면 이 책을 한 번 읽고 다른 책을 보면 많은 도움이 될 것 같습니다. 특히, 훅에 대한 개념을

 

잘 이해하지 못했다면 읽어보면 좋을 것 같습니다. 그리고 책의 분량이나 내용이 어렵지 않기 때문에 가볍게 이동하면서 

 

보기에 좋은 것 같습니다. 

 

 

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

 

모던 자바스크립트로 배우는 리액트 입문.jpg

리액트, 프런트엔드에서 활용하는 도구 가운데 가장 많이 사용하는 라이브러리로 알고 있습니다.

독특한 표기법은 둘째 치고라도 처리하는 방식에 도약이 많은 라이브러리라고 느껴집니다.

한 번씩 프로젝트에 적용하기 위해 검토하면 예전에 보았던 내용과 지금 살펴보는 내용에 꽤나 많은 변화가 있다는 걸 알게 됩니다.

이렇게 빠른 변화가 프런트엔드만 해당하는 건 아니지만 '또 업그레이드가 있었구나!' 하는 느낌을 받습니다.

 

어떻게 접근해야 하는지 라이브러리 자체가 보여주는 듯합니다. 계속 성장하는 라이브러리이니 빠르게 시작해서 필요한 부분을 채워나가는 식으로 사용하는 방식이 좋다고 알려주는 것 같습니다. 메타(페이스북)의 스타일이기도 한 것 같구요.

책은 이러한 스타일로 리액트를 알아갈 수 있도록 안내합니다.

필요한 내용을 우선하여 접근합니다. 입문서로서 속도감을 유지하며 끝까지 읽을 수 있습니다.

 

리액트에 필요한 자바스크립트

모던 자바스크립트 라고 불리기도 합니다. 자바스크립트는 가장 많이 바뀐 프로그래밍 언어 가운데 하나가 아닐까요.

그렇다고 자바스크립트를 파고들다가는 리액트를 배우기도 전에 지쳐버릴 수 있습니다.

물론, 자바스크립트를 깊이 있게 이해하고자 한다면 문제될 게 없지만 우리의 목표는 리액트입니다.

리액트를 알기 위해 필요한 자바스크립트 문법, 더도 말고 덜도 말고 딱 그만큼 정리하고 있습니다.

 

리액트를 본격적으로 설명할 때 보이는 코드를 보면 기존 자바스크립트 문법은 리액트를 배우는데 크게 도움이 되지 않습니다. 오히려 모던 자바스크립트를 알아야 리액트 코드를 따라갈 수 있습니다.

반드시 필요한 내용이고 탁월한 선택이라 생각합니다.

 

리액트

리액트가 어떻게 움직이는지 알려줍니다.

무엇이 있으며 어떻게 이용해야 하는지 알려줍니다. 너무 깊이 들어가지 않습니다.

이 부분만 보면 리액트 별거 없다고 느껴질 정도입니다만 입문서라는 것을 잊지 말아야 합니다.

 

리액트가 할 수 있는 것과 할 수 할 수 없는 것을 알려줍니다. 그리고 어떻게 대응하는지 알 수 있습니다.

리액트가 가진 구조적인 이유로 랜더링이 전파되는 상황과  State 관리, 리액트를 알아가면 자연스럽게 부딪힐 부분에 대해 알려줍니다.

이해하고 익숙해지면 조금 더 고민해야 할 부분이지만 리액트를 배우는 입장에서 알아야 할 만큼 얘기합니다.

 

한걸음 더

자바스크립트로는 얻을 수 없는 부분을 채우기 위해 타입스크립트를 알려줍니다.

타입스크립트를 리액트에 적용하면 어떤 효과를 얻을 수 있는지 볼 수 있습니다. 에피소드를 통해 흥미진진하게 읽었습니다.

여기까지 오면 조금씩 궁금해지기 시작합니다. 이런저런 상황을 떠올리며 리액트로 어떻게 풀어갈 수 있는지 스케치하기 시작한다면 리액트에 조금은 익숙해지고 있다는 말이기도 하니까요.

 

가 부족하다 싶을 때 사용자 정의 훅을 알려줍니다.

조금 난이도가 있을 수 있지만 리액트를 맛만 보는 수준이 아닌 실제 사용을 위해서 알아야 하는 부분이라 들어간 내용이라 생각합니다.

 

 

중간중간에 있는 에피소드는 집중력을 환기시키는데 도움이 됩니다. 접근하기 쉽게 내용을 설명하더라도 기술서적이 가지는 무거움 자체를 부정할 수는 없습니다.

불필요하다고 보실 수 있는데, 당 떨어졌을 때 주스를 마시며 기분 전환하는 것과 비슷한 효과가 있다고 봅니다.

트러블 슈팅이나 매뉴얼이 아닌 입문서라는 정체성을 유지하는 방편이지 않을까요.

 

리액트를 처음 배우고자 하는 분, 빠르게 리액트를 살펴보려는 분 모두에게 좋은 선택이라 생각합니다.

 

자세히 알려고 하기보다 가볍게 훑어보고 빠르게 시도하며 알아가기

이게 리액트와 이 책이 바라는 것이겠지요.

 

 

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

책의 내용이 대화 형태로 이루어져 있고, 책이 두껍지 않고 필요한 내용 위주로 이루어져 있어서 프론트엔드공부를 시작한 초보 개발자분들에게 추천하고 싶은 책입니다.

 

모던 자바스크립트로 배우는 리액트 입문은 딱 제목에서도 써 있듯이 입문용 책이다.

모던 자바스크립트로 배우는 리액트 입문 표지

순수 백엔드 개발만 개발했던 사름들과 같이 웹개발이 아닌 다른 개발을 해오던 사람들에게 리액트를 공부하라고 하면 큰 장벽이 느껴질 수 있다.

그 이유 중에서 아무래도 자바스크립트에 대한 큰 이해도 없이 바로 리액트를 개발하려다 보니 어렵게 느껴지는 점이 컸을 거라고 생각한다. (나 또한 그랬던 경험이 있다...)

 

그런 점에서 이 책은 굉장히 기본적인 자바스크립트의 내용을 다루면서 시작하여 리액트의 기본적인 개념들을 익혀나가는 순서로 진행되어진다.

 

위의 목차처럼 기본적인 자바스크립트 내용들부터 시작해서 리액트의 기본적인 내용들을 하나씩 다 익혀나갈 수 있는 커리큘럼으로 잘 짜여진 책이다.

또한 흑백이 아닌 올 컬러에 가상의 인물 세명을 등장시켜서 대화의 형식으로 내용들을 잘 정리한 부분이 독특하면서도 한편으로는 알기 쉽게 설명하기 위해서 잘 표현한 것 같다는 생각이 들었다.

단원별 배울 내용을 대화 형식으로 미리 정리
주요 정의들을 정리

하지만 아쉽게도 책 제목과 책의 두께에서도 충분히 유추할 수 있듯이 실무에 바로 적용해서 사용할 수 있을 정도의 깊이있는 내용까지는 들어가지 않아서 이미 리액트에 대해서 어느정도 맛본 경험이 있는 사람들이 보기에는 거리가 있는 책이라고 생각한다.

 

그래도 리액트란 어떤 것인가? 궁금하거나 리액트를 처음해보기에 앞서 기본적인 내용들을 익히고 싶은 사람들에게는 매우 쉬우면서도 부담없이 읽을 수 있는 좋은 책이라고 생각한다.

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

 

IMG_0577 중간.png

 

프론트 개발은 React, Vue 등 SPA(Sigle Page Application) 페러다임을 따르고 있는 프레임워크가 대세를 이루고 있다.하지만 이러한 프레임워크도 기본적으로는 자바스크립트를 기본에 두고 있다. 그렇기 때문에 자바스크립트를 모르는 상태에서 React 또는 Vue를 학습하는 것은 매우 어렵다고 할 수 있다. 

 

커뮤니티에서 리액트를 배우기 어려워하는 이들의 이야기를 듣고 상담하던 중 두 가지 공통점을 발견하게 되었습니다. 

 

이 책은 특이하게도 신입 사원과 선배 개발자의 대화 형식의 내용으로 쳅터를 통해 내용을 진행시키고 있다.그에 따라 처음 1~4 챕터까지는 자바스크립트의 역사, webpack, babel등의 내용과, 모던자바스크립트에 대한 내용을 다루며 React에 대한 것은 챕터 5부터 내용이 시작된다.

이 책은 초급개발자를 위한 책으로 자바스크립트 및 React를 완벽히 배우는 것은 당연히 무리이다. 하지만 프론트앤드 개발자로서의 진입 장벽을 낮춰 주는 역할을 충분히 할수 있을 것으로 생각한다.

 

 

 

리액트 맛보기를 위한 책, 모던 자바스크립트로 배우는 리액트 입문

 

먼저 쓰는 서평

자바스크립트를 입문한 사람이 리액트를 입문해보려는 사람들에게 딱 적합한 책이다. 리액트 맛보기를 위한 입문서라서 리액트를 이미 맛본 사람이거나, 이를 실무 프로젝트에 적용하려고 하거나, 이미 적용된 실무 프로젝트에 적용하려는 사람에게는 적합하지 않다.

 

책의 구성

 

1. 모던 자바스크립트 내용

2. 리액트

3. 타입스크립트

 

책은 3가지 내용으로 구성되어 있다. 주 학습 내용인 리액트와 이를 받쳐주기 위한 모던 자바스크립트, 타입 스크립트에 대한 내용을 다루고 있다. 모던 자바스크립트에 익숙한 사람이라면 리액트 챕터 1~3의 내용은 가볍게 읽고 빠르게 넘어가고, 이후 챕터부터 집중해서 읽어나가는 방식을 추천한다.

 

입문자를 위한 친절한 디자인

입문서이기 때문에, 책의 디자인도 입문자를 상당히 신경써준 것 같다. 예제 코드만 보아도, 흑백 글씨에 몇 줄의 주석으로 되어 있는 것이 아니라 컬러 테마를 적용했고, 코드에 대한 주석과 코드 블럭에 대한 설명들이 함께 있어 도움이 될 것 같다.

 

또한, 입문자들이 예제 프로젝트 구성 과정에서 어려울 수 있는 패키지 설치 및 설정과, 프로젝트의 디렉토리 구성에 대해서도 중간중간 짚고 넘어가기 때문에 최소한 예제 수행 과정에서는 장애물이 없도록 유도하고 있다.

 

'도와주세요 선배님!'이라는 항목으로, 어떤 개념에 대한 질문을 추가적으로 설명해주는 내용도 함께 있어서, 학습 중에 궁금할 수 있는 내용들에 대해 추가 설명을 대화하는 형태로 알려주고 있다.

 

 

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

"한빛미디어 <나는 리뷰어다> 활동을 위해서 책을 제공받아 작성된 서평입니다." 모던 자바스크립트로 배우는 리액트입문은 표지에 있는 사람 캐릭터덕분에 예상되듯이 캐릭터들이 대화를 나누며 에피소드를 진행하는 듯한 형식으로 진행된다 대략 리액트 경력있는 선임개발자, 리액트 경력이 없는 경력개발자, 신입개발자 삼파전으로 이루어져있는데 아무래도 경력없는 개발자나 신입개발자나 같은 역할로 보인다 본 서적은 정말 입문자에 초점을 맞추고 있어서 바로 리액트를 설명하지않는다 기본적인 DOM에 대한 설명과 DOM을 다루는 자바스크립트 문법으로 처음을 시작한다 그리고 모던자바스크립트를 간단히 설명하며 익히게 도와주고 4장에 들어서야 리액트의 기본을 설명하기 시작한다 리액트의 설명이 시작되어도 처음부터 무겁지않게 가볍게 설명을 한 뒤 주요한 부분들을 뒤의 챕터들로 할애하여 좀 더 깊이있게 설명해준다 보면서 문법등을 읽힐 때 처음부터 설명의 나열과 일단 나오면 ”이건 다 알아야지“를 지양하고 “일단 이런,이런게 있어 자세한건 뒤에 더 자세히 알려줄께”의 느낌이라 꽤 상냥하고 읽기쉽게 되어있다는 생각이 들었다 책도 가볍거니와 리액트를 이제 시작하려는 사람에겐 안성맞춤인 책이었다

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

 

이 책에서 표지를 보고 생각했던 내용은 리액트 중심이었지만,

그것보다는 조금 더 초보자들이기 접근하기 쉽도록 자바스크립트

(정확하게는 ES6이상의 문법을 중심으로)부터 시작하는 책입니다.

 

그러나 기본적인 제어문법 등도 포함되어 있어

완전한 초보자에게 맞추는 것도,

그렇다고 온전히 프론트엔드적인 지식이 있는 사람이

보기엔 조금은 애매한 면이 있는 그 사이 어딘가의 수준입니다.

 

따라서 기본적인 웹에대한 개발 지식은 가지고 있지만

ES6 및 리액트를 통한 SPA개발에는 경험이 없거나

부족하신 분들이 처음에 시작하기에 좋은 책으로 보입니다.

 

개인적으로는 리액트와 접점은 많았지만 정석대로 공부를 하지 않고

두리뭉술하게 아는 부분 등을 아주 간단한 예시부터 빌드업을 해가며

리액트를 다룸에 있어 가장 중요한 핵심 개념을

하나씩 부러트려 나가는 부분이 굉장히 만족스러웠습니다.

 

CSS나 global state관련 라이브러리도

한가지 라이브러리만으로 접근하는게 아닌

리액트에서 사용하기에 좋은 다양한 선택지를 제시하고 

일종의 가이드라인을 제공하기 때문에 

굉장히 실무적인 접근이 돋보이는 책입니다. 

 

그럼에도 불구하고 

깊이가 깊진 않고 개발자가 어떤 것을 알아야하나 라는 질문에 대하여 

"이런게 있으니 이런걸 공부해보시는건 어떤가요"라고 

제시하는 정도의 내용이 주이므로 참고하시기 바랍니다.

 

e082530846_1.jpeg

 

스크린샷 2022-11-26 오후 2.01.34.png

 

스크린샷 2022-11-26 오후 2.02.13.png

 

리액트가 어려운 이유는 자바스크립트에 대한 이해가 부족하기 때문일 수 있다.

 

리액트 학습에 어려움을 느끼는 사람들은 대부분 자바스크립트에 대한 이해가 부족하다. 예를 들어 가상 DOM, 모듈 핸들러, 분할 대입, 스프레드 구문, 화살표 함수 가운데 하나라도 제대로 알지 못한다면 리액트를 공부하더라도 이해하기 어려울 수 있다. 그래서 이 책은 리액트를 배우기 어려운 이유를 잘 알고 있는 저자가 썼다. 모던 자바스크립트 기초를 익히고 리액트를 배우면 분명 전과는 다른 세상이 보일 것이다.

 

모던 자바스크립트로 배우는 리액트 입문책은 유데미에서 강의하고 최고 평가를 얻은 두 개의 리액트 코스를 요약하여 내용을 추가, 수정해서 썼다. 등장인물의 대화를 사이사이 추가한 이야기 형식으로 입문자도 더욱 쉽게 학습할 수 있도록 쓰여있다. 현장에서 실제로 경험한 내용도 포함되어 있으니 프로그래밍 업계에 몸담고자 하는 분들도 재미있게 읽을 수 있다. 

 

대상 독자

- 리액트 입문자

- 자바스크립트도 리액트도 어려운 프론트엔드 개발 입문자

- 기존 자바스크립트에서 모던 자바스크립트로의 변화가 궁금한 개발자

- 모던 프론트엔드의 개요를 파악하고 싶은 백엔드 또는 인프라 개발자

 

 

모던 자바스크립트로 배우는 리액트 입문책에서 다루는 내용

- 모던 자바스크립트 기초

- 모던 자바스크립트 기능 익히기

- 자바스크립트에서 DOM 조작

- 리액트 기본

- 리액트와 CSS

- 재렌더링 구조와 최적화

- 글로벌 State 관리

- 리액트와 타입스크립트

- 사용자 정의 훅

- 리액트x타입스크립트 실전 연습

 

모던 자바스크립트로 배우는 리액트 입문책은 각 장 도입 부분의 Episode에서 먼저 배울 내용을 대화 형식으로 익힌다. 또한 서식으로 기본 구문을 한눈에 알아볼 수 있는 장점이 있다. 

 

 

1~3장에서는 리액트를 공부하기 전에 알아야 할 자바스크립트 기초를 배운다.

리액트를 포기하지 않고 학습하기 위해서는 이 부분이 매우 중요하다.

4장부터는 리액트 기본, 리액트에서 CSS 다루기, 재렌더링, 글로벌 State 관리, 리액트 개발에 타입스크립트 사용하기 등 리액트 개발에 필요한 지식을 소개한다.

 

예제 소스: https://github.com/moseskim/book-react-code

 

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

 

리액트입문.jpg

 

 

얼마 전에 앱 쪽으로 개발을 할 기회가 있어서 리액트를 다뤄볼 기회가 있었습니다. 개발 기간이 짧고 백엔드 쪽 업무가 주였기 때문에 기술 문서만 간단히 참고해서 필요한 부분만 개발했었는데, 아쉬움이 있긴 했습니다. 이번에 이 책을 만나게 된 건 그때의 아쉬움을 풀어버릴 운명이었기 때문이 아닐까 오버해서 생각이 들었습니다.

저자는 자바스크립트 자체의 이해 부족과 잘못된 학습 순서가 리액트 학습을 하는데 진입 장벽이 된다고 보고 있습니다. 그래서 이 책은 주로 모던 자바 스크립트의 개발 환경, 새로운 문법, 리액트가 동작하는 구조 등의 내용을 간략하고 명쾌하게 설명하는 데 주안을 두고 있습니다. 에피소드를 중심으로 그 장의 주제가 왜 필요하고 어떻게 하면 되는지의 구조로 각 장의 의존 관계를 구성해둬서 학습의 필요성과 의욕을 높여주는 효과가 있습니다.

처음에는 자바스크립트 언어 자체의 내용이 아니라 이를 이용해서 개발할 때 필요한 개념이나 도구의 사용법과 필요성을 소개로 시작합니다.

그다음 바로 모던 자바스크립트에서 도움한 유용한 문법을 중심으로 설명합니다. 레거시에서 모던 자바스크립트로 진입했을 때 당황하게 만들 수 있지만 편리한 새로운 기능들을 압축, 설명을 해서 이 기능을 머릿속에 다시 정립하는 데 도움이 되었습니다.

자바스크립트에서 DOM을 조작하는 방법이 약간은 뜬금없이 나오는 게 아닌가 했는데, 이것은 왜 리액트가 필요한지를 보여주기 위한 내용이었습니다.

리액트를 다루기 위한 기본 개념과 문법을 이어서 설명합니다. 리액트의 기초부터 다루지 않고, 리액트로 개발하기 위한 필요한 핵심 기념들을 압축해서 설명하고 있어 빠르게 정리해 볼 수 있었습니다.

리액트에서 CSS를 적용할 수 있는 방법들에 대해 정리해놓은 장에 도달하게 됩니다. 다양하게 CSS를 적용할 수 있는 방법들을 나열하고, 간략하게 사용하는 방법을 정리해 두고 있어서, 추후에 이 방법들 중 선택을 하게 될 상황에서 유용할 것 같습니다.

리액트 사용하는 데만 급급해서 지나칠 수도 있는 재렌더링 구조와 최적화 방법에 대한 내용을 다루고 있습니다. 리액트 렌더링 과정에 대한 설명과 이를 효율적으로 처리할 수 있는 방법을 쉽게 설명하고 있습니다. 과거에 효율이라는 명분으로 과도하게 최적화하기 위한 기능들을 사용하는 면이 있었는데 오남용을 개선할 수 있는 인상 깊은 장이었습니다.

타입스크립트도 다루고 있습니다. 최근에 자바 스크립트로 개발하다가 타입스크립트로 막 전향한 상태라 관심이 많이 가는 장이었습니다. 깊이 있게 다루진 않지만 타입스크립트를 다뤄 본 사람이라면 빠른 시간에 내용을 다시 떠올려볼 수 있는 흥미로운 내용이었습니다.

사용자 정의 훅을 다루는 내용을 통해서 기본 훅을 이용해서 좀 더 복잡한 로직을 사용자 훅으로 구성할 수 있는 방법을 알 수 있습니다. 이를 통해 실제 렌더링 되는 부분과 비즈니스 로직 부분을 분리할 수 있도록 해서 컴포넌트의 재사용을 높일 수 있습니다.

평소에 관심이 많이 가는 분야이기도 했지만 내용도 쉽고 짜임새 있게 구성을 해서 시간 가는 줄 모르고 단숨에 읽어버린 재미있는 책이었습니다.

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

 

# 정말 리액트가 처음이라면

입문자라면, 그냥 이 책을 읽어보기 바란다. 개인적으로 몇 권인가 리액트 관련 서적을 접해본 결과 학습능력이 좋지 않다는 슬픈 현실과 직면하게 되면서 직시하게 된 현실은 책을 보면서 혼자 하기엔 이해도가 많이 낫다는 것을 체감할 수 있었다. 아, 물론 일반적인 개념은 이해를 하고 있다. 개념은.. 정작 작업을 해야 할 때는 개념에 대한 이해가 아니라 코딩 방법에 대한 이해가 필요하다는 것을 깨우칠 수 있었다.

# 모던 자바스크립트로 배우는 리액트 입문

모던 자바스크립트로 배우는 리액트 입문은 말 그대로 입문서이기 때문에 많은 부분에서 요약된 느낌으로 쉽게 리액트의 개념을 익힐 수 있기를 바라며 나온 책으로 교과서처럼 리액트를 다루는데 꼭 필요한 자바스크립트부터 시작해서 리액트까지 차근차근 진행되는 구조를 가지고 있다. 기초가 필요한 독자에게 좋을 것 같다.

원서, 모던 자바스크립트의 기본부터 시작하는 리액트 실전의 교과서(モダンjavascriptの基本から始める react実践の教科書)는 아마존의 집계가 책의 평가를 좌우할 명확한 기준이 될 수는 없겠지만, 현시점 200여개의 리뷰에서 5점 중 4.3의 나쁘지 않은 평가를 받고 있는데 전반적으로 읽기 쉽고 입문자에게 최적화된 문장을 사용한다고 평하고 있었다. 리액트가 어떤 식으로 동작하는지 그리고 어떤 개념을 가지고 있어야 하는지 체험할 수 있는 책이라 생각된다.

리액트는 여타 웹 개발과 마찬가지로 HTML, CSS를 빼고 개발을 진행할 수 없기 때문에 사용가능한 CSS에 대해서도 다루고 있고 몇몇 라이브러리의 장단점, 도입 방법들도 다루고 있기 때문에 현존하는 라이브러리들에 대한 공부도 가능해서 좋았던 것 같다. 또한 최근에는 소위 차세대 프로젝트라 불리는 뷰, 리액트를 사용하는 프로젝트들에서 타입 스크립트를 많이 사용하고 있어서인지 책에서도 타입 스크립트에 대해 다루고 있어 개념을 이해하는데 도움을 받을 수 있었다.

본격적으로 공부하기 전에 리액트에 대해 전반적으로 기본적인 지식들을 알아두고 싶을 때 보면 좋은 책이라 생각된다.

# 후기

아직도 용어에는 익숙해지지 않는다. 단어를 통해 얼추 유추가 간혹하지만, 정확한 의미가 와닿지 않는다고 할까. 실무에서 리액트를 다루고 있는 사람의 평가가 궁금하다. 모던 자바스크립트로 배우는 리액트 입문은 리액트를 처음 접하는 입문자나 초급자가 개념을 잡는데 좋은책은 아닐까 생각된다. 아쉬운 점이 있다면 원서가 21년 9월에 나온 걸 감안해야 한다는 점으로 1년 정도의 시간이 경과되고 번역서가 나온 탓에 리액트의 버전업과 매칭 되지 않는 부분이 있다 정도로 기본기를 익히는 데는 문제가 없다 생각된다

오랜만에 책 리뷰로 돌아왔습니다.

이번 리뷰는 모던 자바스크립트로 배우는 리액트 입문입니다.

 

우선 저자가 일본인이다. 자케(오카다 다쿠미)!!

표지 일러스트부터 애니메이션 느낌이 나면서 딱딱한 일반 개발 서적과는 다른 느낌이다.

제목에도 입문이 들어가니 더 쉽고 가볍게 읽을 수 있는 느낌이다.

마지막으로 컬러북이다!

 

다른 책들과 마찬가지로 모던 자바스크립트(ES6)를 먼저 설명하고 그다음 리액트를 알려준다.

하지만, 다른 점은 표지에 있던 일러스트들의 인물들이 등장한다.

등장인물들이 회사에서 일어나는 에피소드를 바탕으로 공부하게 만든다.

만화책 읽듯이 쉽게 배울 수 있다.

 

여러 리액트책을 읽어봤지만, 이 책으로 시작한 다음 흥미를 느끼고 더 전문적인 책을 보는 것을 추천한다.

 

책에서 본 간단하고 이해하기 쉬운 설명 몇개를 예제로 이 리뷰를 마무리하겠다.

 

가상 DOM은 실제 DOM과의 차이를 비교하고 변경된 부분만을 실제 DOM에 반영함으로써 DOM 조작을 최소한으로 줄일 수 있습니다.

 

모듈 핸들러에 대한 설명에서는 개발할 때와 프로덕션 환경에 대한 이야기를 합니다.

개발할 때는 자바스크립트를 세세하게 나누어 개발하는 것이 효율적이고 생산성이 높다. 하지만 프로덕션 환경에서는 실행할 때는 파일을 나눌 필요가 없다.  오히려 로딩 횟수가 늘어나 성능이 저하되기도 한다.

개발할 때는 파일을 나누고 프로덕션용으로 빌드할 때는 파일 하나에 모으기 위해 js파일이나 css파일 등을 한데 합치는 모듈 핸들러가 만들어졌습니다.

 

중요한 부분은 파란색 배경색으로 줄을 쳐놨으니 흡사 기출문제 같다.

책을 보고 이 부분만 기억해도 이 책의 역할을 충분히 한 것으로 보면 된다.

 

한빛미디어에서 <나는 리뷰어다>를 통해 책을 지원받아 작성한 리뷰입니다

 

내용이 쉽게 설명되어있어서 책장이 잘 넘어갔습니다. 

편집도 마음에 들어요. 

부록/예제소스
자료명 등록일 다운로드
DOWNLOAD 예제소스 2022-12-08 다운로드
결제하기
• 문화비 소득공제 가능
• 배송료 : 2,000원배송료란?

배송료 안내

  • 20,000원 이상 구매시 도서 배송 무료
  • 브론즈, 실버, 골드회원이 주문하신 경우 무료배송

무료배송 상품을 포함하여 주문하신 경우에는 구매금액에 관계없이 무료로 배송해 드립니다.

닫기

도서판매처

리뷰쓰기

닫기
* 도서명 :
모던 자바스크립트로 배우는 리액트 입문
* 제목 :
* 별점평가
* 내용 :

* 리뷰 작성시 유의사항

글이나 이미지/사진 저작권 등 다른 사람의 권리를 침해하거나 명예를 훼손하는 게시물은 이용약관 및 관련법률에 의해 제재를 받을 수 있습니다.

1. 특히 뉴스/언론사 기사를 전문 또는 부분적으로 '허락없이' 갖고 와서는 안됩니다 (출처를 밝히는 경우에도 안됨).
2. 저작권자의 허락을 받지 않은 콘텐츠의 무단 사용은 저작권자의 권리를 침해하는 행위로, 이에 대한 법적 책임을 지게 될 수 있습니다.

오탈자 등록

닫기
* 도서명 :
모던 자바스크립트로 배우는 리액트 입문
* 구분 :
* 상품 버전
종이책 PDF ePub
* 페이지 :
* 위치정보 :
* 내용 :

도서 인증

닫기
도서명*
모던 자바스크립트로 배우는 리액트 입문
구입처*
구입일*
부가기호*
부가기호 안내

* 온라인 또는 오프라인 서점에서 구입한 도서를 인증하면 마일리지 500점을 드립니다.

* 도서인증은 일 3권, 월 10권, 년 50권으로 제한되며 절판도서, eBook 등 일부 도서는 인증이 제한됩니다.

* 구입하지 않고, 허위로 도서 인증을 한 것으로 판단되면 웹사이트 이용이 제한될 수 있습니다.

닫기

해당 상품을 장바구니에 담았습니다.이미 장바구니에 추가된 상품입니다.
장바구니로 이동하시겠습니까?

자료실