What I Did Today
-
기술 면접 준비
-
최종 프로젝트
- 병원정보 출력 페이지 컴포넌트 UI 제작
- 탭 선택에 따른 조건부 렌더링 구현
기술 면접 준비
Question1
useRef에 대해 설명하시오.
My Answer
useRef는 렌더링에 관여하지 않는 값을 참조하는 React Hook이다. useRef는 일반적으로 useState와 비교된다. useState는 내부 속성값이 변경될 때마다 해당 결과값을 화면에 리렌더링한다. 하지만 useRef는 내부 속성값이 변경되면, 해당 값이 내부적으로는 반영되지만 렌더링에는 반영되지 않는다. 따라서 useRef는 주로 DOM 요소를 참조할 때 많이 사용한다.
Question2
useEffect의 실행 순서에 대해 설명하시오.
My Answer
useEffect는 React 컴포넌트가 렌더링될 때마다 특정 작업을 수행하는 React Hook이다. useEffect를 사용할 때는 일반적으로 의존성 배열을 입력한다. useEffect는 의존성 배열에 입력한 컴포넌트가 렌더링될 때마다 작업을 수행한다. 만일 의존성 배열이 빈 배열일 경우, useEffect는 컴포넌트가 처음 렌더링될 때 단 한 번 수행되고 이후 어떠한 렌더링이 발생하더라도 수행되지 않는다.
최종 프로젝트 일지
트러블 슈팅
배경
현재 페이지에서 사용하는 탭은 총 3가지( 기본정보 | 사진 | 리뷰 ) 이다.
기본정보 탭에는 사진 탭에서 보여주는 컴포넌트와 리뷰 탭에서 보여주는 컴포넌트의 내용이 일부 포함되어 있다.
동일한 정보를 보여주는 컴포넌트지만, 컴포넌트의 내용을 클릭했을 때 수행하는 작업은 탭에 따라 다르다.
기본정보탭 : 해당 탭으로 이동- 해당 탭 : 내용을 추가적으로 출력함
고민
해당 컴포넌트를 하나로 파일로 구현하여 선택된 탭에 따라 다르게 동작하도록 구현해야 하는가?
아니면 각 탭마다 컴포넌트 파일을 생성해야 하는가?
분석
-
하나의 컴포넌트 파일로 구현할 경우 고려해야 하는 사항
:기본정보탭에서 해당 컴포넌트를 클릭 시 해당 탭에서 동일한 컴포넌트를 출력시키는 방식인데 이게 가능한가? -
의문
: 컴포넌트가 사진/리뷰를 출력하는 역할을 수행하지만, 탭마다 동작하는 방식이 다르면 이를 동일한 컴포넌트라고 간주할 수 있을까?
해결
튜터님과의 피드백 후, 해당 컴포넌트는 탭마다 서로 다른 역할을 수행하므로 다른 컴포넌트로 간주하여 탭마다 파일을 생성하기로 결정함
Diary
밤을 새고 있다. 어제 하지 못한 부분이 너무 걸려서 어떻게든 끝내고자 시간을 쏟고 있다. 그럼에도 불구하고 집중도 제대로 되지 않고, 진전도 더디다. 희망과 자신감을 가지고 임해야 하는데, 아직까진 걱정이 앞선다.
