How would you manage the state between different components of the site

Question

With the help of code can you tell me How would you manage the state between different components of the site?

Answer 1

Method	Description	Best For
Props (Parent to Child)	Pass data from a parent component to a child using props.	Simple state sharing between parent and child.
Lifting State Up	Move state to the closest common ancestor and pass it down via props.	Sharing state between sibling components.
Context API	Provides a global state that components can access without prop drilling.	Medium-sized applications needing global state.
useReducer Hook	Manages complex state logic with reducers (similar to Redux but local to a component).	Complex state transitions in a single component.
Redux Toolkit	Centralized state management using actions and reducers.	Large applications needing a global store.
Zustand/Recoil/Jotai	Lightweight state management libraries for global state.	Alternative to Redux for simpler global state management.
React Query (for async data)	Fetches, caches, and synchronizes server state efficiently.	Managing server state and API calls.