- 저자 : 김용찬
- 리액트의 핵심 개념과 동작 원리부터 Next.js까지, 리액트의 모든 것
마님 | 핵기 | 주트롱 | 지윤 |
- 2023년 12월 01일 ~
- 주 1회 금요일 자정까지 각자 챕터 요약
- 주 1회 토요일 오전 10시 발표 및 Q&A 진행
- 진행 후 발표자 요약본 README.md 변경 및 Q&A 요약
- 왜 리액트인가?
- 리액트의 역사
- 1.1 자바스크립트의 동등 비교
- 1.2 함수
- 1.3 클래스
- 1.4 클로저
- 1.5 이벤트 루프와 비동기 통신의 이해
- 1.6 리액트에서 자주 사용하는 자바스크립트 문법
- 1.7 선택이 아닌 필수, 타입스크립트
- 2.1 JSX란?
- 2.2 가상 DOM과 리액트 파이버
- 2.3 클래스형 컴포넌트와 함수형 컴포넌트
- 2.4 렌더링은 어떻게 일어나는가?
- 2.5 컴포넌트와 함수의 무거운 연산을 기억해 두는 메모이제이션
- 3.1 리액트의 모든 훅 파헤치기
- 3.2 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?
- 4.1 서버 사이드 렌더링이란?
- 4.2 서버 사이드 렌더링을 위한 리액트 API 살펴보기
- 4.3 Next.js 톺아보기
- 5.1 상태 관리는 왜 필요한가?
- 5.2 리액트 훅으로 시작하는 상태 관리
- 6.1 리액트 개발 도구란?
- 6.2 리액트 개발 도구 설치
- 6.3 리액트 개발 도구 활용하기
- 7.1 크롬 개발자 도구란?
- 7.2 요소 탭
- 7.3 소스 탭
- 7.4 네트워크 탭
- 7.5 메모리 탭
- 7.6 Next.js 환경 디버깅하기
- 7.7 정리
- 8.1 ESLint를 활용한 정적 코드 분석
- 8.2 리액트 팀이 권장하는 리액트 테스트 라이브러리
- 9.1 Next.js로 리액트 개발 환경 구축하기
- 9.2 깃허브 100% 활용하기
- 9.3 리액트 애플리케이션 배포하기
- 9.4 리액트 애플리케이션 도커라이즈하기
- 10.1 리액트 17 버전 살펴보기
- 10.2 리액트 18 버전 살펴보기
- 11.1 app 디렉터리의 등장
- 11.2 리액트 서버 컴포넌트
- 11.3 Next.js에서의 리액트 서버 컴포넌트
- 11.4 웹팩의 대항마, 터보팩의 등장(beta)
- 11.5 서버 액션(alpha)
- 11.6 그 밖의 변화
- 11.7 Next.js 13 코드 맛보기
- 11.8 정리 및 주의사항
- 12.1 웹사이트와 성능
- 12.2 핵심 웹 지표란?
- 12.3 최대 콘텐츠풀 페인트(LCP)
- 12.4 최초 입력 지연(FID)
- 12.5 누적 레이아웃 이동(CLS)
- 12.6 정리
- 13.1 애플리케이션에서 확인하기
- 13.2 구글 라이트하우스
- 13.3 WebPageTest
- 13.4 크롬 개발자 도구
- 13.5 정리
- 14.1 리액트에서 발생하는 크로스 사이트 스크립팅(XSS)
- 14.2 getServerSideProps와 서버 컴포넌트를 주의하자
- 14.3 태그의 값에 적절한 제한을 둬야 한다
- 14.4 HTTP 보안 헤더 설정하기
- 14.5 취약점이 있는 패키지의 사용을 피하자
- 14.6 OWASP Top10
- 14.7 정리
- 15.1 리액트 프로젝트를 시작할 때 고려해야 할 사항
- 15.2 언젠가 사라질 수도 있는 리액트