확장메뉴
주요메뉴


소득공제 베스트셀러
미리보기 공유하기

소플의 처음 만난 리액트

: 리액트 기초 개념 정리부터 실습까지

소문난 명강의 시리즈이동
리뷰 총점9.6 리뷰 40건 | 판매지수 5,517
베스트
웹사이트 37위 | IT 모바일 top100 8주
명화를 담은 커피, 가을을 닮은 책 - 명화 드립백/명화 캡슐 커피/명화 내열 유리컵+드립백 세트/매거진 랙
[IT 기획전] IT, 모두의 교양
9월의 얼리리더 주목신간 : 웰컴 투 북월드 배지 증정
[대학생X취준생] 꼭 공부를 해야 할 상황이라면? 2학기, 공부할 결심!
박해선 저자의 머신러닝/딥러닝 패스
[단독]『혼자 공부하는 파이썬』 개정판 출간
내일은 개발자! 코딩테스트 대비 도서전
[단독] 에듀윌 IT 자격증 기획전 - 가장 빠른 합격출구 EXIT
소장가치 100% YES24 단독 판매 상품
YES24 트윈링 분철 : 인서트라벨/스티커 택1 증정
9월 전사
쇼핑혜택
1 2 3 4 5

품목정보

품목정보
출간일 2022년 05월 31일
쪽수, 무게, 크기 504쪽 | 902g | 183*235*20mm
ISBN13 9791162245682
ISBN10 1162245689

책소개 책소개 보이기/감추기

리액트 기초 개념을 배우고 간단한 실습을 따라 하며
사용법을 익히는 가장 쉬운 입문서


이 책은 오픈소스 자바스크립트 라이브러리인 리액트를 처음 배우는 개발자를 위한 책이다. 먼저 웹 서비스를 위해 알아야 할 리액트의 필수 개념을 짚어 본다. 그리고 간단한 실습을 통해 리액트 사용법을 익힌 뒤 마지막으로 미니 프로젝트(미니 블로그 만들기)를 통해 직접 프로젝트 기획부터 개발까지 경험해 본다. 리액트의 핵심 개념을 기초부터 탄탄히 익히고 실제 업무에 도움을 줄 수 있는 프로젝트 진행을 통해 체계적인 학습을 할 수 있도록 구성했다.

목차 목차 보이기/감추기

0장 준비하기

0.1 HTML 살펴보기
0.2 CSS란 무엇인가?
0.3 자바스크립트
0.4 개발 환경 설정하기
0.5 마치며

1장 리액트 소개

1.1 리액트는 무엇인가?
1.2 리액트의 장점
1.3 리액트의 단점
1.4 마치며

2장 리액트 시작하기

2.1 HTML만으로 간단한 웹사이트 만들기
2.2 CSS를 사용하여 웹사이트 스타일링하기
2.3 웹사이트에 React.js 추가하기
2.4 create-react-app
2.5 마치며

3장 JSX 소개

3.1 JSX란?
3.2 JSX의 역할
3.3 JSX의 장점
3.4 JSX 사용법
3.5 JSX 코드 작성해 보기
3.6 마치며

4장 엘리먼트 렌더링

4.1 엘리먼트에 대해 알아보기
4.2 엘리먼트 렌더링하기
4.3 렌더링된 엘리먼트 업데이트하기
4.4 시계 만들기
4.5 마치며

5장 컴포넌트와 Props

5.1 컴포넌트에 대해 알아보기
5.2 Props에 대해 알아보기
5.3 컴포넌트 만들기
5.4 컴포넌트 합성
5.5 컴포넌트 추출
5.6 댓글 컴포넌트 만들기
5.7 마치며

6장 State와 생명주기

6.1 State
6.2 생명주기에 대해 알아보기
6.3 State와 생명주기 함수 사용하기
6.4 마치며

7장 훅

