초보자를 위한 리액트(React) 200제

초보자를 위한 리액트(React) 200제

$26.05
Description
따라하면서 이해하는 React A to Z
리액트를 시작하기 전에 개발 환경을 준비하는 과정부터 시작하여 예제 파일을 실행하는 방법을 안내한다. 입문부터 초급, 중급, 활용, 실무까지 5개의 파트로 나누어 단계별로 실력을 향상시킬 수 있게 구성하였다. 리액트에서 사용하는 함수와 문법, 웹 브라우저에 화면을 띄워보기로 시작되는 이 책은 변수를 관리하고 컴포넌트 유형별로 장단점을 비교하고, 태그 사용 및 이벤트 처리 구현도 할 수 있다. 또한 외부 api를 활용하는 부분도 집중적으로 다루고, node.js를 사용하여 DB 서버에서 작업을 수행할 수 있는 실무 능력까지 실습할 수 있다. 예제를 200개로 나누어 간단하게 학습할 수 있기 때문에 짧은 주기로 성취감을 얻을 수 있으며, 기능 위주의 설명으로 필요한 개발 스킬에 집중할 수 있는 장점이 있다. 이 책을 따라 하기 위한 예제 파일은 정보문화사 홈페이지(infopub.co.kr) 자료실에서 다운로드 가능하고, 학습 중 궁금한 사항의 저자 홈페이지(leejungyeoul.tistory.com)에서 피드백 가능하다.
저자

이정열

-FruitPunch대표
-인하대학교사학사/소프트웨어융합공학사
-멋쟁이사자처럼4기
-[비전공자도가능한웹프로젝트]탈잉튜터
-풀스택개발자
-아모레퍼시픽,홈플러스,LG전자쇼핑몰개발
-아주대의료원연구프로젝트개발

목차

PART1(입문)React.js시작하기
001.jsx에html적용하기
002.jsx에css적용하기
003Component사용하기
004생명주기함수render()사용하기
005생명주기함수constructor(props)사용하기
006생명주기함수staticgetDerivedStateFormProps(props,state)사용하기
007생명주기함수componentDidMount()사용하기
008생명주기함수shouldComponentUpdate()사용하기
009템플릿문자열사용하기
010var,let,const사용하기
011전개연산자사용하기
012class사용하기
013화살표함수사용하기
014forEach()함수사용하기
015map()함수사용하기
016jquery사용하기

PART2(초급)React.js기초다지기
017props사용하기
018props자료형선언하기
019propsBoolean으로사용하기
020props객체형으로사용하기
021props를필수값으로사용하기
022props를기본값으로정의하기
023props의자식Component에node전달하기
024state사용하기
025setState()함수사용하기
026state를직접변경한후forceUpdate()함수사용하기
027Component사용하기(class형컴포넌트)
028PureComponent사용하기(class형컴포넌트)
029shallow-equal사용하기(class형컴포넌트)
030함수형컴포넌트사용하기
031hook사용하기
032Fragments사용하기
033map()으로element반환하기
034reactstrapAlerts사용하기
035reactstrapBadge사용하기
036reactstrapBreadcrumbs사용하기
037reactstrapButtonDropdown사용하기
038reactstrapButtonGroup사용하기
039reactstrapBottons사용하기
040reactstrapCard사용하기
041reactstrapCarousel사용하기
042reactstrapCollapse사용하기
043reactstrapFade사용하기
044reactstrapForm사용하기
045reactstrapInputGroup사용하기
046reactstrapJumbotron사용하기
047reactstrapListGroup사용하기
048reactstrapModal사용하기
049reactstrapNavbar사용하기
050reactstrapPagination사용하기
051reactstrapPopovers사용하기
052reactstrapProgress사용하기
053reactstrapSpinner사용하기
054reactstrapTable사용하기
055reactstrapTab사용하기
056sweetalert2Basic사용하기
057sweetalert2position사용하기
058sweetalert2confirm사용하기
059fetchget호출하기
060fetchpost호출하기
061axiosget사용하기
062axiospost사용하기
063콜백함수사용하기
064Promisethen사용하기
065Promisecatch사용하기

PART3(중급)React.js주요개념이해하기
066click이벤트사용하기(onClick)
067change이벤트사용하기(onChange)
068mousemove이벤트사용하기(onMouseMove)
069mouseover이벤트사용하기(onMouseOver)
070mouseout이벤트사용하기(onMouseOut)
071key이벤트사용하기(onKeyDown,onKeyPress,onKeyUp)
072submit이벤트사용하기(onSubmit)
073Ref사용하기
074커링함수구현하기
075하이오더컴포넌트구현하기
076컨텍스트api사용하기
077컨텍스트로부모데이터변경하기
078redux리듀서로스토어생성하기
079redux스토어상속과디스패치함수실행하기
080redux리듀서에서스토어데이터변경하기
081react-redux로스토어상속하기
082react-redux로스토어데이터사용하기
083react-redux로스토어데이터변경하기
084redux미들웨어사용하기
085react-cookiessave사용하기
086react-cookiesload사용하기
087react-cookiesremove사용하기
088react-router-domBrowserRouter사용하기
089react-router-domRoute사용하기
090react-router-domLink사용하기
091header,footer구현하기
092home페이지만들기
093〈reactimg〉태그사용하기
094lodash디바운스사용하기
095lodash스로틀사용하기

