React Fundamentals: Rendering Elements

Create and Render a React Element

Write a React element using JSX that displays your name inside an <h2> tag and render it to the DOM.

Expected output: An <h2> element displaying your name rendered on the webpage.

Hint: Use ReactDOM.render() and ensure your JSX has a single parent element.

Convert JSX to React.createElement

Rewrite a JSX element into the equivalent React.createElement syntax.

Expected output: A React element created without JSX that renders the same UI.

Hint: Remember React.createElement takes type, props, and children as arguments.

A React element is a plain object describing a UI node, created using JSX or React.createElement, and is immutable.

React uses a virtual DOM to compare changes and only updates the parts of the real DOM that have changed.

JSX is a syntax extension that looks like HTML and compiles to React.createElement calls to create React elements.