saseungmin / react-tutorial

study for react.js

✔ REACT

📌 시 작!

• START 2020/04/29

1. hello-react

• 리액트의 이해
• 리액트 특징
• 작업 환경 설정
• JSX
• 컴포넌트
• 이벤트
• 라이프사이클

2. phone-book

• 부모 컴포넌트에게 정보 전달하기
• 불변성 유지
• 데이터 필터링 시 유의사항

3. hooks-tutorial

• 함수형 컴포넌트 hooks

4. styling-react

• 컴포넌트 스타일링

5. todo-app

• 일정 관리 웹 애플리케이션 만들기
• 컴포넌트 성능 최적화시키기

6. immer-tutorial

• immer를 사용하여 불변성 유지하기

7. router-tutorial

• 리액트 라우터로 SPA 개발하기

8. news-viewer

• 외부 API를 연동하여 뉴스 뷰어 만들기

9. context-tutorial

• context API 사용법 익히기
• Consumer 대신 Hook(useContext) or 클래스 컴포넌트(static contextType) 사용하기

10. vanilla-redux

• 리덕스 라이브러리 개념 이해하기

11. react-redux-tutorial

• 리덕스를 사용하여 리액트 애플리케이션 상태 관리하기

12. learn-redux-middleware

• 리덕스 미들웨어를 통한 비동기 작업 관리

13. splitting-sample

• 코드 스플리팅
• React.lazy 와 Suspense
• Loadable Components

14. ssr-recipe

• 서버 사이드 렌더링 구현하기
• redux-thunk를 사용한 데이터 로딩
• redux-saga를 사용한 데이터 로딩
• Loadable Components를 사용한 서버 사이드 렌더링과 코드 스플리팅

15. blog

• Node.js의 Koa 프레임워크
• mongoose를 이용한 MongoDB 연동
• JWT를 통한 회원 인증 시스템 구현
• 프런트엔드 프로젝트 회원 인증 구현 (로그인, 로그아웃, 회원가입)
• 회원 별 글쓰기 기능 구현 (Quill 에디터)
• 포스트(글) 읽기, 목록 페이지 구현(HTMP필터링하기(sanitize-html),페이지네이션)
• 포스트(글) 수정, 삭제하기(modal)
• react-helmet-async로 meta 태그 설정하기
• koa-static으로 정적 파일 제공하기

16. 리액트 관련 커뮤니티

🔶 국내

• React Korea(https://www.facebook.com/groups/react.ko)
• 프런트엔드 개발 그룹(https://www.facebook.com/groups/webfrontend)

🔶 국외

• Reddit의 React 페이지 (https://www.reddit.com/r/reactjs/)
• Reactiflux (https://www.reactiflux.com/)