React

React는 웹 프레임워크로, 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다.

Create-React-App ( CRA )

JSX 문법

계속해서 변화하는 동적인 값, 값에 따라 다른 행동을 수행하게 합니다.

컴포넌트에 데이터를 전달하는 방법

사용자 입력 처리

DOM 요소를 접근 할 수 있는 기능 입니다.

리스트 렌더링 ( 조회 ) 배열을 사용하여 리스트 렌더링을 할 수 있습니다. React 에서 배열은 게시글, 리스트, 피드 등을 표시 하는 경우 자주 사용 됩니다.

리스트 데이터 추가하기

추가 할 때와 비슷하게 상위의 data 를 바꿔야 합니다. 삭제를 하면 삭제를 한 배열로 data 의 state 를 업데이트 해야 합니다.

리스트 데이터 수정하기

React Lifecycle

함수형 컴포넌트에서 useEffect 를 이용해서 Lifecycle 를 관리 할 수 있습니다.

React에서 API 호출

React developer tools Chrome 의 확장 도구

최적화 - useMemo 연산 결과 재사용 하는 방법

React.memo - 컴포넌트 재사용

최적화 - useCallback

컴포넌트에서 상태변화 로직을 분리

컴포넌트 트리에 데이터 공급

React SPA & CSR

React - Router 기본

React - Router 응용

React - img

프로젝트 배포 준비 및 빌드

Styled-Components

React - SVG 파일 사용법