PART4(활용)React.js외부api활용하기
096서울시유동인구데이터사용하기①-리스트페이지만들기
097서울시유동인구데이터사용하기②-OpenapiKey발급받기
098서울시유동인구데이터사용하기③-JSONViewer로데이터확인하기
099서울시유동인구데이터사용하기④-axios로api호출하기
100recharts로LineChart구현하기①(서울시유동인구데이터)
101recharts로LineChart구현하기②(서울시유동인구데이터)
102recharts로AreaChart구현하기(서울시유동인구데이터)
103recharts로BarChart구현하기(서울시유동인구데이터)
104recharts로ComposedChart구현하기(서울시유동인구데이터)
105recharts로ScatterChart구현하기(서울시유동인구데이터)

PART5(실무)개발부터배포까지실무응용
106node.jsexpress프레임워크설치하기
107node서버구동하기
108node서버api호출하기
109react서버와node서버를프록시로연결하기
110node서버api를get로json데이터호출하기
111node서버api를post로json데이터호출하기
112concurrently로react,node서버한번에구동하기
113MYSQL서버구축하기①-AWS가입하기
114MYSQL서버구축하기②-RDS인스턴스생성하기
115MYSQL서버구축하기③-RDS인스턴스포트설정하기
116MYSQLclient설치하기
117workbench로rds서버접속하기
118MYSQL스키마생성및table생성하기
119MYSQL한국시간설정하기
120MYSQL한글설정및Safe모드해제하기
121MYSQL더미데이터삽입하기
122NODE조회api만들기①-body-parser패키지사용하기
123NODE조회api만들기②-mysql서버연결하기
124NODE조회api만들기③-mybatis패키지사용하기
125NODE조회api만들기④-api호출로데이터확인하기
126REACT조회페이지만들기
127DB연결풀구현하기
128NODE등록api만들기①-insert라우터분기하기
129NODE등록api만들기②-insert쿼리추가,response처리하기
130REACT등록페이지만들기
131REACT상세조회페이지만들기
132NODE상세조회페이지만들기-select쿼리where절추가하기
133NODE수정api만들기①-update라우터분기하기
134NODE수정api만들기②-update쿼리추가,response처리하기
135REACT수정페이지만들기
136NODE삭제api만들기①-delete라우터분기하기
137NODE삭제api만들기②-delete쿼리추가,response처리하기
138REACT리스트페이지삭제기능구현하기
139파일,이미지업로드api만들기-multer패키지사용하기
140REACT등록페이지만들기-파일,이미지업로드api호출하기
141REACT등록페이지만들기-업로드경로를DB에insert하기
142REACT상세조회페이지만들기-파일,이미지명표시하기
143REACT수정페이지만들기-파일,이미지업로드api호출하기
144REACT수정페이지만들기-업로드경로DB에업데이트하기
145회원정보table생성하기
146NODE회원가입api만들기①-bcrypt로암호화하기
147NODE회원가입api만들기②-insert쿼리추가하기
148REACT회원가입페이지만들기①-입력form만들기
149REACT회원가입페이지만들기②-유효성체크하기
150REACT회원가입페이지만들기③-아이디중복체크하기
151REACT회원가입페이지만들기④-회원가입api호출하기
152NODE로그인api만들기①-라우터분기,쿼리추가하기
153NODE로그인api만들기②-bcrypt로비밀번호비교하기
154REACT로그인페이지만들기-로그인api호출하기
155회원정보암호화api만들기-jwt로회원정보암호화하기
156REACT쿠키로로그인유지하기-쿠키에회원정보저장하기
157회원정보복호화api만들기-jwt로회원정보복호화하기
158로그인회원에게권한허용하기-쿠키에서회원정보불러오기
159로그인세션시간관리하기-쿠키유효시간연장하기
160로그인상태에서만header표시하기,로그아웃구현하기
161비밀번호재설정메일템플릿만들기
162메일발송api만들기-nodemailer패키지사용하기
163비밀번호조회api만들기-라우터분기,쿼리추가하기
164아이디와회원명으로비밀번호조회api호출하기
165비밀번호재설정하기-이메일발송api호출하기
166GMAIL계정접근권한허용하기
167수신된이메일과버튼링크확인하기
168이메일토큰으로사용자인증하기
169비밀번호수정api만들기-라우터분기,쿼리추가하기
170비밀번호수정api호출

출판사 서평

실무예제로완성하는웹프로젝트!

코딩을배워본적이없는IT비전공자들도이책의예제200개를그대로따라하다보면막힘없이웹프로젝트를구현할수있게구성하였다.IT지식이부족해서개발자와의협업이힘든기획자,디자이너,마케터,영업자들도직접클라우드서버배포까지할수있게되고,다른언어개발자이지만언어의폭을넓히고싶다면리액트시작에가장적합하다.리액트는웹페이지에서눈에보이는프론트엔드에특화된언어이기때문에코드이식성과재활용성이높고출력속도가빠르다는장점이있다.그리고자바스크립트기반의언어이기때문에JS경험이있다면더욱쉽게배울수있다.이책은프론트엔드,백엔드,데이터베이스를연결해하나의프레임워크를만들고원하는웹프로젝트로구현할수있게하므로코드의연결고리를익히며익숙해지는데흥미를갖게될것이다.특히다양한강의경험이있는저자가실무에서필요로하는요소들을넣었기때문에혼자리액트를시작하고자하는자들에게적합한도서이다.