본문내용 바로가기
MD의선택 무료배송 이벤트 사은품 경품

React.js 핵심정리 자바스크립트로 만들어가는 사용자 인터페이스

acorn+PACKT 시리즈
아르테미 페도세예프 지음 | 테크 트랜스 그룹 T4 옮김 | 에이콘출판 | 2016년 05월 20일 출간
  • 정가 : 20,000원
    판매가 : 18,000 [10%↓ 2,000원 할인]
  • 제휴할인가 : 17,100 교보-KB국민카드 5% 청구할인(실적무관) 카드/포인트 안내
  • 통합포인트 :
    [기본적립] 1,000원 적립 [5% 적립] 안내 [추가적립] 5만원 이상 구매 시 2천원 추가적립 [회원혜택] 우수회원 5만원 이상 구매 시 2~3% 추가적립
  • 추가혜택 :
    naver네이버페이 결제 시 무조건 1% 추가 적립 payco페이코 결제 시 최대 1만원 적립 okcashbag 실 결제 금액의 0.5% 적립 안내
  • 배송비 : 무료 배송비 안내
  • 배송일정 : 서울특별시 종로구 세종대로 기준 지역변경
    당일배송 지금 주문하면 오늘(12일,화) 도착 예정 배송일정 안내
  • 바로드림 : 인터넷으로 주문하고 영업점에서 직접 수령 안내
행사도서 포함, 5만원이상 구매시 2018년 캘린더 증정
닫기
  • 나만의 경쟁력, 동양고전 김원중 명품고전 독서대 증정
  • 비모 벽시계
  • 자기계발:버리거나 혹은 얻거나
  • 경제경영 메인이벤트

이 책의 이벤트 해외주문/바로드림/제휴사주문/업체배송건의 경우 1+1 증정상품이 발송되지 않습니다.

  • 올해의 IT도서 트렌드, 영예의 주인공은 어떤 책일까요?
    2017.11.28 ~ 2017.12.31
  • 동료 개발자들의 책장을 살펴보세요 :)
    2017.08.31 ~ 2018.12.31
  • #리드잇 페이스북 페이지 팔로우 하시고, 신간소식 빠르게 받아보..
    2017.06.22 ~ 2025.07.31
  • 대표 IT 컴퍼니 지원자격에 맞춰 준비하자
    06. 21 ~ 12. 31
  • MANNING, O'REILLY, PACKT, WILEY 등 해..
    03. 07 ~ 04. 30
  • 설문참여 시 매월 5명 추첨통해 선물을 드립니다.
    10. 14 ~ 12. 31
상품상세정보
ISBN 9788960778603(8960778605)
쪽수 240쪽
크기 188 * 235 * 15 mm /580g 판형알림
이 책의 원서 React.js Essentials/Artemij Fedosejev

책소개

이 책이 속한 분야

페이스북은 백엔드 기술과 웹 기술뿐만 아니라 iOS와 안드로이드로 대표되는 모바일 기술까지 IT 전 분야에 걸쳐 다양한 기술들을 오픈소스화 해 많은 개발자들이 활용하도록 하고 있다. 그리고 많은 유명 기업들이 다양한 페이스북 오픈소스 기술을 도입해 페이스북의 기대에 부응하고 있다. 스트리밍 서비스의 대표주자로 손꼽히는 넷플렉스(Netflix)를 비롯해 BBC와 NBC의 웹사이트가 React.js를 사용한다. React.js는 매우 직관적이고 효율적인 UI를 구성할 수 있도록 방안을 제시해 줄 것이다. 이 책은 React.js의 설치부터 시작해 간단한 컴포넌트에서 다소 복잡한 컴포넌트까지 함께 만들어 보면서 기본적인 React.js의 활용 방법을 설명해 주고, 마지막에는 애플리케이션 아키텍처인 Flux를 활용하는 방법까지 자세히 설명한다.

이 책의 총서

총서 자세히 보기

저자소개

저자 : 아르테미 페도세예프

