React 면접에서 자주 나오는 질문

React가 다루는 범위는 매우 넓고, 많은 질문 목록은 모든 영역을 똑같이 중요하게 다룹니다. 하지만 실제로는 그렇지 않습니다. 이 섹션에서는 실제로 대부분의 면접 결과를 좌우하는 개념을 다루므로, 실제 출제 분포에 맞춰 연습할 수 있습니다. 핵심은 다음 네 가지입니다.

• Hooks 동작 방식: hooks의 규칙, useEffect 의존성 배열에 무엇을 넣어야 하는지, 클린업 함수, 그리고 effect나 콜백이 오래된 state 값을 참조하는 오래된 클로저 버그입니다.
• 렌더링: 무엇이 리렌더링을 유발하는지, 재조정(reconciliation)이 트리를 어떻게 비교하는지, 그리고 리스트에서 안정적인 key가 왜 중요한지입니다.
• 상태 설계: 상태 끌어올리기, 제어 컴포넌트와 비제어 컴포넌트의 차이, 그리고 context와 외부 스토어 중 무엇이 적합한지입니다.
• 성능: React.memo, useMemo, useCallback, 그리고 이들이 언제 노이즈가 되고 언제 도움이 되는지입니다.

면접관은 각 개념의 이유를 파고듭니다. key가 고유해야 한다고 외워서 말하는 것은 점수가 되지 않습니다. 리스트 순서가 바뀔 때 React가 key를 어떻게 사용하는지 설명할 수 있어야 합니다.

대부분의 React 면접에는 그 자리에서 작은 컴포넌트를 만드는 과제가 포함됩니다. 반복적으로 등장하는 과제는 회사와 상관없이 거의 동일합니다.

• API에서 리스트를 가져와 렌더링하고, 텍스트 필터를 추가합니다.
• 검색 입력에 디바운스를 추가하고, 오래된 요청을 취소합니다.
• 유효성 검사가 있는 폼을 제어 입력으로 만듭니다.
• effect를 올바르게 정리하는 카운터나 타이머를 작성합니다.
• 반복되는 로직에서 커스텀 hook을 추출합니다.

예를 들어 미드레벨 프로덕트 직군에 지원한 프런트엔드 엔지니어라면, 데이터를 가져와 필터링하는 리스트를 만든 뒤 로딩 상태, 에러 상태, 그리고 요청 도중 컴포넌트가 언마운트되면 어떻게 되는지에 대한 추가 질문을 받게 될 가능성이 큽니다. 승패를 가르는 것은 이런 확장 부분이며, 기본 과제 자체는 최소 조건일 뿐입니다.

시간 제한과 후속 질문이 있는 상태에서 반복 연습해야 이런 과제가 자연스럽게 몸에 뱁니다. 모의 면접 페이지에서는 면접관이 계속 파고드는 타임 세션을 진행하는 방법을 다룹니다.

시니어 면접은 메커니즘에서 판단력 중심으로 옮겨갑니다. 상태 아키텍처에 대한 질문이 나옵니다. 무엇을 컴포넌트 state에 두고 무엇을 스토어에 둘지, 서버 상태와 UI 상태가 어떻게 다른지, 그리고 캐싱은 어느 계층에 두는지입니다. 렌더링 성능 질문은 더 구체적입니다. 느린 인터랙션의 원인을 찾는 방법, 메모이제이션과 구조 개선 중 무엇을 선택할지, 그리고 프로파일러의 플레임 그래프를 읽는 방법입니다.

팀이 React 위에 프레임워크를 쓰는 경우에는 서버 사이드 렌더링과 하이드레이션도 등장합니다. 하이드레이션이 무엇인지, 왜 불일치가 발생하는지, 그리고 작업을 서버로 옮기면 무엇을 얻는지입니다. 테스트 관련 질문은 특정 라이브러리의 API보다 전략에 초점을 맞춥니다. 컴포넌트 단위에서 무엇을 테스트하고 엔드투엔드에서 무엇을 테스트할지입니다.

면접 형식과 프런트엔드 채용 프로세스가 이런 라운드를 어떻게 구성하는지는 면접 유형 허브에서 다룹니다.

튜토리얼을 보는 것은 익숙함을 만들 뿐, 회상 능력을 만들지는 못합니다. 그런데 면접이 시험하는 것은 바로 지켜보는 앞에서의 회상 능력입니다. 해법은 면접의 실제 형태 그대로 반복하는 것입니다. 빈 파일에서 표준 과제를 만들고, 타이핑하면서 설명하고, 중간에 끊기는 질문에도 맥락을 잃지 않는 연습입니다. React 면접이 여전히 도입부로 사용하는 순수 JavaScript 기초를 포함해 인접 스택의 문제 모음은 문제 은행 허브에 있습니다.

솔직히 말하면, React 면접은 거의 항상 공유 에디터에서 진행되거나 화면이 그대로 보이는 상태로 진행되며, 화면에 있는 모든 것은 면접관에게 보입니다. 어시스턴트는 준비와 연습 단계에서 쓸 것이지, 화면을 공유하는 면접 그 자체에서 쓸 것이 아닙니다. 합법적인 라이브 사용을 위해 SubcueAI의 오버레이는 항상 사용자의 로컬 기기 안에만 머물고, 봇이 통화에 참여하는 일도 없습니다. 연습 세션 설정 방법은 튜토리얼 페이지에 있습니다.