Every Tag Closed
In HTML, some elements have no closing tag, such as <img>, <br> and <input>. In JSX, every element has to be closed. An element with content gets its closing tag, as in HTML, and an element without content can close itself with a slash before >:
<img src="/react.svg" alt="Logo" />
<br />
<input placeholder="Your email" />You know the slash from <Welcome />. Without it, JSX doesn't know where the element ends. The app doesn't run, and the red message under the preview says, for example:
App.jsx(4,14): JSX element 'img' has no corresponding closing tag.The same goes for elements with content: a <p> without </p>, which browsers forgive in HTML, is a mistake in JSX.
The festival has no logo yet, so in this exercise it borrows React's, which is on our site at /react.svg.
Instructions
Above the heading, add the logo: an image img with src="/react.svg" and alt="Logo".
The first paragraph has two lines in the code, but the page shows them as one, because JSX, like HTML, turns a line break in text into a space. Put a line break br after Friday and Saturday, so that the stages are on a line of their own.
Between the second paragraph and the button, add a text field input with placeholder="Your email".