HelloWorld 컴포넌트는 어떤 속성이든 <h1>으로 전달한다. JSX에서는 이것을 어떻게 구현할 수 있을까? 각 속성을 개별적으로 전달하면 코드가 더 많아진다. 또한, 속성을 변경해야 하는 경우에도 개선해야 할 코드가 밀접하게 결합된다. 각 속성을 수동으로 전달해야 하는 경우를 상상해보자. 두 단계 또는 세 단계의 컴포넌트를 거쳐 일일이 전달해야 한다면 어떨까? 그렇게 하는 것은 안티패턴이다. 다음과 같은 방법은 추천하지 않는다.

class HelloWorld extends React.Component {
  render() {
      return <h1 title={this.props.title} id={this.props.id}>
          Hello {this.props.frameworkName} world!!!
      </h1>
  }
}