react.dev
react.dev copied to clipboard
Update `your-first-component.md`: Show example rendered output as `<img>` instead of `<img />`
In HTML, img elements are void elements that don't have an end tag and are not self-closing. This is what you would see if you opened the DOM in any modern browser; this PR updates the Using a component → What the browser sees section of the docs to more accurately reflect this.
Also, in other parts of the docs, e.g. at Writing Markup with JSX → Converting HTML to JSX, the img tag is correctly written:
<img
src="https://i.imgur.com/yXOvdOSs.jpg"
alt="Hedy Lamarr"
class="photo"
>
And an explanation is even given later on, though it's inaccurate since HTML technically does not have close-closing tags (I'll get another PR up to update that we well):
JSX requires tags to be explicitly closed: self-closing tags like
<img>must become<img />[...]
Aside (interesting read 😁): The case against self-closing tags in HTML by Jake Archibald (06 July 2023)