TypeScript with React and Rematch
Thanks to TypeScript, we're now able to know which state is accessible, possibly undefined, or even doesn't exist. We just need to tweak some of the functions that we were already using, such as useDispatch
or useSelector
.
Taking src/components/Cart
as an example, let's check how Rematch makes it extremely easy to power our React views with TypeScript IntelliSense:
import type { RootState, Dispatch } from "../../store"; export const Cart = () => { const dispatch = useDispatch<Dispatch>(); const quantityById = useSelector( (rootState: RootState) => rootState.cart.quantityById ); const cartProducts = useSelector(store.select.cart. getCartProducts); const totalPrice = useSelector(store.select.cart.total);
As we saw previously, TypeScript generics are important for Rematch and also for React and Redux, since we can...