
🚀 What I Learned
React Intro
- 어떠한 흐름으로 오늘날 React가 많이 사용되고 있는지 설명할 수 있다.
- React가 무엇인지 정의할 수 있다. Click
- CRA를 설치하고 폴더와 파일이 어떻게 구성되어 있는지 설명할 수 있다.
- Component의 개념과 종류에 대해 설명할 수 있다.
- JSX 를 정의하고 기본 특성에 대해 설명할 수 있다.
- 기존에 구현한 Westagram을 React 로 변환해 렌더링 할 수 있다.
React Router, Sass
- SPA가 무엇인지 설명할 수 있다. Click
react-router-dom
를 이용해 Router Component
를 구현할 수 있다.
react-router-dom
에서 Routing
을 하는 방법 2가지와 차이점에 대해 설명할 수 있다.
<Link> Component
와 <a> tag
의 차이점에 대해 설명할 수 있다.
css
전처리기의 역할에 대해 설명할 수 있다.
sass
에서 제공하는 문법을 이용하여 css
파일을 scss
파일로 변환할 수 있다. Click
Mock Data
Array.map()
함수를 통해 컴포넌트를 재사용 할 수 있다.
- Mock data를 만들어 백엔드 API 미완성 상태에서도 차질없이 개발할 수 있다. Click
useEffect
훅에서 fetch
함수로 mock data를 가져올 수 있다.
- 상수 데이터를
javascript
로 만드는 경우와 mock data를 JSON
으로 만드는 경우를 구분하여 설명할 수 있다.
State, Props, Event
- 클래스형 컴포넌트와 함수 컴포넌트의 특징 및 Hooks의 필요성에 대해 이해한다. Click
- props의 개념에 대해 한 문장으로 설명할 수 있다. Click
- state의 개념에 대해 한 문장으로 설명할 수 있다.
- useState 훅을 사용하여 React 컴포넌트의 상태를 관리할 수 있다.
- state를 이용해서 UI의 변경을 표현할 수 있다.
- 이벤트를 통해 state를 변경할 수 있다.
- props의 개념을 이용해 부모 요소의 state를 자식 요소에서 반영시킬 수 있다.
- props의 개념을 이용해 자식에서 일어난 이벤트로 부모의 state값을 바꿀 수 있다. (State 끌어올리기)