• 메인으로 이동
    AD광고
    Best Seller소년 김구의 가슴 뜨거운 역사설민석의 한국사 대모험 38
    AD광고
    New사랑과 우정으로 빛나는 모험프린세스 캐치 티니핑
    • 베스트
    • 소득공제
    • 무료배송

    현장에서 바로 써먹는 리액트 with 타입스크립트 - 리액트와 스토리북으로 배우는 컴포넌트 주도 개발

    • 김정헌 저
    • 심통
    • 2023년 06월 27일
    10%33,30037,000
    적립금
    1,850원 (5% 적립)
    추가 적립
    추가 적립 안내
    • 5만원 이상 결제 시 (*배송비 제외)

      정가제FREE(상품/사은품) 금액이 2,000원 이상이면 2,000원 추가적립

    • 10만원 이상 결제 시 (*배송비 제외)

      정가제FREE(상품/사은품) 금액이 2,000원 이상이면 2,000원 추가적립

      정가제FREE(상품/사은품) 금액이 5,000원 이상이면 5,000원 추가적립

    결제혜택
    무이자 할부
    결제사 혜택
    쿠폰
    회원 가입 즉시 지급되는 적립금 과 등급별 다양한 회원 혜택 보기
    배송비
    무료  (해외배송의 경우 지역에 따라 상이)

    배송안내

    서울특별시 강남구 강남대로 542(논현동, 영풍빌딩)
    지금 택배 주문하면 내일 수령 가능
    택배보다 빠른, 나우드림
    33,300

    [네이버페이]

    상품 규격 정보
    상품상세정보
    ISBN ISBN-13 : 9791197973079
    쪽수576쪽
    크기B5(188mm X 257mm, 사륙배판)
    제품구성단행본
    이 책이 속한 분야
    • 컴퓨터/IT > 인터넷
    관련 이벤트
    • 사은품

    이달의 리뷰왕

    2026.01.01 ~ 2026.12.31

    • 사은품

    신규가입시 최대 10,800원

    2025.12.31 ~ 2026.12.31

    • 사은품

    『유치원 Wars 17』 출간 기념 포토카드 증정!

    2026.09.01 ~ 2026.09.28

    • 사은품

    9월 특별선물 《영풍문고 리유저블백》

    2026.09.01 ~ 2026.09.30

    • 사은품

    이달의 리뷰왕

    2026.01.01 ~ 2026.12.31

    • 사은품

    신규가입시 최대 10,800원

    2025.12.31 ~ 2026.12.31

    • 사은품

    『유치원 Wars 17』 출간 기념 포토카드 증정!

    2026.09.01 ~ 2026.09.28

    • 사은품

    9월 특별선물 《영풍문고 리유저블백》

    2026.09.01 ~ 2026.09.30

    책 소개
    리액트와 스토리북으로 배우는 컴포넌트 주도 개발! 이 책은 웹 개발을 하는 개발자, 리액트로 싱글 페이지 애플리케이션을 개발하고 있는 개발자 그리고 컴포넌트 주도 개발(Component Driven Development, CDD)을 하고자 하는 개발자를 대상으로 하고 있다. 리액트와 스토리북을 사용하여 컴포넌트 주도 개발을 이해할 수 있도록, 리액트의 기초부터 스토리북의 설정, 스토리북을 통해 컴포넌트 주도 개발을 다루는 방법을 예제를 통해 설명하고 있다. 이 책을 통해, 컴포넌트 주도 개발을 하지 않고 있는 실제 프로젝트에 스토리북을 적용하여 컴포넌트 주도 개발을 활용할 수 있도록 안내하고 있다.
    목차
    1장 리액트란? 1.1 웹의 역사 1) 웹 1.0 - 웹 페이지 시대 2) 웹 2.0 - 웹 애플리케이션 시대 1.2 리액트의 특징 1) JSX 2) 단방향 데이터 바인딩 3) 가상 돔 4) 선언형 프로그래밍 5) 컴포넌트 기반 1.3 요약 2장 리액트 개발 환경 2.1 윈도우 개발 환경 설정 1) 초콜리티 설치 2) 노드 설치 2.3 리액트를 시작하는 방법 1) 스크립트 태그 추가 2) Webpack이나 Babel을 설정하여 개발 3) create-react-app 4) Next.js 프레임워크 2.4 create-react-app 1) create-react-app 설치 2) create-react-app으로 프로젝트 생성 및 실행 3) create-react-app 프로젝트의 폴더 구조 2.5 요약 3장 나의 첫 리액트 프로젝트 3.1 타입스크립트 1) create-react-app과 타입스크립트 2) create-react-app의 타입스크립트 템플릿 사용하기 3.2 스타일링 1) CSS와 Link 태그 2) CSS와 import 3) CSS-in-JS (Emotion) 3.3 절대 경로로 컴포넌트 추가 3.4 Prettier 1) Prettier 설치 2) Prettier 설정 3) Prettier 실행 3.5 ESLint 1) ESLint 설치 2) ESLint 설정 3) ESLint 실행 3.6 요약 4장 카운터 앱 - Props와 State 4.1 Props와 State 4.2 프로젝트 준비 4.3 개발 1) 컴포넌트 2) 컴포넌트 3) <Label /> 컴포넌트 4) <Button /> 컴포넌트 5) State 6) Props 4.4 요약 5장 클래스 컴포넌트 5.1 클래스 컴포넌트 5.2 프로젝트 준비 5.3 개발 1) <Button /> 컴포넌트 2) <Label /> 컴포넌트 3) <App /> 컴포넌트 5.4 라이프사이클 함수 1) constructor 함수 2) render 함수 3) getDerivedStateFromProps 함수 4) componentDidMount 함수 5) shouldComponentUpdate 함수 6) getSnapshotBeforeUpdate 함수 7) componentDidUpdate 함수 8) componentWillUnmount 함수 9) componentDidCatch 함수 10) 호출 순서 5.5 요약 6장 할 일 목록 앱 - Context API 6.1 Context API 6.2 프로젝트 준비 6.3 State와 Props로 할 일 목록 앱 개발 1) <Title /> 컴포넌트 2) <Button /> 컴포넌트 3) <ToDoItem /> 컴포넌트 4) <ToDoList /> 컴포넌트 5) useState로 할 일 목록 데이터 관리하기 6) <DataView /> 컴포넌트 7) <TextInput /> 컴포넌트 8) 추가 버튼 컴포넌트 9) <ToDoInput /> 컴포넌트 10) <ShowInputButton /> 컴포넌트 11) <InputContainer /> 컴포넌트 6.4 Context API로 할 일 목록 앱 개발 1) <ToDoList /> 생성 2) <App /> 컴포넌트에 Provider 제공 3) <ToDoList /> 컴포넌트: Consumer를 사용하여 Context 데이터 사용하기 4) <ToDoInput /> 컴포넌트: Consumer를 사용하여 Context 데이터 사용하기 6.5 요약 7장 react-router 7.1 react-router 7.2 프로젝트 준비 7.3 개발 1) react-router 2) <DataView /> 페이지 컴포넌트 3) <ToDoInput /> 페이지 컴포넌트 4) <Header /> 컴포넌트 추가 7.4 요약 8장 Fetch API 8.1 Fetch API 8.2 프로젝트 준비 8.3 개발 1) <Header /> 컴포넌트 2) <BlogPost /> 컴포넌트 3) 블로그 글 목록 State 4) useEffect 훅 5) Fetch API로 데이터 가져오기 6) <Button /> 컴포넌트 7) <Form /> 컴포넌트 8) <Form /> 표시 State 9) 블로그 글 State 데이터 10) Fetch API로 블로그 글 등록하기 8.4 요약 9장 컴포넌트 주도 개발 9.1 컴포넌트 주도 개발 9.2 아토믹 디자인 9.3 스토리북 9.4 프로젝트 준비 9.5 스토리북 설치 9.6 스토리북 설정 9.7 스토리북 확인 1) .storybook 폴더 2) .eslintrc.js 파일 3) .npmrc 파일 4) package.json 파일 5) ./src/stories 폴더 6) ./src/stories/Button.tsx 파일 7) ./src/stories/Button.stories.tsx 파일 8) ./src/stories/Introduction.stories.mdx 파일 9.8 스토리북 실행 1) 메뉴 2) 컨트롤 패널 3) 액션 탭 4) 상단 메뉴 바 - 배경색 5) 상단 메뉴 바 - 화면 크기 9.9 요약 10장 컴포넌트 주도 개발 - 카운터 앱 10.1 카운터 앱 10.2 프로젝트 준비 10.3 개발 1) <Title /> 원자 컴포넌트 2) <Button /> 원자 컴포넌트 3) <Count /> 원자 컴포넌트 4) <Counter /> 유기체 컴포넌트 5) <CounterApp /> 템플릿 컴포넌트 6) <Home /> 페이지 컴포넌트 7) 카운터 앱 10.4 요약 11장 CDD - 할 일 목록 앱 11.2 프로젝트 준비 11.3 개발 1) <AppTitle /> 원자 컴포넌트 2) <PageTitle /> 원자 컴포넌트 3) <Label /> 원자 컴포넌트 4) <Button /> 원자 컴포넌트 5) <Input /> 원자 컴포넌트 6) <Header /> 유기체 컴포넌트 7) <ToDoItem /> 유기체 컴포넌트 8) <InputToDo /> 유기체 컴포넌트 9) <ToDoList /> 템플릿 컴포넌트 10) <ToDoInput /> 템플릿 컴포넌트 11) <ToDoListPage /> 페이지 컴포넌트 12) ToDoList 컨텍스트 13) <ToDoInputPage /> 페이지 컴포넌트 14) <NotFound /> 페이지 컴포넌트 15) 할 일 목록 앱 11.4 요약 12장 CD - 블로그 앱 12.1 블로그 앱 12.2 프로젝트 준비 12.3 개발 1) <AppTitle /> 원자 컴포넌트 2) <BlogTitle /> 원자 컴포넌트 3) <BlogBody /> 원자 컴포넌트 4) <Button /> 원자 컴포넌트 5) <DialogTitle /> 원자 컴포넌트 6) <Label /> 원자 컴포넌트 7) <InputText /> 원자 컴포넌트 8) <Input /> 분자 컴포넌트 9) <Header /> 유기체 컴포넌트 10) <BlogItem /> 유기체 컴포넌트 11) <RegisterBlogDialog /> 유기체 컴포넌트 12) <BlogList /> 템플릿 컴포넌트 13) <BlogListPage /> 페이지 컴포넌트 14) 블로그 앱 12.4 요약 부록 1. Lefthook 1) 프로젝트 준비 2) Lefthook 설치 3) Lefthook 설정 4) Lefthook 실행 5) Lefthook 적용 2. 배포
    저자 소개
    저자 : 김정헌
      김정헌
      한국의 중소기업에서 MFC를 사용한 윈도우 프로그램 개발을 시작으로 안드로이드, iOS, 웹 개발자로 활동을 하였다. 그 후, 웹 프로그래머로써 호주에서 활동하였으며, 현재는 일본에서 풀스택 엔지니어로써 리액트를 사용한 서비스를 개발중이다. 업무 이외에도 리액트와 플러터를 사용한 앱을 개발 중에 있으며, 앱 개발 중에 겪었던 일을 블로그에 게재하고 있다.

      ┃블로그┃
      https://dev-yakuza.posstree.com/ko/
      ┃저자 앱 리스트┃
      https://dev-yakuza.posstree.com/app/list/ko/
      도서리뷰 (0)
      이 책을 읽고 어떤 느낌을 받으셨나요? 리뷰를 남기고 다른 독자들과 함께 공유해보세요.

      등록된 리뷰가 없습니다

      첫번째 리뷰어가 되어주세요

      이 분야에서 요즘 뜨는 책
      에러가 무섭지 않게 되는 책 - 에러 잘 읽는 법부터 효율적으로 디버깅하고 디버깅이 쉬운 코드를 작성하는 법까지사쿠라바 히로유키, 모치즈키 고타로 | 제이펍
      AI혁신:개정판 - 나의 커리어를 높이는 스마트워크 전략박대형, 김상용, 차명일, 임성기 | 지식과감성
      인생 언리얼 5 프로젝트 교과서 - 언리얼 엔진으로 3D 이머시브 콘텐츠 개발이영호, 박원석, 박현상, 탁광욱, 이영훈, 김현진 | BM성안당
      비전공자를 위한 이해할 수 있는 파이썬 - 챗GPT 시대에 최적화된 파이썬 공부법최원영 | 티더블유아이지
      엔트리 인공지능 with 햄스터 로봇 - 개정판강윤지,박찬규,강성웅,김원유,심재민,김연구,홍성용,김경상,정인재 | 영진닷컴
      에러가 무섭지 않게 되는 책 - 에러 잘 읽는 법부터 효율적으로 디버깅하고 디버깅이 쉬운 코드를 작성하는 법까지사쿠라바 히로유키, 모치즈키 고타로 | 제이펍
      AI혁신:개정판 - 나의 커리어를 높이는 스마트워크 전략박대형, 김상용, 차명일, 임성기 | 지식과감성
      인생 언리얼 5 프로젝트 교과서 - 언리얼 엔진으로 3D 이머시브 콘텐츠 개발이영호, 박원석, 박현상, 탁광욱, 이영훈, 김현진 | BM성안당
      비전공자를 위한 이해할 수 있는 파이썬 - 챗GPT 시대에 최적화된 파이썬 공부법최원영 | 티더블유아이지
      엔트리 인공지능 with 햄스터 로봇 - 개정판강윤지,박찬규,강성웅,김원유,심재민,김연구,홍성용,김경상,정인재 | 영진닷컴
      에러가 무섭지 않게 되는 책 - 에러 잘 읽는 법부터 효율적으로 디버깅하고 디버깅이 쉬운 코드를 작성하는 법까지사쿠라바 히로유키, 모치즈키 고타로 | 제이펍
      AI혁신:개정판 - 나의 커리어를 높이는 스마트워크 전략박대형, 김상용, 차명일, 임성기 | 지식과감성
      인생 언리얼 5 프로젝트 교과서 - 언리얼 엔진으로 3D 이머시브 콘텐츠 개발이영호, 박원석, 박현상, 탁광욱, 이영훈, 김현진 | BM성안당
      이 분야의 화제의 신간
      혼자 공부하는 SQL with AI - AI와 함께 1:1 과외하듯 배우는 데이터베이스 자습서: SQLD 유형문제 수록 해설 강의 제공우재남 | 한빛미디어
      직장인을 위한 AI 에이전트 클로드 코워크 - 앤트로픽 공식 플러그인으로 익히는 32가지 실무 예제케이트리 | 제이펍
      이기적 컴퓨터활용능력 1급 필기+실기 올인원(2027대비)홍태성, 박윤정 | 영진닷컴
      AI 팀원을 고용한 회사는 다르게 일한다 - 부서별 업무별 챗GPT 실전 도입 가이드 영업 마케팅 인사 경영기획 백오피스 업무 경영자(모두의 AI)이케다 도모히로 | 길벗
      AI와 일하는 기술 - 성과를 만드는 365가지 AI 치트키최정혜, 김여립, 이동근, 뉴럴웨이브 | 한국경제신문
      혼자 공부하는 SQL with AI - AI와 함께 1:1 과외하듯 배우는 데이터베이스 자습서: SQLD 유형문제 수록 해설 강의 제공우재남 | 한빛미디어
      직장인을 위한 AI 에이전트 클로드 코워크 - 앤트로픽 공식 플러그인으로 익히는 32가지 실무 예제케이트리 | 제이펍
      이기적 컴퓨터활용능력 1급 필기+실기 올인원(2027대비)홍태성, 박윤정 | 영진닷컴
      AI 팀원을 고용한 회사는 다르게 일한다 - 부서별 업무별 챗GPT 실전 도입 가이드 영업 마케팅 인사 경영기획 백오피스 업무 경영자(모두의 AI)이케다 도모히로 | 길벗
      AI와 일하는 기술 - 성과를 만드는 365가지 AI 치트키최정혜, 김여립, 이동근, 뉴럴웨이브 | 한국경제신문
      혼자 공부하는 SQL with AI - AI와 함께 1:1 과외하듯 배우는 데이터베이스 자습서: SQLD 유형문제 수록 해설 강의 제공우재남 | 한빛미디어
      직장인을 위한 AI 에이전트 클로드 코워크 - 앤트로픽 공식 플러그인으로 익히는 32가지 실무 예제케이트리 | 제이펍
      이기적 컴퓨터활용능력 1급 필기+실기 올인원(2027대비)홍태성, 박윤정 | 영진닷컴
      이 분야의 새로 나온 도서
      클로드와 엑셀로 시작하는 AI 주식 투자 - 데이터 수집부터 대시보드 자동화와 투자 판단까지 나만의 AI 주식 비서 만들기LearnAI Team | 위키북스
      AI 광고 콘텐츠 제작법 - 기획 카피부터 촬영 제작 분석까지 AI 광고 제작 마스터하기김남훈, 임성희, 황성연 | 이은북
      AIED 인공지능 활용 교육(AI총서)김민지 | 커뮤니케이션북스
      AIED 인공지능 활용 교육(큰글자책)(AI총서)김민지 | 커뮤니케이션북스
      AI가 못하는 일(큰글자책)(인공지능총서)소병수 | 커뮤니케이션북스
      AI로 PR하기(인공지능총서)김태욱 | 커뮤니케이션북스
      AI로 PR하기(큰글자책)(인공지능총서)김태욱 | 커뮤니케이션북스
      이기적 정보처리기사 실기 최신문제집 2주 패스(2027 대비)고소현, 한진만 | 영진닷컴
      클로드와 엑셀로 시작하는 AI 주식 투자 - 데이터 수집부터 대시보드 자동화와 투자 판단까지 나만의 AI 주식 비서 만들기LearnAI Team | 위키북스
      AI 광고 콘텐츠 제작법 - 기획 카피부터 촬영 제작 분석까지 AI 광고 제작 마스터하기김남훈, 임성희, 황성연 | 이은북
      AIED 인공지능 활용 교육(AI총서)김민지 | 커뮤니케이션북스
      AIED 인공지능 활용 교육(큰글자책)(AI총서)김민지 | 커뮤니케이션북스
      AI가 못하는 일(큰글자책)(인공지능총서)소병수 | 커뮤니케이션북스
      AI로 PR하기(인공지능총서)김태욱 | 커뮤니케이션북스
      AI로 PR하기(큰글자책)(인공지능총서)김태욱 | 커뮤니케이션북스
      이기적 정보처리기사 실기 최신문제집 2주 패스(2027 대비)고소현, 한진만 | 영진닷컴
      교환/반품/환불
      반품/교환방법
      • 마이페이지 > 주문관리 > 주문/배송조회 > 주문조회 후  [1:1상담신청]  또는 고객센터 (1544-9020)
      • ※ 오픈마켓, 해외배송 주문상품 문의 시 [1:1상담신청] 또는 고객센터 (1544-9020)
      반품/교환 가능기간
      • 변심반품의 경우 수령 후 7일 이내
      • 상품의 결함 및 계약내용과 다를 경우 문제점 발견 후 30일 이내
      반품/교환비용
      • 단순변심 혹은 구매착오로 인한 반품/교환은 반송료 고객 부담
      • 해외직배송 도서 구매 후 단순변심에 의한 취소 및 반품 시 도서판매가의 20% 수수료 부과
      반품/교환 불가 사유
      • 소비자의 책임 있는 사유로 상품 등이 손실 또는 훼손된 경우
      • 소비자의 사용, 포장 개봉에 의해 상품 등의 가치가 현저히 감소한 경우
        예) 만화, 잡지, 수험서 및 문제집류
      • 복제가 가능한 상품 등의 포장을 훼손한 경우
        예) 음반/DVD/비디오, 소프트웨어, 만화책, 잡지, 영상 화보집
      • 소비자의 요청에 따라 개별적으로 주문 제작되는 상품의 경우
      • 디지털 컨텐츠인 eBook, 오디오북 등을 1회 이상 다운로드를 받았을 경우
      • 시간의 경과에 의해 재판매가 곤란한 정도로 가치가 현저히 감소한 경우
      • 전자상거래 등에서의 소비자보호에 관한 법률이 정하는 소비자 청약철회 제한 내용에 해당되는 경우
      상품 품절
      • 공급사(출판사) 재고 사정에 의해 품절/지연될 수 있으며, 품절 시 관련 사항에 대해서는 이메일과 문자로 안내드리겠습니다.
      소비자 피해보상
      환불지연에 따른 배상
      • 상품의 불량에 의한 교환, A/S, 환불, 품질보증 및 피해보상 등에 관한 사항은 소비자분쟁 해결 기준 (공정거래위원회 고시)에 준하여 처리됨
      • 대금 환불 및 환불지연에 따른 배상금 지급 조건, 절차 등은 전자상거래 등에서의 소비자 보호에 관한 법률에 따라 처리함
      공지사항
      • [이벤트 당첨자 발표] 9월 모두의 서가 이벤트 당첨자 안내
      • [공지사항] 스타필드마켓 월계 문구복합매장 그랜드 오픈 🎊 이벤트 안내!
      • [공지사항] 2026년 9월 1일 개인정보 처리방침 개정 안내(3.개인정보 처리, 항목, 보유기간)
      • [이벤트 당첨자 발표] 26년 8월 <이달의 작가> 댓글 이벤트 당첨자 안내
      • [공지사항] 폭우로 인한 거제·통영 지역 배송불가 안내 ('26년 8월 19일 09시 30분 기준)
      공지더보기