리액트 관련 면접 질문 모음

리액트를 주제로 하는 개발자 면접 질문 모음입니다. 면접에서 자주 나오는 질문들이니 잘 준비해 보세요😊

기본 개념

1. React란 무엇인가요?
2. React의 주요 특징은 무엇인가요?
3. React의 가상 DOM이란 무엇인가요? 왜 사용하나요?
4. JSX란 무엇인가요?
5. React 요소(Element)와 컴포넌트(Component)의 차이점은 무엇인가요?

컴포넌트와 상태 관리

1. 함수형 컴포넌트와 클래스형 컴포넌트의 차이점은 무엇인가요?
2. 상태(state)와 속성(props)의 차이점은 무엇인가요?
3. 상태를 업데이트할 때 주의해야 할 점은 무엇인가요?
4. 리액트 훅(React Hooks)이란 무엇인가요? 가장 자주 사용하는 훅은 무엇인가요?
5. useEffect 훅은 언제 사용하나요?

라우팅

1. React Router란 무엇인가요?
2. 리액트 라우터에서 동적 라우팅(dynamic routing)은 어떻게 구현하나요?
3. BrowserRouter와 HashRouter의 차이점은 무엇인가요?

성능 최적화

1. React에서 성능 최적화를 위해 사용할 수 있는 방법은 무엇인가요?
2. 메모이제이션(Memoization)이란 무엇인가요? 리액트에서 어떻게 사용하나요?
3. React.memo와 useMemo의 차이점은 무엇인가요?

상태 관리 라이브러리

1. Redux란 무엇인가요?
2. Redux의 주요 개념은 무엇인가요? (예: Action, Reducer, Store, Dispatch)
3. Context API와 Redux의 차이점은 무엇인가요?

기타

1. React의 라이프사이클 메서드에 대해 설명해 주세요.
2. 리액트에서 에러 바운더리(Error Boundaries)는 무엇인가요?
3. 서버 사이드 렌더링(SSR)과 클라이언트 사이드 렌더링(CSR)의 차이점은 무엇인가요?
4. Next.js란 무엇인가요? 왜 사용하는 건가요?

---

더 심화된 질문들

성능 최적화 및 고급 패턴

1. 리액트에서 Reconciliation 프로세스는 어떻게 작동하나요?
2. 코드 분할(Code Splitting)이란 무엇인가요? 리액트에서 어떻게 구현하나요?
3. React에서 Suspense와 Concurrent Mode란 무엇인가요?
4. 리액트에서 레이지 로딩(Lazy Loading)은 어떻게 구현하나요?
5. React에서 성능 병목을 파악하고 최적화하는 방법에 대해 설명해 주세요.

고급 훅과 커스텀 훅

1. 커스텀 훅(Custom Hook)이란 무엇인가요? 언제 사용하나요?
2. useReducer 훅은 언제 사용하나요? useState와의 차이점은 무엇인가요?
3. useCallback과 useMemo의 차이점과 사용 사례에 대해 설명해 주세요.
4. useContext 훅은 어떻게 사용하나요? Context API와의 관계는 무엇인가요?

고급 상태 관리

1. Redux 미들웨어(Middleware)는 무엇인가요? 대표적인 미들웨어를 설명해 주세요.
2. Redux-Saga와 Redux-Thunk의 차이점은 무엇인가요?
3. 불변성(Immutability) 개념이 리액트와 상태 관리에서 중요한 이유는 무엇인가요?
4. Atomic Design 패턴이란 무엇인가요? 리액트 컴포넌트 설계에 어떻게 적용하나요?

서버 사이드 렌더링(SSR) 및 정적 사이트 생성(SSG)

1. Next.js에서 getServerSideProps와 getStaticProps의 차이점은 무엇인가요?
2. Incremental Static Regeneration(ISR)은 무엇인가요?
3. React Hydration은 무엇이며, 왜 필요한가요?
4. Static Site Generation(SSG)과 Server-Side Rendering(SSR)의 장단점에 대해 설명해 주세요.

테스트

1. 리액트 컴포넌트를 테스트할 때의 베스트 프랙티스는 무엇인가요?
2. Jest와 Enzyme의 차이점은 무엇인가요?
3. React Testing Library를 사용하는 이유는 무엇인가요? 주요 기능에 대해 설명해 주세요.
4. Snapshot 테스트란 무엇인가요? 언제 사용하나요?

기타 고급 주제

1. 리액트에서 포털(Portal)이란 무엇인가요? 언제 사용하나요?
2. Higher-Order Components(HOC)와 Render Props의 차이점은 무엇인가요?
3. React에서 컨텍스트(Context)와 prop drilling 문제를 해결하는 방법에 대해 설명해 주세요.
4. React Fiber 아키텍처는 무엇이며, 이전 React DOM과의 차이점은 무엇인가요?

---

경험 관련 질문들

프로젝트 경험 관련 질문

1. 최근에 작업한 리액트 프로젝트에 대해 설명해 주세요. 프로젝트의 목표와 결과는 무엇이었나요?
2. 리액트를 사용하여 해결한 가장 어려운 문제는 무엇이었나요? 어떻게 해결했는지 설명해 주세요.
3. 리액트 프로젝트에서 팀으로 작업한 경험이 있나요? 팀 내에서 어떤 역할을 맡았나요?
4. 리액트와 관련된 성능 이슈를 어떻게 진단하고 해결했나요?
5. 리액트 컴포넌트의 재사용성을 높이기 위해 어떤 전략을 사용했나요?

코드 및 아키텍처 관련 질문

1. 리액트 컴포넌트를 설계할 때 어떤 원칙이나 패턴을 따르나요?
2. 상태 관리 라이브러리(Redux, MobX 등)를 사용한 경험이 있나요? 그 경험을 공유해 주세요.
3. 리액트 프로젝트에서 코드 분할 및 최적화를 위해 어떤 방법을 사용했나요?
4. 리액트에서 커스텀 훅을 만들어 본 경험이 있나요? 어떤 상황에서 만들었나요?
5. 리액트 애플리케이션에서 테스트를 작성한 경험이 있나요? 어떤 도구를 사용했나요?

협업 및 문제 해결 능력 관련 질문

1. 리액트 프로젝트에서 발생한 갈등 상황을 어떻게 해결했나요?
2. 코드 리뷰 과정에서 받은 피드백 중 가장 유익했던 것은 무엇이었나요?
3. 리액트 프로젝트에서 타임라인을 지키기 위해 어떤 전략을 사용했나요?
4. 리액트와 관련된 최신 기술이나 트렌드를 어떻게 학습하고 적용하나요?
5. 리액트 프로젝트에서 버그를 디버깅한 경험에 대해 이야기해 주세요.

기타 경험 관련 질문

1. 리액트로 SPA(Single Page Application)를 개발한 경험이 있나요? 그 과정에서 배운 점은 무엇인가요?
2. 리액트와 다른 프레임워크(예: Vue.js, Angular)와 비교했을 때 어떤 차이점을 느꼈나요?
3. 리액트 프로젝트에서 CI/CD(Continuous Integration/Continuous Deployment) 파이프라인을 설정한 경험이 있나요?
4. 리액트와 GraphQL을 함께 사용한 경험이 있나요? 어떤 이점이 있었나요?
5. 리액트 프로젝트에서 접근성(A11Y)을 고려한 경험이 있나요? 어떤 도구나 방법을 사용했나요?

이 질문들을 통해 본인의 리액트 경험과 프로젝트에서의 역할을 잘 어필해 보세요! 면접 준비에 도움이 되길 바랍니다😊