React short notes — 2023

Important points I captured while learning React

• React applications are made with “components”. A component is a piece in the UI that has its own logic and appearance. We can control the behavior of that component using React. A component can be as small as a button, or as large as an entire web page.

Figure: Logo of react JS

• React component names must always start with a capital letter, while HTML tags must be lowercase. React components are Javascript functions that return markup.
• The “default” keyword specifies the main component in the file.
• JSX lets you include JS code inside HTML in a convenient manner. You need to have a parent tag when using JSX.
• You can respond to events by declaring event handler functions.
• We can use “state” to keep the data related to a component. We use “useState” component for this.
• Functions starting with “use” are called Hooks. You can only call Hooks at the top level of your components.
• sometimes we need to share data between components. In such a case, we need to move the state “upwards” to a common component that contains all the other components that need to share data. Then we pass the state down from the parent component to the child components.
• The information you pass down like this is called “props”.

The libraries that can be used with React

• Lodash — logic execution
• Luxon — date time
• Redux — state management
• Axios — HTTP interactions
• Jest — test framework