장바구니 담기 close

장바구니에 상품을 담았습니다.

리액트 머티리얼 UI 쿡북

리액트 머티리얼 UI 쿡북

  • 아담보두치
  • |
  • 에이콘출판
  • |
  • 2020-09-28 출간
  • |
  • 612페이지
  • |
  • 188 X 235 X 29 mm
  • |
  • ISBN 9791161754550
판매가

40,000원

즉시할인가

36,000

카드할인

0원(즉시할인 0%)

적립금

2,000원 적립(5%적립)

배송비

무료배송

(제주/도서산간 배송 추가비용:3,000원)

추가혜택

네이버페이 무조건 1%적립+ 추가 1%적립

수량
+ -
총주문금액
36,000

※ 스프링제본 상품은 반품/교환/환불이 불가능하므로 신중하게 선택하여 주시기 바랍니다.

출판사서평




★ 이 책에서 다루는 내용 ★

■ 머티리얼 UI 앱의 전체적인 구조와 내비게이션 구축 방법
■ 다양한 방법으로 단순하거나 복잡한 정보를 제공하는 방법
■ 상호적이고 직관적인 컨트롤 구축
■ 모든 머티리얼 UI 앱에 유용한 테마와 스타일 구축
■ 탭과 확장 패널을 사용해 콘텐츠를 섹션으로 그룹화
■ 머티리얼 UI 그리드를 사용한 일반적인 데이터 레이아웃 설계
■ 복잡한 데이터에 대한 리스트 사용과 자세한 정보에 대한 카드 사용

★ 이 책의 대상 독자 ★

머티리얼 UI로 애플리케이션에서 더 나은 사용자 경험을 제공하려는 모든 개발자를 대상으로 한다. 노련한 전문가부터 초보 개발자까지 모두에게 적합한 책이며, 머티리얼 UI에 대해 상세한 설명을 가득 담고 있다. 여러분이 머티리얼 디자인에 익숙하지 않다고 가정해 설명하지만, 이 책을 최대한 활용하려면 리액트와 현대 자바스크립트에 대한 최소한의 실무 지식은 갖춰야 한다.
리액트를 가르치는 것이 이 책의 목적은 아니지만, 예제를 따라 하는 데 도움이 된다면 리액트 특화 메커니즘도 설명한다

★ 이 책의 구성 ★

1장. ‘그리드 - 페이지에 구성 요소 배치하기’에서는 그리드 시스템을 사용해 페이지에 구성 요소를 배치한다.
2장. ‘앱바 - 모든 페이지의 최상위 수준’에서는 앱바를 UI의 상단에 추가한다.
3장. ‘드로어 - 내비게이션 제어를 위한 장소’에서는 드로어를 사용해 메인 내비게이션을 표시한다.
4장. ‘탭 - 콘텐츠를 탭 섹션으로 그룹화하기’에서는 콘텐츠를 탭으로 구성한다.
5장. ‘확장 패널 - 콘텐츠를 패널 섹션으로 그룹화하기’에서는 콘텐츠를 패널로 구성한다.
6장. ‘리스트 - 간단한 수집 데이터 표시’에서는 사용자가 읽고 상호작용할 수 있는 항목의 리스트를 렌더링한다.
7장. ‘테이블 - 복잡한 수집 데이터 표시’에서는 데이터 수집에 대한 자세한 정보를 보여준다.
8장. ‘카드 - 상세 정보 표시’에서는 카드를 사용해 특정 엔티티/사물/객체에 대한 세부 정보를 표시한다.
9장. ‘스낵바 - 임시 메시지’에서는 사용자에게 애플리케이션의 현재 상황을 알린다.
10장. ‘버튼 - 동작 시작하기’에서는 사용자가 작업을 수행하는 가장 일반적인 방법인 버튼을 설명한다.
11장. ‘텍스트 - 텍스트 입력 수집’에서는 사용자가 정보를 입력할 수 있게 한다.
12장. ‘자동 완성과 칩 - 여러 항목에 대한 텍스트 입력 제안’에서는 사용자가 입력할 때 선택 사항을 제공한다.
13장. ‘선택 - 선택 사항의 결정’에서는 사용자가 미리 정의된 옵션 집합에서 선택할 수 있다.
14장. ‘선택 도구 - 날짜와 시간 선택’에서는 읽기 쉬운 형식을 사용해 날짜와 시간 값을 선택한다.
15장. ‘대화상자 - 사용자 상호작용을 위한 모달 화면’에서는 입력을 수집하거나 정보를 나타내는 모달 화면을 표시한다.
16장. ‘메뉴 - 팝 아웃되는 동작 표시하기’에서는 메뉴에 동작을 추가해 화면 공간을 절약한다.
17장. ‘타이포그래피 - 폰트의 룩앤필 제어하기’에서는 체계적인 방식으로 UI의 폰트를 제어한다.
18장. ‘아이콘 - 룩앤필에 맞게 아이콘 향상시키기’에서는 머티리얼 UI 아이콘을 사용자 정의하고 새 아이콘을 추가한다.
19장. ‘테마 - 앱의 룩앤필을 중앙집중화하기’에서는 테마를 사용해 구성 요소의 룩앤필을 변경한다.
20장. ‘스타일 - 구성 요소에 스타일 적용하기’에서는 많은 스타일 솔루션 중 하나를 사용해 UI를 디자인한다.