저자 아르테미 페도세예프(Artemij Fedosejev)는 영국 런던에 거주 중인 기술 수석이다. 2000년대 초반부터 웹 개발자로 일해 왔으며, 독학한 웹 개발자다. 아일랜드의 코크대학교(University College Cork)에서 컴퓨터 과학 학사 학위를 취득했다. IGNITE Graduate Business Innovation Programme에 참여해 Most Innovative Project 상을 받은 웹 사이트를 개발하고 출시했다.
졸업 후에 지역 스타트업 기업들의 제품을 개발하는 데 도움을 주기 위해 런던으로 옮겼다. 자바스크립트, Node.js, HTML5, CSS3, 그리고 다른 최신 웹 기술들을 이용해 개발을 진행했다. 스타트업 산업에서 경력을 쌓은 후 임페리얼 칼리지 런던(Imperial College London)에 합류해 연구 및 개발, 프로젝트 작업을 했으며, 더 나아가 공공 건강 시설의 여러 웹 애플리케이션 프론트엔드 개발을 주도할 기회까지 부여받았다. React.js와 Flux를 이용해서 WGSA.net과 Microreact.org의 프론트엔드 아키텍처를 생성하는 데 중요한 역할을 했다. Snapkite 엔진, Snapkite 스트림 클라이언트, 그리고 그 외 다른 프로젝트 등 다수의 오픈소스 프로젝트를 생성했다. 이 프로젝트들은 모두 깃허브(https://github.com/fedosejev)에서 확인 가능하다. 또한 웹사이트(http://react.tips)를 운영하고 있다.

역자 : 테크 트랜스 그룹 T4

역자 테크 트랜스 그룹 T4는 엔터프라이즈 환경에서 오픈소스를 활용한 프레임워크를 구축하는 일에 관심이 많으며, 최근에는 모바일을 접목한 하이브리드 환경에서 사용자 인터페이스와 Spring, Node.js, React.js, Underscore.js, AngularJS 등 아키텍처 전반에 걸친 웹 기술과 빅 데이터, 인지컴퓨팅 기술을 적용하는 일에 집중하고 있다. 아두이노와 라즈베리파이 등의 다양한 오픈 하드웨어 디바이스를 사용한 사물인터넷 관련 서비스도 제공하고 있다.
자바스크립트 프로그래밍, Node.js, AngularJS, MySQL, MongoDB, MariaDB와 관련된 다수의 서적을 번역하였으며, 웹, 데이터베이스, 프로그래밍 언어 관련 기술 전파와 교육에 노력 중이다.

작가의 말

오늘날의 웹은 이전과는 다르다. 웹을 개발하는 방식이 달라졌다. 제이쿼리가 생성한 유지보수가 불가능한 명령형 코드를 다루어야 하는 문제에 직면했고, 현대의 복잡한 사용자 인터페이스를 관리할 수 있는 새로운 방법을 찾아야 했다. 자바스크립트를 이용해 선언형, 모듈식의 빠르고 확장 가능한 프론트엔드 애플리케이션 개발을 가능하게 하는 새로운 사용자 인터페이스 라이브러리가 필요했다.
페이스북에서 개발한 자바스크립트 사용자 인터페이스 라이브러리인 React.js를 소개한다. React.js는 DOM을 이용해서 작업하는 방법, 애플리케이션의 데이터 흐름을 체계화하는 방법, 그리고 인터페이스 엘리먼트를 개별 컴포넌트로 생각하는 방법에 대해 엄청난 아이디어를 가져왔다. 그렇지만, 나머지 기술 스택에 대한 요구 조건은 없는 사용자 인터페이스 라이브러리다.
Flux와 결합되면, 숙련된 개발자뿐만 아니라 프론트엔드를 처음 접하는 개발자에게도 유용하며 강력한 프론트엔드 아키텍처를 얻을 수 있다.
당장 또는 언젠가는 온갖 종류의 개발 이슈들을 해결해야 하는 모든 프론트엔드 개발자들에게 좀 더 나은 미래를 제공할 것이다. - 저자

2015년 1월, 페이스북은 리액트 네이티브를 처음 공개했다. 이전부터 자바스크립트를 이용해서 모바일 앱 개발을 시도한 경우는 많았지만 대부분이 웹뷰(Webview)를 이용한 하이브리드 앱이었다. 하지만 리액트 네이티브를 통해, 자바스크립트로 작업해서 네이티브 앱을 개발하는 것이 가능해졌다. 처음 공개 시에는 iOS용 리액트 네이티브만 공개했으나 곧 안드로이드용을, 그리고 최근에는 윈도우 10뿐만 아니라 타이젠 개발까지 가능해졌다고 발표했다. Tom Occhino는 첫 공개 당시 자신의 블로그에서 다음과 같이 말했다.
“우리는 ‘Write once, run anywhere(한 번만 코딩하여, 모든 플랫폼에서 동작한다)’를 추구하는 것이 아니다. 모든 플랫폼들은 서로 다른 룩앤필과 장점을 갖고 있기 때문에 여전히 각 플랫폼마다 개별적으로 앱을 개발해야 한다. 하지만 이제는 어떤 플랫폼을 선택하든 상관없이 개발자들은 새로운 기술을 배우지 않고도 앱 개발이 가능해졌다. 그리고 우린 ‘learn once, write anywhere (한 번의 공부로, 모든 플랫폼에 적용한다)’라고 말할 수 있다.”
이 기술은 자연스레 많은 모바일 앱 개발자들의 관심을 끌었다. 그리고 이 기술의 가장 기본이자 시작은 바로 이 책에서 소개하고 있는 React.js다.
React.js는 페이스북과 인스타그램의 UI를 위해 만들어진 자바스크립트 라이브러리다. 그리고 페이스북과 인스타그램 같은 지속적으로 데이터가 변경되는 큰 규모의 애플리케이션을 구축하는 문제를 해결하고자 React.js를 개발했다고 이야기하고 있다. 단순함, 선언적 문법, 컴포넌트 이 세 가지 특징으로 React.js는 여러분이 UI를 구성하는 데 매우 직관적이고 효율적인 방안을 제시해 줄 것이다.
이 책은 React.js의 설치부터 시작해, 간단한 컴포넌트에서 다소 복잡한 컴포넌트까지 함께 만들어 보면서 기본적인 React.js의 활용 방법을 설명해주고, 마지막에는 애플리케이션 아키텍처인 Flux를 활용하는 방법까지 자세히 설명한다.
이 책이 React.js가 생소한 개발자에게 효과적인 애플리케이션의 UI 구현 방법을 제시하는 데 많은 도움이 되기를 바란다. - 역자

목차

1 필요한 도구 설치
__프로젝트 시작
__Node.js와 npm 설치
__깃 설치
__트위터 스트리밍 API를 이용해 데이터 획득
__Snapkite 엔진을 이용해 데이터 필터링
__프로젝트 구조 생성
__package.json 생성
__Node.js 모듈 재사용
__Gulp.js로 빌드
__웹 페이지 생성
__요약

2 첫 React 엘리먼트 생성
__가상 DOM의 이해
__React 설치
__자바스크립트를 이용해 React 엘리먼트 생성
____type 매개변수
____props 매개변수
____children 매개변수
__React 엘리먼트 렌더링
__JSX를 이용해 React 엘리먼트 생성
__요약

3 첫 React 컴포넌트 생성
__상태 없음 vs. 상태 기반
__상태를 갖지 않는 첫 React 컴포넌트 생성
__첫 상태 기반 React 컴포넌트 생성
__요약

4 React 컴포넌트에 반응성 추가
__React를 사용한 문제 해결
__React 애플리케이션 계획
__컨테이너 React 컴포넌트 생성
__요약

5 다른 라이브러리와 함께 React 컴포넌트 사용
__React 컴포넌트에서 다른 라이브러리 사용
__React 컴포넌트의 생명주기 메소드
____마운트 메소드
________getInitialState 메소드
________componentWillMount 메소드
________componentDidMount 메소드
____마운트 해제 메소드
________componentWillUnmount 메소드
__요약

6 React 컴포넌트 업데이트
__컴포넌트 생명주기의 업데이트 메소드
____componentWillReceiveProps 메소드
____shouldComponentUpdate 메소드
____componentWillUpdate 메소드
____componentDidUpdate 메소드
__React 컴포넌트 프로퍼티 기본 설정
__React 컴포넌트 프로퍼티 검사
__Collection 컴포넌트 생성
__요약

7 복잡한 React 컴포넌트 생성
__TweetList 컴포넌트 생성
__CollectionControl 컴포넌트 생성
__CollectionRenameForm 컴포넌트 생성
__Button 컴포넌트 생성
__CollectionExportForm 컴포넌트 생성
__요약

8 Jest를 사용해 React 애플리케이션 테스트
__유닛 테스트를 해야 하는 이유
__테스트 스위트, 스펙, 예상 결과 생성
__Jest 설치와 사용
__여러 개의 스펙과 예상 값 생성
__React 컴포넌트 테스트
__요약

9 Flux를 사용해 React 아키텍처 향상시키기
__웹 애플리케이션의 구조 분석
__Flux의 이해
__디스패처 생성
__액션 생성자 생성
__스토어 생성
__요약

10 Flux를 사용한 React 애플리케이션의 유지보수 준비
__Flux를 사용해 걱정거리 줄이기
__스트림 컴포넌트 리팩토링
__CollectionStore 생성
__CollectionActionCreator 생성
__애플리케이션 컴포넌트 리팩토링
__컬렉션 컴포넌트 리팩토링
__CollectionControls 컴포넌트 리팩토링
__CollectionRenameForm 컴포넌트 리팩토링
__TweetList 컴포넌트 리팩토링
__StreamTweet 컴포넌트 리팩토링
__빌드와 활용

추천사

알렉스 부시(스마트클라우드 설립자)

제이쿼리 jQuery 콜백을 작성하는 데에 지쳤는가? Angular 앱에서 또 다른 템플릿 또는 설정을 다시 작성해야 할 때마다 화가 나는가? 애플리케이션 구조가 이렇게 복잡한 이유가 궁금한가? 그렇다면, React가 바로 ... 더보기

출판사 서평

★ 이 책에서 다루는 내용 ★

■ 좀 더 효율적인 개발을 위한 강력한 React 도구 설치
■ 프로퍼티와 자식이 있는 React 엘리먼트 생성
■ 상태가 없는 React 컴포넌트와 상태 기반의 React 컴포넌트 소개
■ React 개발 과정을 빠르게 하기 위한 JSX 사용
■ React 컴포넌트에 생명주기 메소드를 이용해서 반응성 추가
■ React 컴포넌트를 다른 자바스크립트 라이브러리와 통합
■ Flux 애플리케이션 아키텍처를 React 컴포넌트와 함께 활용
■ Jest 테스트 프레임워크를 이용해서 Reac... 더보기

북로그 리뷰 (0) 쓰러가기

도서 구매 후 리뷰를 작성하시면 통합포인트를 드립니다.
결제 90일 이내 작성 시 300원 / 발송 후 5일 이내 작성시 400원 / 이 상품의 첫 리뷰 작성 시 500원
(포인트 적립은 작성 후 다음 날 혹은 해당 도서 출고 후 익일에 적립됩니다.
외서/eBook/음반/DVD/GIFT 및 잡지 상품 제외)
안내
  • 해당도서의 리뷰가 없습니다.

Klover 평점/리뷰 (0)

교환/반품/품절안내

※ 상품 설명에 반품/교환 관련한 안내가 있는 경우 그 내용을 우선으로 합니다. (업체 사정에 따라 달라질 수 있습니다.)

교환/반품/품절안내
반품/교환방법 마이룸 > 주문관리 > 주문/배송내역 > 주문조회 > 반품/교환신청 ,
[1:1상담>반품/교환/환불] 또는 고객센터 (1544-1900)

※ 오픈마켓, 해외배송주문, 기프트 주문시 [1:1상담>반품/교환/환불]
    또는 고객센터 (1544-1900)
반품/교환가능 기간 변심반품의 경우 수령 후 7일 이내,
상품의 결함 및 계약내용과 다를 경우 문제점 발견 후 30일 이내
반품/교환비용 변심 혹은 구매착오로 인한 반품/교환은 반송료 고객 부담
반품/교환 불가 사유
  • 소비자의 책임 있는 사유로 상품 등이 손실 또는 훼손된 경우
    (단지 확인을 위한 포장 훼손은 제외)
  • 소비자의 사용, 포장 개봉에 의해 상품 등의 가치가 현저히 감소한 경우
    예) 화장품, 식품, 가전제품(악세서리 포함) 등
  • 복제가 가능한 상품 등의 포장을 훼손한 경우
    예) 음반/DVD/비디오, 소프트웨어, 만화책, 잡지, 영상 화보집
  • 소비자의 요청에 따라 개별적으로 주문 제작되는 상품의 경우 ((1)해외주문도서)
  • 디지털 컨텐츠인 eBook, 오디오북 등을 1회 이상 다운로드를 받았을 경우
  • 시간의 경과에 의해 재판매가 곤란한 정도로 가치가 현저히 감소한 경우
  • 전자상거래 등에서의 소비자보호에 관한 법률이 정하는 소비자 청약철회 제한 내용에
    해당되는 경우
(1) 해외주문도서 : 이용자의 요청에 의한 개인주문상품으로 단순변심 및 착오로 인한 취소/교환/반품 시 ‘해외주문 반품/취소 수수료’ 고객 부담 (해외주문 반품/취소 수수료 : ①양서-판매정가의 12%, ②일서-판매정가의 7%를 적용)
상품 품절 공급사(출판사) 재고 사정에 의해 품절/지연될 수 있으며, 품절 시 관련 사항에 대해서는
이메일과 문자로 안내드리겠습니다.
소비자 피해보상
환불지연에 따른 배상
  • 상품의 불량에 의한 교환, A/S, 환불, 품질보증 및 피해보상 등에 관한 사항은
    소비자분쟁해결 기준 (공정거래위원회 고시)에 준하여 처리됨
  • 대금 환불 및 환불지연에 따른 배상금 지급 조건, 절차 등은 전자상거래 등에서의
    소비자 보호에 관한 법률에 따라 처리함

이 책의 원서번역서

안내

이 분야의 베스트

더보기+

이 분야의 신간

더보기+

바로가기

  • 우측 확장형 배너 2

최근 본 상품