7.1 훅이란 무엇인가?
7.2 useState
7.3 useEffect
7.4 useMemo
7.5 useCallback
7.6 useRef
7.7 훅의 규칙
7.8 나만의 훅 만들기
7.9 훅을 사용한 컴포넌트 개발
7.10 마치며

8장 이벤트 핸들링

8.1 이벤트 처리하기
8.2 Arguments 전달하기
8.3 클릭 이벤트 처리하기
8.4 마치며

9장 조건부 렌더링

9.1 조건부 렌더링이란?
9.2 엘리먼트 변수
9.3 인라인 조건
9.4 컴포넌트 렌더링 막기
9.5 로그인 여부를 나타내는 툴바 만들기
9.6 마치며

10장 리스트와 키

10.1 리스트와 키란 무엇인가?
10.2 여러 개의 컴포넌트 렌더링하기
10.3 기본적인 리스트 컴포넌트
10.4 리스트의 키에 대해 알아보기
10.5 출석부 출력하기
10.6 마치며

11장 폼

11.1 폼이란 무엇인가?
11.2 제어 컴포넌트
11.3 textarea 태그
11.4 select 태그
11.5 File input 태그
11.6 여러 개의 입력 다루기
11.7 Input Null Value
11.8 사용자 정보 입력받기
11.9 마치며

12장 State 끌어올리기

12.1 Shared State
12.2 하위 컴포넌트에서 State 공유하기
12.3 섭씨온도와 화씨온도 표시하기
12.4 마치며

13장 합성 vs. 상속

13.1 합성에 대해 알아보기
13.2 상속에 대해 알아보기
13.3 Card 컴포넌트 만들기
13.4 마치며

14장 컨텍스트

14.1 컨텍스트란 무엇인가?
14.2 언제 컨텍스트를 사용해야 할까?
14.3 컨텍스트를 사용하기 전에 고려할 점
14.4 컨텍스트 API
14.5 여러 개의 컨텍스트 사용하기
14.6 useContext
14.7 컨텍스트를 사용하여 테마 변경 기능 만들기
14.8 마치며

15장 스타일링

15.1 CSS
15.2 styled-components
15.3 styled-components를 사용하여 스타일링해 보기
15.4 마치며

16장 미니 프로젝트_미니 블로그 만들기

16.1 미니 블로그 기획하기
16.2 프로젝트 생성하기
16.3 필요한 패키지 설치하기
16.4 주요 컴포넌트 구성하기
16.5 폴더 구성하기
16.6 UI 컴포넌트 구현하기
16.7 List 컴포넌트 구현하기

저자 소개 (1명)

출판사 리뷰 출판사 리뷰 보이기/감추기

기초적인 내용 위주로 빠르고 쉽게 만나는 리액트!

리액트는 오픈소스 자바스크립트 UI 라이브러리입니다. 최근 웹사이트(또는 웹 애플리케이션)의 규모가 커짐에 따라 수많은 페이지를 만들어 관리하는 것은 매우 어렵습니다. 따라서 복잡한 웹사이트를 쉽고 빠르게 구현 및 관리할 수 있도록 도와주는 것이 리액트입니다. 이 책은 리액트의 주요 개념을 익히고 간단한 실습을 통해 실제 웹사이트에 리액트를 적용해 보며 학습할 수 있도록 구성되어 있습니다.

★ 이 책에서 배우는 내용

· 필요한 기초 지식 및 개발 환경
· 리액트 소개 및 준비
· JSX
· 엘리먼트 렌더링
· 컴포넌트와 Props
· state와 생명주기
· 훅
· 이벤트 핸들링
· 조건부 렌더링
· 리스트와 키
· 폼
· State 끌어올리기
· 합성과 상속
· 컨텍스트
· 스타일링
· 미니 블로그 만들기

★ 이 책의 구성

0장은 리액트를 배우기 전에 알아야 할 기초 지식과 실습을 진행할 개발 환경 설정에 대해 설명합니다. 1~2장은 리액트의 기본 개념과 장단점에 대해 배우고 간단한 실습을 통해 리액트를 적용해 봅니다.

