React is primarily needed for interactive websites. We dont need react for static websites. That can be done in basic HTML. Interactive means some or most parts of the website is dynamic/changing.

React gets converted to HTML,CSS,JS under the hood by react compiler. Harder to do DOM manipulation the conventional way, when libraries already exists for that, do that.

Dynamic websites can be built in basic html,css,js also using DOM manipulation but as the app scales, it becomes difficult and we have to write too much code as a developer.

2 main react jargons are state & components. For static websites you only need components, but for dynamic websites, you need both components and state.

A state change triggers a re-render of the component. JSX is easier way to write react. JSX stands for JavaScript XML. It looks like html but its is xml. Components return XML, not HTML.

use Effect does not run on every render, it only runs after first render i.e. mounting. This is called a lifecycle event. Cleanup in use Effect can be used to write the logic for unsubscribing to the backend for the current component before it unmounts and some other component is rendered or same component re-renders.