BitWithBite
Full-Stack · Quick Reference
Lesson 23 — Project 4: Course Platform Cheat Sheet
In one line: A multi-page React app with search, filter, routed detail pages, and shared favourites state via Context.
Build Checklist
1Home page with course cards
2Search bar + category filter
3Routed detail page via useParams
4Favourite toggle shared via Context
5404 route for unmatched paths
Context Pattern
const FavCtx = createContext();
function FavProvider({children}) {
const [favs, setFavs] = useState([]);
return <FavCtx.Provider value={{favs,setFavs}}>
{children}
</FavCtx.Provider>;
}
const {favs, setFavs} = useContext(FavCtx);