3장부터 14장까지는 리액트의 각 요소별 기능에 대해 설명합니다. 각 챕터의 전반부는 해당 챕터에서 배우고자 하는 리액트의 각 요소별 기본 개념을 설명합니다. 해당 챕터의 후반부에는 앞에서 배운 기본 내용을 바탕으로 실습을 통해 실제 리액트 사용법을 익히는 학습 형태로 구성되어 있습니다.

15장에서는 스타일링을 하기 위해 CSS의 기본적인 문법과 선택자에 대해 배우고 styled-components를 다루는 법을 간단하게 배웁니다.

16장에서는 앞에서 배운 내용을 토대로 미니 블로그를 직접 만들어 봅니다. 프로젝트 생성부터 각종 컴포넌트를 모두 직접 코드를 작성하며 개발해 봅니다.

★ 대상 독자

이 책은 리액트를 처음 접하는 입문자를 대상으로 합니다. HTML과 자바스크립트를 다뤄본 경험이 있다면 수월하게 이 책의 과정을 따라갈 수 있습니다. 이와 같은 웹 개발을 위한 기초 내용을 배운 적이 없거나 웹 개발 경험이 없더라도 이 책의 학습 과정을 따라갈 수 있도록 HTML과 자바스크립트, CSS의 기초적인 내용을 설명하고 있습니다.

★ 예제 소스

https://github.com/soaple/first-met-react-practice

★ 유튜브 강의

https://youtube.com/c/소플TV

추천평 추천평 보이기/감추기

리액트가 웹 프런트엔드 분야에서 사실상 하나의 표준으로 자리 잡으면서 배우고자 하는 사람들도 크게 늘어나고 있습니다. 이 책은 처음 리액트를 배우고자 하는 독자에게 매우 적합하다고 생각합니다. 코딩에 뛰어난 사람이 아니더라도 처음부터 단계별로 따라 하다 보면 어느새 리액트를 자유자재로 활용할 수 있는 단계에 도달하게 될 것입니다. 리액트라는 세계에 입문하는 것에 약간 두려움을 느끼고 있다면 이 책을 통해 리액트 학습을 시작해 보기 바랍니다.
- 이민규 ((주)엠케이랩스 대표, StarUML 개발자)

리액트 개발을 시작하거나 다시 도전하는 독자에게 추천합니다. 개발 환경 설정부터 현업에서 쓸 수 있는 개발 팁 그리고 최신 트렌드까지 배울 수 있는 입문서입니다.
리액트의 중요한 개념을 모두 다루고 있고 챕터별로 요점 정리가 잘 되어 있어서 코딩 인터뷰를 보러 가기 전에 빠르게 복습하기에도 좋을 것 같습니다. 다년간 현업에서의 경험을 기반으로 한 저자의 현실적인 조언과 내공이 돋보입니다.
- 김유민 (Take App 창업자, 전 페이스북 엔지니어링 매니저)

개발을 잘하는 것과 개발을 잘 알려주는 것을 모두 할 줄 아는 개발자가 쓴 책을 찾기란 생각보다 쉽지 않습니다. 상용 서비스 개발, 오픈소스 프로젝트 활동, 강의, 멘토링 등 다양한 방면에서 두 가지를 동시에 병행하고 있는 저자의 책이라면 리액트를 처음 접하고 시작하는 데 좋은 지침이 될 것이라 믿어 의심치 않습니다. 읽어보니 실제로 그랬습니다!
- 장래영 ((주)커먼컴퓨터 소프트웨어 엔지니어)

