diff --git a/README.md b/README.md index 6e6654012..095f0c21e 100644 --- a/README.md +++ b/README.md @@ -27,3 +27,25 @@ FE 카카오 선물하기 1주차 과제: React 기초 Container story 만들기 7. Grid 컴포넌트 만들기 Grid story 만들기 + +--- + +### 1주차 3단계 과제 + +Q1. webpack은 무엇이고 어떤 역할을 하고 있나요? +모던 javascript 애플리케이션을 위한 정적 모듈 번들러 +모듈번들러: HTML, CSS, JS, Image 등 모두 각각의 모듈로 보고 이를 조합해서 병합된 하나의 결과물을 만드는 도구를 의미한다. + +1. 성능 최적화 & 자동화: + 코드 축소와 사용하지 않는 코드를 제거하는 tree shaking과 같은 최적화를 수행함으로써 HTTP 요청 수를 감소하여 웹 사이트 성능을 향상 시킨다 +2. 파일 단위의 자바스크립트 모듈 관리: + 파일 하나 하나 나눠서 모듈화하여, 웹 애플리케이션 구성할 수 있게 한다. + +Q2. 브라우저는 어떻게 JSX 파일을 읽을 수 있나요? +브라우저는 JSX파일을 직접 읽을 수 없기에 JSX를 Javascript로 변환하는 작업을 진행해야한다. +그 변환 작업은 바벨과 같은 컴파일러를 통해 이루어진다. + +Q3. React에서 상태 변화가 생겼을 때 어떻게 변화를 알아챌 수 있나요? +값이 변경 되었다는 걸 판단하기 위해 리액트는 객체로 저장된 state를 비교 연산한다. +객체 비교시 판단 근거는 객체의 메모리 주소인데 직접 값을 수정하면 메모리 주소가 동일하여 리액트는 변화를 감지하지 못한다. +상태 변경을 추적하고 변경에 따라 구성요소를 다시 렌더링 하려면 setState를 사용해야한다.