Component Based UI - 401-advanced-javascript-billybunn/seattle-javascript-401d29 GitHub Wiki

JSX

JSX is a type of syntax that merges JavaScript and HTML markup together. It's a visually easier way to write markup with JavaScript. It almost looks like a templating language.

It might seem nasty to mix together these two technologies (may not seem to follow the separation of concerns principle at first), but really it makes sense for UI work—logic and markup will always go together in a changing UI, so React doesn't separate these technologies. Rather, it separates concerns by grouping JSX into React modules.

JSX produces React "elements" that can be rendered to the DOM and re-rendered as they change. Elements represent what you want to see rendered to page.

Rendering Elements

Every React element is rendered by the React DOM in a <div> within index.html with an id="root".

All wiki pages are summaries of the work of others. See the top of each page for the source blogs/articles/books and their authors. All other content by Billy Bunn.

Go back to the home page

⚠️ **GitHub.com Fallback** ⚠️