리액트를 이용해 프런트엔드 개발자로서 첫발을 내딛고자 하는 독자에게 추천하고 싶은 훌륭한 안내서입니다. 빠르게 리액트 개발을 시작할 수 있도록 지루하거나 많이 쓰지 않는 내용은 과감히 제외하고 컴포넌트와 State, 훅, 이벤트 핸들링 등 자주 사용되고 필수적으로 알아야 할 내용만을 압축해서 설명합니다. 중간중간 독자가 궁금해할 만한 부분에 대해 추가적으로 설명하고 있어 누구나 충분히 따라올 수 있도록 배려한 저자의 친절함이 느껴집니다. 챕터마다 다양한 실습 예제와 깔끔하게 정리된 요약을 제공하여 개념을 올바르게 이해하고 있는지 확인할 수 있도록 해 줍니다. 리액트 개발의 문턱이 높게 느껴지는 분들, 도전을 망설이고 있는 분들에게 추천합니다.
- 장영재 (KAIST, 소프트웨어 엔지니어)

리액트 개발에 입문하는 독자에게 잘 맞춘 책입니다. 전반부에는 프런트엔드 개발에 필요한 방대한 지식 중 리액트 개발에 필요한 핵심 개념을 전달하고 있습니다. HTML, CSS, 자바스크립트와 같은 필수 지식을 거쳐서 리액트가 무엇이고 어떻게 동작하는지, 왜 사용하는지를 쉽게 풀어썼습니다. 또한 리액트에 입문할 때 시행착오를 겪을 수 있는 조건부 렌더링이나 리스트 렌더링, 리액트 훅에 대한 부분도 다루고 있습니다. 각 챕터는 개념을 익히는 부분과 실습 부분으로 나누어져 있는데 앞에서 잘 이해되지 않는다면 실습을 해 보면서 감을 잡을 수 있게 구성되어 있습니다. 전반적으로 부담 없이 따라갈 수 있어 리액트 개발을 처음 시작하시는 분에게는 좋은 입문 서적이 될 수 있을 것입니다.
- 강지현 ((주)맘편한세상 공동 창업자, 백엔드 엔지니어)

비 개발자가 쉽게 이해할 수 있고 접근할 수 있도록 충분한 예제와 설명이 가득합니다.
특히 개발 환경 구축을 비 개발자는 익숙하지 않고 어려워하는데 이러한 부분도 세심하게 다루고 있습니다. HTML과 CSS에 대한 배경지식을 어느 정도 가지고 있는 분이라면 이 책을 통해 충분히 리액트에 대한 매력에 흠뻑 빠질 수도 있을 것입니다. 또한 지금과는 다른 제품을 구상할 수 있는 기회를 얻을 수 있다고 생각합니다. 개발자와 함께 협업을 진행하는 디자이너 또는 기획자들에게도 이 책을 추천합니다.
- 이유번 ((주)딥네츄럴 디자인 디렉터)

이 책은 예시와 예제 위주로 이해하기 쉽게 기술하고 있습니다. 웹 개발자가 아닌 탓에 리액트를 제대로 사용해 본 적이 없어서 뒷부분으로 갈수록 조금 어렵게 느껴졌지만 리액트에 대한 방대한 내용을 어렵지 않게 설명해 주고 있습니다. 덧붙여 저는 이해하며 공부하는 것을 좋아해서 예제 위주의 책보다는 원리, 개념 위주의 책을 더 선호하는 편인데 다른 리액트 개념서의 경우 어려운 설명 때문에 리액트 공부는 반쯤 포기했었습니다. 그런데 이 책은 다양한 실습과 마지막 장에는 알찬 프로젝트까지 포함하고 있어 리액트에 대해 재미있게 공부할 수 있었습니다. 웹 개발에 대한 지식이 없어도 차근차근 단계를 밟아가며 쉽게 학습할 수 있었으므로 리액트 입문용으로 최고의 책이라 생각합니다.
- 강경완 ((주)우아한형제들 안드로이드 개발자)

