리액트와 함께 하는 웹 디자인

리액트와 함께 하는 웹 디자인

$35.78
Description
이 책은 반응형 디자인에 적합한 플렉스 박스 모델과 그리드 디자인을 먼저 학습한 다음, javaScript에 대한 최신 기초 지식을 간단히 학습한다. 이후 React를 사용해 웹 디자인을 수행하는 기술을 주로 학습한다. 특히 클래스 기반의 컴포넌트 설계 방식이 아닌 함수형 컴포넌트를 사용한 웹 디자인 기법을 집중적으로 학습할 것이다. 그리고 리액트 훅을 사용하는 방법, 전역 상태 변수를 다루는 방법 등을 학습한다. 리액트 훅의 도입은 함수형 컴포넌트를 사용한 웹 디자인이 대세가 되는데 큰 기여를 하였다. 물론 라우팅의 개념도 상세하게 소개하고, 소개한 라우팅을 개념을 적용해 라우팅을 구현해 보는실습도 수행한다. 그리고 책의 후반부에는 구글의 백 엔드 서비스인 파이이베이스(Firebase)와 연동하여 간단한 웹을 제작하는 실습을 할 것이다. 본 책의 흐름을 따라서 학습한다면 React를 사용한 웹 디자인의 개념을 체득할 수 있는 기회가 될 것이라고 확신하는 바이다.
저자

손승일

저자:손승일
연세대학교전자공학과학사
연세대학교전자공학과석사
연세대학교전자공학과박사
호남대학교컴퓨터공학과교수
현)한신대학교AISW교수

목차

CHAPTER1플렉스박스레이아웃11
1.1개요
1.2박스모델
1.3플렉스박스기본개념
1.4플렉스컨테이너
1.5플렉스아이템
1.6플렉스박스를사용한아이템의브라우저정중앙배치
1.7플렉스박스를사용한네비게이션바
1.8테스트용이미지사용

CHAPTER2그리드레이아웃GridLayout디자인
2.1개요
2.2그리드컨테이너(GridContainer)
2.3그리드단위fr(Fraction)적용하기
2.4Repeat()함수사용하기
2.5그리드라인(Gridline)
2.6Grid-template-areas속성
2.7그리드트랙(GridTrack)정렬
2.8그리드자동플로우(흐름)속성
2.9컨테이너레벨에서그리드셀정렬
2.10특정그리드셀정렬
2.11그리드레이아웃을이용한이미지

CHAPTER3ReactJS시작하기
3.1ReactJS소개
3.2ReactJS사용을위한기초지식
3.3자바스크립트프론트엔드라이브러리/프레임워크
3.4ReactJS의특징
3.5가상(Virtual)DOM
3.6ReactJS사용을위한준비작업
3.7ReactJS시작하기
3.8Dothome서버를통한웹서비스

CHAPTER4핵심JavaScript언어
4.1개요
4.2자바스크립트식별자(Identifier)
4.3변수(Variable)
4.4템플릿리터럴(TemplateLiteral)
4.5숫자,문자열그리고부울
4.6배열(Array)
4.7객체(Object)
4.8함수(Function)
4.9화살표함수(Arrowfunction)
4.10구조분해할당(Destructuringassignment)연산
4.11전개연산자(SpreadOperator)
4.12논리연산자||와&&
4.13NullishCoalescing연산자(??)
4.14로컬저장소(LocalStorage)
4.15모듈(Module)
4.16반복문(Loop)
4.17Map과Set
4.18Promise객체
4.19ASYNC와AWAIT
4.20FetchAPI

CHAPTER5함수형컴포넌트FunctionalComponent
5.1개요
5.2클래스형컴포넌트와함수형컴포넌트
5.3기존HTML파일을컴포넌트로의분할
5.4컴포넌트(모듈)의import와export
5.5컴포넌트에서props파라미터전달
5.6리액트컴포넌트렌더링

CHAPTER6리액트문법JSX
6.1개요
6.2JSX의특징
6.3JSX기초문법
6.4HTML스타일속성적용하기
6.5CSS모듈(Module)을사용한스타일적용하기
6.6조건문(ConditionalStatement)
6.7리액트에서배열사용하기
6.8리액트에서이미지사용하기
6.9리액트이벤트(ReactEvents)

CHAPTER7리액트라우터ReactRouter
7.1리액트라우터개요228
7.2리액트라우터설치및관련컴포넌트
7.3Link가없는웹
7.4라우팅훅(RoutingHooks)
7.5Outlet컴포넌트
7.6리액트라우터를적용한디자인

CHAPTER8리액트훅ReactHooks
8.1개요
8.2리액트훅의종류
8.3useState훅
8.4useEffect훅
8.5useRef훅
8.6useContext훅
8.7useMemo훅
8.8memo컴포넌트
8.9useCallback훅
8.10useReducer훅

CHAPTER9전역상태관리용Recoil과ReduxToolkit
9.1개요
9.2Recoil
9.3ReduxToolkit(리덕스툴킷)

CHAPTER10파이어베이스Firebase
10.1파이어베이스개요
10.2Firebase프로젝트생성하기
10.3Firebase를사용한사용자인증(Authentication)
10.4Firestore데이터베이스
10.5Firebase스토리지(Storage)

CHAPTER11Firebase와연동한심플웹페이지
11.1Firebase서버와연동한실습의개요
11.2프로젝트를위한패키지설치
11.3프로젝트의구성
11.4웹페이지결과화면
11.5소스코드설명
11.6로드완료시데이터읽어오기
11.7회원등록시유효성검증

CHAPTER12리액트부트스트랩ReactBootstrap
12.1개요
12.2리액트부트스트랩활용을위한준비작업
12.3aspropAPI와variant속성
12.4반응형레이아웃
12.5간단한예제
12.6여러가지리액트부트스트랩의컴포넌트
12.7리액트부트스트랩라우팅예제