What is useSelector and useDispatch in React-Redux?
Answer
These are the two primary React-Redux hooks for functional components. useSelector(selectorFn): subscribes to the Redux store and returns a selected value. const count = useSelector(state => state.counter.value). The component re-renders whenever the selected value changes. Use memoized selectors (Reselect) to avoid unnecessary re-renders. useDispatch(): returns the store's dispatch function. const dispatch = useDispatch(); dispatch(increment()). Both hooks require the component to be wrapped in a <Provider store={store}>. Before hooks, connect() higher-order component was used: connect(mapStateToProps, mapDispatchToProps)(Component) — still valid but verbose. TypeScript: define typed hooks to avoid repeating types: export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector; export const useAppDispatch = () => useDispatch<AppDispatch>(). Always use the typed versions in TypeScript projects for better autocompletion and type safety.