이제 리액트는 웹은 물론 데스크톱과 모바일 앱 제작에도 쓰이는 강력한 라이브러리로 자리 잡았습니다. 워낙 많은 기능을 담고 빠르게 발전해 온 만큼 처음 리액트를 접하면 인터넷상의 불친절하게 던져진 방대한 자료에 압도되기 쉽습니다. 긴 시간 리액트 프로젝트를 진행한 저자의 경험을 바탕으로 리액트를 소화하기 위해 반드시 알아야 하는 기본 개념부터 실습 프로젝트까지 차곡차곡 쉬운 언어로 전달하고 있습니다. 물 흐르듯 이어지는 설명을 따라가다 보면 어느새 리액트를 소화하고, 그 매력에 빠진 자신을 발견할 수 있을 것입니다.
- 전웅 ((주)아씨오 소프트웨어 엔지니어)

회원리뷰 (40건) 리뷰 총점9.6

혜택 및 유의사항?
구매 소플의 처음 만난 리액트 내용 평점5점   편집/디자인 평점5점 하**랑 | 2022.09.24 | 추천0 | 댓글0 리뷰제목
자바 13년차 개발자로써, 요새 개발의 트랜드는 역시 리액트라고 생각이 듭니다. 리액트 관련해서 , 관련책을 찾아보던 도중, 초보자로써, 적당한 책이란 생각이 들어 구매했습니다. 상품평도 괜찮고, 무료 동영상 강의도 있어서, 초보자가 보기엔 딱 괜찮은 책이란 생각이 들었습니다. 아직 완독은 못했지만 현재로써는 만족하고 있습니다.;
리뷰제목

자바 13년차 개발자로써, 요새 개발의 트랜드는 역시 리액트라고 생각이 듭니다.

리액트 관련해서 , 관련책을 찾아보던 도중, 초보자로써, 적당한 책이란 생각이 들어 구매했습니다.

상품평도 괜찮고, 무료 동영상 강의도 있어서, 초보자가 보기엔 딱 괜찮은 책이란 생각이 들었습니다.

아직 완독은 못했지만 현재로써는 만족하고 있습니다.

댓글 0 이 리뷰가 도움이 되었나요? 공감 0
소플의 처음 만난 리액트 내용 평점5점   편집/디자인 평점5점 오*라 | 2022.07.10 | 추천0 | 댓글0 리뷰제목
* YES24 리뷰어클럽 서평단 자격으로 작성한 리뷰입니다.* 이 서평에는 해당 책의 내용이 다소 포함되어 있어 스포가 될 수 있습니다.이 책은 '리액트의 기초 개념과 정리부터 실습까지'라는 말이 어울리는 책으로 리액트나 프로그래밍을 처음 접하고, 배우려는 분들에게 추천한다.REACT NATIVE 등으로 앱에 대한 접근성, 효용성과 역사 등을 잘 설명해 놓았고, ES6의 최신 자바스크립트;
리뷰제목

* YES24 리뷰어클럽 서평단 자격으로 작성한 리뷰입니다.
* 이 서평에는 해당 책의 내용이 다소 포함되어 있어 스포가 될 수 있습니다.

이 책은 '리액트의 기초 개념과 정리부터 실습까지'라는 말이 어울리는 책으로 리액트나 프로그래밍을 처음 접하고, 배우려는 분들에게 추천한다.
REACT NATIVE 등으로 앱에 대한 접근성, 효용성과 역사 등을 잘 설명해 놓았고, ES6의 최신 자바스크립트 문법으로 구성되어 있어서 잘 배워두면 현업에서 적응하는 것도 무리가 없을 것 같다는 생각을 했다.
기본적인 뼈대와 스타일을 입히는 HTML , CSS 지식과 학습자를 위한 소스와 무료 동영상 강의도 마련되어 있어서, 강의를 이해하는 것에 큰 도움이 되었다. 그림 설명이 깔끔하고 글자도 강조해야 할 부분에 배치해 두어서 가독성이 높아 좋았다.
미니 프로젝트로 블로그 작성을 할 수 있는 것도 있어서 배우면서 따라 하고 또 응용도 해보면서 현업에서 쓰이는 부분들을 간접 경험할 수 있었고, 중급자 스킬까진 아니지만 기본적인 뼈대를 이해하고 응용하기에는 충분한 책이었다.
댓글 0 이 리뷰가 도움이 되었나요? 공감 0
[서평] 소문난 명강의 : 소플의 처음 만난 리액트 내용 평점5점   편집/디자인 평점5점 별**마 | 2022.07.10 | 추천0 | 댓글0 리뷰제목
자바스크립트에서 인기가 많은 라이브러리인 React는 블로그에 나와있는 개념들을 보며 공부해본 정도이지, 아직 책을 보거나 인강도 제대로 들어본 적은 없다. 단지 블로그에 있는 클론 코딩 예제를 보고 따라서 코딩을 해본 정도라서 개념을 제대로 익히지도 못했다. 이런 부족함을 채우기 위해 한껏 기대감을 품고서 이번에 받은 책을 읽었다. 한빛미디어에서 출판하는 '처음 만난 O;
리뷰제목

