1. 개념 요약

• React에서는 모든 컴포넌트가 **props(속성)**를 통해 데이터를 전달받는다.
• 부모 → 자식 방향으로만 전달되고, 자식이 부모에게 직접 값을 전달하거나 수정할 수는 없다.
• 함수 컴포넌트는 props를 **함수의 첫 번째 인자(parameter)**로 받는다.

2. 배경 지식

• React는 단방향 데이터 흐름(one-way data flow) 구조를 따른다.
• 즉, 데이터는 부모에서 자식으로만 흐르고, 반대로는 흐르지 않는다.
• props는 컴포넌트 재사용성과 유연성을 높이는 핵심 수단이다.

3. 상세 설명

3-1. 기본 사용법

// 부모 컴포넌트
function Parent() {
  return <Child name="React" />;
}

// 자식 컴포넌트
function Child(props: { name: string }) {
  return <div>Hello, {props.name}</div>;
}

• 부모는 <Child name="React" />처럼 props를 넘기고
• 자식은 function Child(props)로 받아 사용한다

3-2. 구조분해 할당 사용

function Child({ name }: { name: string }) {
  return <div>Hello, {name}</div>;
}