★ 옮긴이의 말 ★

머티리얼 UI는 리액트 컴포넌트들을 모아 놓은 UI 프레임워크다. 세계에서 가장 인기있는 두 가지 프론트엔드 기술인 페이스북의 리액트와 구글의 머티리얼 디자인을 한데 모은 덕분에 애플리케이션 개발을 쉽고 간단하게 해준다. 책 제목에서 알 수 있듯이, 이 책의 목적은 개발자들이 다양한 머티리얼 UI 구성 요소를 사용해 다양한 규모의 여러 가지 애플리케이션을 구축하는 데 도움을 주는 것이다.
이미 무수히 많은 오픈소스 프로젝트와 상업용 프로젝트에서 이 프레임워크를 사용하고 있음에도, 국내에서는 머티리얼 UI가 상대적으로 많이 알려져 있지 않다. 이 책이 부디 국내 개발자들이 머티리얼 UI로 애플리케이션에서 더 나은 사용자 경험을 제공하는 데 작게나마 도움이 될 수 있길 기대해본다.
다소 상투적으로 들릴 수도 있겠지만, 작업을 마치고 나면 미흡한 부분에 대해 아쉬움이 남기 마련이다. 꽤 많은 시간과 노력을 기울여 작업했지만, 저자의 의도를 충분히 전달하지 못했거나 잘못 번역된 부분이 있을 수 있다. 잘못된 점을 비롯해 책 내용과 관련된 어떤 의견이라도 보내주시면 소중히 다룰 것을 약속한다.


목차


1장 그리드 - 페이지에 구성 요소 배치하기
__소개
__브레이크포인트 적용
__공간 채우기
__컨테이너와 항목의 추상화
__고정열 레이아웃
__열 방향 변경

2장 앱바 - 모든 페이지의 최상위 수준
__소개
__고정된 위치
__스크롤 시 숨기기
__툴바 추상화
__내비게이션과 함께 사용하기

3장 드로어 - 내비게이션 제어를 위한 장소
__소개
__드로어 타입
__드로어 항목 상태
__드로어 항목 내비게이션
__드로어 섹션
__앱바 상호작용

4장 탭 - 콘텐츠를 탭 섹션으로 그룹화하기
__소개
__앱바 통합
__탭 정렬
__상태에 기반한 탭 렌더링
__탭 콘텐츠 추상화
__경로로 탭 탐색하기

5장 확장 패널 - 콘텐츠를 패널 섹션으로 그룹화하기
__소개
__상태 저장 확장 패널
__패널 헤더 서식 지정
__스크롤 가능한 패널 콘텐츠
__패널 콘텐츠 지연 로딩

6장 리스트 - 간단한 수집 데이터 표시
__소개
__상태를 사용한 리스트 항목 렌더링
__리스트 아이콘
__리스트 아바타와 텍스트
__리스트 섹션
__중첩된 리스트
__리스트 제어
__리스트 스크롤

7장 테이블 - 복잡한 수집 데이터 표시
__소개
__상태 테이블
__정렬 가능한 열
__행 필터링
__행 선택
__행 동작

8장 카드 - 상세 정보 표시
__소개
__메인 콘텐츠
__카드 헤더
__동작 수행하기
__미디어 표현
__확장 카드

9장 스낵바 - 임시 메시지
__소개
__스낵바 콘텐츠
__상태로 가시성 제어하기
__스낵바 전환
__스낵바 위치 지정
__오류 경계와 오류 스낵바
__스낵바 동작
__스낵바 큐

10장 버튼 - 동작 시작하기
__소개
__버튼 변형
__버튼 강조
__링크 버튼
__플로팅 동작
__아이콘 버튼
__버튼 크기