자바스크립트에서 인기가 많은 라이브러리인 React는 블로그에 나와있는 개념들을 보며 공부해본 정도이지, 아직 책을 보거나 인강도 제대로 들어본 적은 없다. 단지 블로그에 있는 클론 코딩 예제를 보고 따라서 코딩을 해본 정도라서 개념을 제대로 익히지도 못했다. 이런 부족함을 채우기 위해 한껏 기대감을 품고서 이번에 받은 책을 읽었다. 한빛미디어에서 출판하는 '처음 만난 OO 시리즈'는 저자들이 명료한 설명으로 입문자들이 쉽게 이해할 수 있도록 의도하고 지은 책들이라서 더 그런 것 같다.

 

처음에 자바스크립트 설명으로 시작하지만, 단지 개략적인 수준이라 자바스크립트에 대한 기본적인 지식을 갖춘 상태에서 이 책을 봐야 할 것이다. 다음 Chapter부터는 리액트에 대해서 매우 친절하게 설명한다. 리액트의 기초적인 개념을 쉽게 설명해주고 있는데다, 컬러 디자인 덕분에 읽기도 좋고 중요한 개념 설명과 도식들을 한 눈에 보기 좋다. 컬러풀한 그림이 많아서 개념 이해를 돕기 위해 많이 노력하고 있다는 생각이 들었다.

각 Chapter는 개념 정리, 실습, 마치며(요약)의 3단계로 구성되어 있고, 필요한 개념을 제대로 배울수 있도록 체계적으로 설명한다. 저자의 개념정리를 보면 입문자의 이해를 돕기 위해 얼마나 심혈을 기울여 쉽게 설명하고 정리했는지를 엿볼 수 있다.

전체적인 책의 내용 구성이 준비 -> 배우기 -> 실습하여 마무리 하는 큰 흐름으로 되어 있다.

 

동영상 강의를 시청하면 책을 통한 학습 효과의 배가 된다. 귀에 살살 녹는 나긋나긋한 목소리는 덤이다.

 

[총평]

한 눈에 파악하기 쉬운 책의 구성과 컬러풀한 이미지 사용으로 지루함을 덜어내고 개념 이해를 돕는 좋은 책이다.

댓글 0 이 리뷰가 도움이 되었나요? 공감 0

한줄평 (5건) 한줄평 총점 6.8

혜택 및 유의사항 ?
구매 평점1점
절대 사지마셈
1명이 이 한줄평을 추천합니다. 공감 1
YES마니아 : 로얄 d********x | 2022.09.04
구매 평점5점
초보자 기준에서 정말이해해가 쉽네요
이 한줄평이 도움이 되었나요? 공감 0
하**랑 | 2022.08.25
평점5점
리액트를 처음 접하거나 배우고 싶으신 분들께 강추!!! 초급자가 익히기에 적합한 책입니다.
이 한줄평이 도움이 되었나요? 공감 0
b******2 | 2022.07.04
  •  쿠폰은 결제 시 적용해 주세요.
1   29,700
뒤로 앞으로 맨위로 aniAlarm