Table of contents
Prerequisites
Before starting React a person should have a good understanding and logical thinking about :
HTML ( Hyper-Text Markup Language)
CSS (Cascading Style-Sheet)
JS (JavaScript)
Although React focuses on the user interface (UI) and interactivity, having a good understanding of HTML and CSS will enhance your ability to create and style components effectively.
What is React?
React is a Javascript library(not a framework) for building user interfaces. It is a component-based approach where each interface represents a specific part of the UI. One key feature of React is that it used JSX( Javascript XML ), which is a syntax extension that allows developers to write HTML-like code within JavaScript.
Fun Fact: React was developed by Facebook, which with other things was used to create Instagram.
The key unit of React is the component. A component is a self-contained module that renders some output. We can write interface elements like buttons, input fields etc. as a React component. A component can also include one or more components in its output.
Everything in React is a component that corresponds to various interface elements.
How does React work?
Unlike Javascript, React doesn't operate directly on the browser's DOM( Document Object Module), rather it works on a virtual DOM.
For every DOM object, there is a corresponding virtual DOM object with the same properties but lacking the power to directly change what's on the screen. Manipulating the virtual DOM is faster than manipulating the real DOM because no updates are immediately rendered on the screen. It's like editing a blueprint rather than physically moving rooms in a house.