• 베스트
  • 소득공제
  • 무료배송

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

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

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

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

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

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

회원가입 시 적립금 즉시 지급!

배송비
무료 (해외배송의 경우 지역에 따라 상이)

배송안내

배송비 안내
  • 1만원 이상 주문 시 무료배송 입니다.
  • 주문하신 상품을 해외로 배송 하시는 경우에는 별도의 항공료 가 부과됩니다
서울특별시 강남구 강남대로 542(논현동, 영풍빌딩)
주문 수량 변경시 안내

[주문/배송] 주문 수량 변경 시 안내

주문 수량 변경 시,배송일정이 변경될 수 있으니 반드시 확인해 주시기 바랍니다.
(고객센터 1544-9020)

지금 주문하면 오늘 출고 가능
택배보다 빠른, 나우드림
상품 규격 정보
상품상세정보
ISBNISBN-13 : 9791197973079
쪽수576쪽
크기B5(188mm X 257mm, 사륙배판)
제품구성단행본
이 책이 속한 분야
  • 컴퓨터/IT > 인터넷
관련 이벤트

AI추천 이유

책 소개
리액트와 스토리북으로 배우는 컴포넌트 주도 개발! 이 책은 웹 개발을 하는 개발자, 리액트로 싱글 페이지 애플리케이션을 개발하고 있는 개발자 그리고 컴포넌트 주도 개발(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)
    이 책을 읽고 어떤 느낌을 받으셨나요? 리뷰를 남기고 다른 독자들과 함께 공유해보세요.

    등록된 리뷰가 없습니다

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

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

    매장에서 사용할 수 있는 바코드가 있어요!