Which statement about JSX naming is true?

Which statement about JSX naming is true?

• A. HTML-like elements begin with lowercase; component instances begin with uppercase
• B. Both start with uppercase
• C. HTML-like elements begin with uppercase; component instances begin with lowercase
• D. Arbitrary

Answer: (A)

In JSX, capitalization signals what you’re rendering: HTML-like elements are lowercase, while React components start with an uppercase letter. This distinction lets React know how to treat each tag. Lowercase names like div, span, or p map directly to native DOM elements and will render as standard HTML. Names that begin with an uppercase letter, such as MyButton or UserCard, refer to React components (functions or classes) that you’ve defined; React will call or instantiate them to render their returned elements. If you used a lowercase name for a component, React would interpret it as a plain DOM tag, not as a component, which isn’t what you want. This is why the statement about HTML-like elements starting lowercase and components starting uppercase is the true rule.

In JSX, capitalization signals what you’re rendering: HTML-like elements are lowercase, while React components start with an uppercase letter. This distinction lets React know how to treat each tag. Lowercase names like div, span, or p map directly to native DOM elements and will render as standard HTML. Names that begin with an uppercase letter, such as MyButton or UserCard, refer to React components (functions or classes) that you’ve defined; React will call or instantiate them to render their returned elements. If you used a lowercase name for a component, React would interpret it as a plain DOM tag, not as a component, which isn’t what you want. This is why the statement about HTML-like elements starting lowercase and components starting uppercase is the true rule.