Now that we’re thinking outside the component, let’s talk about HTML.
JSX and HTML are not the same thing but they are siblings.
React (on the web) takes JSX descriptors and renders them as HTML elements.
HTML is an initialism for HyperText Markup Language. It’s a scripting language baked into every web browser — designed to make the web navigable and interactive.
The cornerstone element of HTML is
<a> (anchor) an element that connects one web document to another with a click or tap. Additional elements like
<button> make web documents dynamic.
Unassisted, HTML has a fairly simple event loop:
- You request a document from a server via URL
- The browser renders the returned document
- You click a link or submit a form — requesting another URL
- The browser renders that returned document
React’s role is to make DOM event intercepting and page updating easier with a declarative component model.
Take it home
At the end of the day, React is limited to the HTML elements available in today’s browsers.
Develop a command of HTML and you’ll be a more capable React developer.
It’s a fun exercise to see how many HTML elements you can name by memory. After about 2 hours of, I’d reached 74. Then called it quits 😅