props.children

React 컴포넌트에서 <Main> ... </Main> 같은 열고 닫는 태그 사이의 내용은 자동으로 props.children이라는 기본 prop으로 전달됩니다.

---

✅ children은 “기본적으로 제공되는 prop”인가?

• 네. children은 React에서 특별 취급하는 예약 prop입니다.
• <Main> ... </Main> 이렇게 쓰면, 안에 있는 JSX(...)가 자동으로 children이라는 이름으로 props 객체에 들어갑니다.
• 따라서 <Main><p>Hi</p></Main> 이라고 쓰면 props.children은 <p>Hi</p>가 됩니다.

---

✅ props에는 기본적으로 어떤 게 있나?

• React 함수형 컴포넌트에서 특별히 자동으로 생기는 prop은 사실상 children 하나뿐이에요.
• 다른 모든 prop(title, id, className, onClick 등)은 사용자가 직접 컴포넌트에 속성으로 넘길 때만 props 객체에 추가됩니다.

예시:

<Main title="메인화면" className="wrapper">
  <Home />
</Main>

→ 이 경우 props는 다음과 같습니다:

{
  title: "메인화면",
  className: "wrapper",
  children: <Home />
}

---

✅ 정리

• 자동 제공되는 기본 prop: children
• 나머지 props: 전부 사용자가 <Main someProp="..." />처럼 직접 넣어야 생깁니다.
• React는 children 말고는 기본 prop을 따로 만들어주지 않아요. (단, 클래스형 컴포넌트에서는 this.props를 통해 동일하게 접근)

---

👉 혹시 원하시면, props.children에 어떤 값이 실제로 들어가는지 콘솔로 찍어서 직접 확인해보는 예제도 보여드릴까요?

Props.Children