Basic function in React

App jsx
App.jsx is the main component file in a React application created using Vite or Create React App.

Why .jsx?
.jsx means JavaScript XML

It allows writing HTML inside JavaScript:

example

 const element = <h1>Hello</h1>;

JSX Rules in React

1. Return Only One Parent Element

2. Close All Tags

3. Use className Instead of class

4. Use Curly Braces {} for JavaScript

5. Inline CSS Uses Object

6. Attribute Names Use camelCase

7. JavaScript Expressions Allowed

8. Components Start with Capital Letter

9. Comments in JSX

10. Use htmlFor Instead of for.

Components in React
Components are reusable pieces of UI in React.
They help divide the application into small independent parts.

Examples

• Header

• Navbar

• Footer

• Login Form

• Card