What is state in React, and how is it different from props?
- State is an object that belongs to a React component and can be used to store and manage data that can change over time. It is mutable and can be changed by the component itself. In contrast,
- props are read-only and passed from a parent component to a child component.
What are React Hooks, and how do they work?
- React Hooks are functions that allow functional components to manage state and side effects.
- The most common hooks are useState, useEffect, and useContext.
- Hooks enable functional components to have state and lifecycle features that were previously exclusive to class components.
- Example const [count, setCount] = useState(0);
- useEffect hook can be used in two primary ways: with a dependency array (an array of values) and without a dependency array.
- with a dependency array, the effect will run under specific conditions
- without a dependency array - runs on every render.
When Use Redux and Context ?
Use Redux when: You're working on a large and complex application with extensive state management needs, or when you need to handle complex asynchronous actions, middleware, and a single source of truth. Redux's predictability and mature ecosystem make it a good choice for such scenarios.
Use React Context when: You have simpler state management needs, such as sharing data between parent and deeply nested child components. React Context is great for avoiding prop drilling and keeping your component tree clean.
