Jsx,React DOM,Components

what is jsx?

• It allows you to write HTML code directly inside the JS file.
• Before jsx,developers had to use complex JS functions to create HTML.
• with jsx,it makes HTML easier to visible

React DOM

• Acts bridge between UI and actual DOM.
• It update only the specific parts of the page we need to change.

Component

• Components are independent and reusable bits of code
• There are two common ways to write components:
• Function components
• Class components

Function component

• When creating a React component, the component's name MUST start with an upper case letter.
• React components returns HTML code.

Example
Create a Function component called Car

function Car() {
  return (
    <h2>Hi,I have a Car!</h2>
  );
}

Rendering a component

To use this component in your application, refer to it like this:

Example
Display the Car component in the "root" element:

createRoot(document.getElementById('root')).render(
  <Car />
)