Question 1

React의 useState 훅이란 무엇인가요?

Accepted Answer

useState는 함수형 컴포넌트에서 로컬 상태를 관리하는 React 훅입니다. 매 렌더링마다 초기화되는 일반 JavaScript 변수와 달리, useState는 연속적인 렌더링 간에 상태 값을 보존합니다. 이 훅은 현재 상태 값과 업데이트 함수를 포함하는 배열을 반환하며, 상태가 변경되면 컴포넌트의 재렌더링을 자동으로 트리거합니다.

Question 2

useState로 상태를 선언하는 올바른 구문은 무엇인가요?

Accepted Answer

올바른 구문은 배열 구조 분해를 사용하여 상태 값과 업데이트 함수를 추출합니다. 관례상, 업데이트 함수는 'set' 접두사 뒤에 camelCase로 상태 변수명이 붙습니다. 이 관례는 코드 가독성을 향상시키며 React 커뮤니티에서 널리 채택되고 있습니다. useState가 반환하는 배열의 요소 순서는 항상 같습니다: 현재 값이 먼저, 업데이트 함수가 두 번째.

Question 3

상태 업데이트 함수를 호출하면 어떤 일이 발생하나요?

Accepted Answer

상태 업데이트 함수가 호출되면, React는 새로운 상태 값으로 컴포넌트의 재렌더링을 예약합니다. 업데이트는 즉각적이지 않고 비동기적으로 이루어지며, 호출 직후에 상태 값이 변경되지 않습니다. React는 여러 상태 업데이트를 일괄 처리하여 성능을 최적화하고 불필요한 렌더링을 방지합니다. 이 배치 전략은 애플리케이션 성능을 크게 향상시킵니다.

React Hooks

React의 useState 훅이란 무엇인가요?

답변

useState로 상태를 선언하는 올바른 구문은 무엇인가요?

답변

상태 업데이트 함수를 호출하면 어떤 일이 발생하나요?

답변

이전 값을 기반으로 상태를 업데이트하는 방법은?

같은 컴포넌트에서 여러 useState 훅을 사용할 수 있나요?

기타 React / Next.js 면접 주제

JavaScript 기초

React 기초

컴포넌트 라이프사이클

React Router

Context를 활용한 상태 관리

폼과 Controlled Components

데이터 가져오기 및 API

React Query (TanStack Query)

Styling & CSS-in-JS

Next.js 기초

TypeScript와 React

Next.js 데이터 페칭

Next.js Server Actions

Next.js 라우팅 및 내비게이션

Next.js API Routes

Next.js Metadata & SEO

Next.js Middleware 및 Auth

React 테스트

Zustand State Management

React 성능 최적화

Error Boundaries & 에러 핸들링

Advanced React Patterns

Next.js 고급 기능

Next.js 배포 및 프로덕션

아키텍처 & 디자인 패턴

React Server Components

Next.js 국제화

React 보안 & 모범 사례

다음 면접을 위해 React / Next.js을 마스터하세요