What is JSX in React?

JSX is a syntax extension for JavaScript that lets you write HTML-like markup inside a JavaScript file. It allows you to write HTML directly within JavaScript, which makes your code more readable and maintainable. JSX combines the expressiveness of JavaScript with HTML-like syntax, enabling you to write components in a declarative way. Despite looking like HTML, JSX is ultimately compiled into JavaScript.

const App = () => {
  const element = <h1>Hello, world!</h1>;
  return (
    <div>
      {element}
    </div>
  );
};