신입 프론트엔드 면접 질문 리스트 : React

일반

• 리액트가 2013년에 나왔는데 왜 나왔는지 고민해본 적 있나요?
• 리액트를 사용하는 이유에 대해 설명해 주세요.
• 리액트에 대해 설명해 주세요.
• Flux 패턴에 대해 설명해 주세요.
• 리액트의 특징에 대해 설명해 주세요.
• 리액트의 dev 모드에 대해 설명해 주세요.
• 리액트의 가장 큰 장점과 가장 큰 단점에 대해 설명해 주세요.
• Next.js의 다양한 렌더링 패턴 중 어떤 방식을 사용했나요?
• Next.js 어떤 버전을 사용했나요? 해당 버전에 라우팅 방식에 대해 설명해 주세요.
• Next.js 14 버전에서 새로 나온 기능에 대해 설명해 주세요.
• Next.js Hydration 오류가 무엇인가요?

Components

• 클래스형 컴포넌트와 함수형 컴포넌트의 차이는 무엇일까요?
• 제어 컴포넌트와 비제어 컴포넌트에 대해 설명해 주세요.
• React.Fragment에 대해 설명해 주세요.

Hooks

• 리액트에선 메모이제이션을 어떤 방식으로 하나요?
• useMemo와 useCallback에 대해 설명해 주세요.
• React.memo와 useMemo의 차이에 대해 설명해 주세요.
• Ref의 용도에 대해 설명해 주세요.
• useEffect와 useLayoutEffect의 차이점에 대해 설명해 주세요.
• Pure Component에 대해 설명해 주세요.

Props

• props에 대해 설명해 주세요.
• props drilling은 무엇이고 어떻게 해결할 수 있나요?
• key props를 사용하는 이유는 무엇인가요?
• props와 state의 차이는 무엇인가요?
  
  

State

• React에서 State의 불변성은 어떻게 유지할 수 있나요?
• setState는 동기적으로 작동하나요? 아니면 비동기적으로 작동하나요?
• 왜 state를 직접 바꾸지 않고 useState를 사용해야 하나요?
• React에선 state를 어떻게 관리하나요?
• 데이터를 자식에서 부모로도 전달할 수 있나요?
• 리액트에서 상태 변화가 생겼을 때 변화를 어떻게 알아채나요?

Rendering

• virtual DOM 이 무엇인지 설명해주세요.
• virtual DOM 작동 원리에 대해 설명해주세요.
• 컴포넌트 life cycle에 대해 설명해주세요.
• 리액트의 렌더링 성능 향상을 위해 어떻게 해야 하나요?

State Management

• Redux에 대해 설명해 주세요.
• Redux를 사용하는 이유에 대해 설명해 주세요.
• Redux의 장단점에 대해 설명해 주세요.
• Context API와 Redux를 비교해 주세요.
• Redux의 3대 원칙에 대해 설명해 주세요.
• Recoil을 사용해 보셨나요?
• Recoil의 Loadable의 개념에 대해 설명해 주세요.
• Recoil에서 로딩, 성공, 에러와 관련된 처리를 어떻게 하셨나요?
• Redux와 Recoil, Zustand에 대해 비교 설명해 주세요.

Library

• React-Hook-Form의 장점을 알고있나요?
• Axios를 어떤 방식으로 사용했나요?

ETC.

• Context API에 대해 설명해 주세요.
• 리액트에서 JSX 문법이 어떻게 사용되나요?
• 리액트 18 버전 업데이트 내용에 대해 말씀해 주세요.
• HTML과 React의 이벤트 처리 차이점에 대해 설명해 주세요.
• HOC에 대해 설명해 주세요.
• Portal에 대해 설명해 주세요.
• 에러 바운더리에 대해 설명해 주세요.
• Client Side Routing에 대해 설명해 주세요.