WHAT IS REACT ?
React is a javascript library and as a JavaScript library this means that react is a collection of prewritten code snippets, that can be used and reused to perform some javascript functions.
Now React is a javascript library that allows you use components to build user interfaces. so we could freely say that react is mainly a declarative, component based, javascript library.
With react it is very easy to create interactive user interfaces while also being able to update and render whichever component when need be, making it a lot easier to reuse and debug codes.
React is mostly associated with component as it uses component to a achieve it's functionalities, so to say react is mainly component based, so let's talk a bit on what component is all about.
WHAT ARE REACT COMPONENTS
A react component is basically seen as bits of codes that could be reused. They perform the same function as the Function in javascript, but it's a little different because it basically returns HTML code.
Put more simply react component is seen as, a javaScript function that returns a HTML that can also take in javascript that is a javaScript that embodies HTML and you can also run javaScript inside the HTML.
So as a component based library you can easily create components that manage their own state and which you could later merge to be able to create complex user interface.
Also since the components logic is written in javascript you can pass whatever data you want to pass into this components and it would be out of DOM.
Components makes reusing bits of codes a thing reducing the bulky codebases and encouraging reusability of codes
Also component files are been saved with .jsx or . tsx for typescript and the file name should start with a capital letter
Example:
Learn.jsx
Basically JSX stands for JavaScript XML and it's a syntax extension of JavaScript or typescript that allows you write HTML in react.
React components is of two type.
The Class Component and
The Functional Component.
Did you find the article helpful? Leave a comment 🙂, if you have any questions you could also leave a comment too