11장 텍스트 - 텍스트 입력 수집
__소개
__상태로 입력 제어하기
__자리표시자와 헬퍼 텍스트
__유효성 검사 및 오류 표시
__패스워드 필드
__멀티라인 입력
__입력 꾸미기
__입력 마스킹

12장 자동 완성과 칩 - 여러 항목에 대한 텍스트 입력 제안
__소개
__자동 완성 구성 요소 만들기
__자동 완성 제안 선택
__API 기반 자동 완성
__검색 결과 강조
__독립형 칩 입력

13장 선택 - 선택 사항의 결정
__소개
__체크박스 그룹 추상화
__체크박스 항목 사용자 정의
__라디오 버튼 그룹 추상화
__라디오 버튼 유형
__체크박스를 스위치로 바꾸기
__상태로 선택 제어하기
__여러 항목 선택

14장 선택 도구 - 날짜와 시간 선택
__소개
__날짜 선택 도구 사용
__시간 선택 도구 사용
__초기 날짜 값과 시간 값 설정
__날짜 및 시간 구성 요소 결합
__다른 날짜 및 시간 패키지 통합

15장 대화상자 - 사용자 상호작용을 위한 모달 화면
__소개
__양식 입력 수집
__동작 확인
__경고 표시
__API 통합
__전체 화면 대화상자 만들기
__대화상자 콘텐츠 스크롤

16장 메뉴 - 팝 아웃되는 동작 표시하기
__소개
__상태로 메뉴 구성하기
__메뉴 스크롤 옵션
__메뉴 전환 사용하기
__메뉴 항목 사용자 정의

17장 타이포그래피 - 폰트의 룩앤필 제어하기
__소개
__타이포그래피 유형
__테마 색상 사용
__텍스트 정렬
__텍스트 래핑

18장 아이콘 - 룩앤필에 맞게 아이콘 향상시키기
__소개
__아이콘 색상
__아이콘 크기 조정
__동적으로 아이콘 로드하기
__테마 아이콘
__더 많은 아이콘 설치하기

19장 테마 - 앱의 룩앤필 중앙집중화하기
__소개
__팔레트 이해하기
__밝은 테마와 어두운 테마 비교
__타이포그래피 사용자 정의
__테마 중첩
__구성 요소 테마 설정 이해

20장 스타일 - 구성 요소에 스타일 적용하기
__소개
__기본 구성 요소 스타일
__범위 구성 요소 스타일
__구성 요소 스타일 확장
__스타일을 테마로 이동하기
__그 외 스타일링 옵션

교환 및 환불안내

도서교환 및 환불
  • ㆍ배송기간은 평일 기준 1~3일 정도 소요됩니다.(스프링 분철은 1일 정도 시간이 더 소요됩니다.)
  • ㆍ상품불량 및 오배송등의 이유로 반품하실 경우, 반품배송비는 무료입니다.
  • ㆍ고객님의 변심에 의한 반품,환불,교환시 택배비는 본인 부담입니다.
  • ㆍ상담원과의 상담없이 교환 및 반품으로 반송된 물품은 책임지지 않습니다.
  • ㆍ이미 발송된 상품의 취소 및 반품, 교환요청시 배송비가 발생할 수 있습니다.
  • ㆍ반품신청시 반송된 상품의 수령후 환불처리됩니다.(카드사 사정에 따라 카드취소는 시일이 3~5일이 소요될 수 있습니다.)
  • ㆍ주문하신 상품의 반품,교환은 상품수령일로 부터 7일이내에 신청하실 수 있습니다.
  • ㆍ상품이 훼손된 경우 반품 및 교환,환불이 불가능합니다.
  • ㆍ반품/교환시 고객님 귀책사유로 인해 수거가 지연될 경우에는 반품이 제한될 수 있습니다.
  • ㆍ스프링제본 상품은 교환 및 환불이 불가능 합니다.
  • ㆍ군부대(사서함) 및 해외배송은 불가능합니다.
  • ㆍ오후 3시 이후 상담원과 통화되지 않은 취소건에 대해서는 고객 반품비용이 발생할 수 있습니다.
반품안내
  • 마이페이지 > 나의상담 > 1 : 1 문의하기 게시판 또는 고객센터 1800-7327
교환/반품주소
  • 경기도 파주시 문발로 211 1층 / (주)북채널 / 전화 : 1800-7327
  • 택배안내 : CJ대한통운(1588-1255)
  • 고객님 변심으로 인한 교환 또는 반품시 왕복 배송비 5,000원을 부담하셔야 하며, 제품 불량 또는 오 배송시에는 전액을 당사에서부담 합니다.