📝 Project
LESSON 11 OF 18
Project 1 — Course Platform with Hooks
React Course Platform
Course browsing platform using all hooks from this section: filter by category, search, favourites (Context), and persisted selections (localStorage).
📝 Project 1 Checklist — Course Platform with Hooks
Combines useState, useEffect, useContext, and a custom hook.
- A course list fetched from an API (or a local JSON file) using useState + useEffect
- A search/filter input that narrows the list by category as you type
- A favourites feature using Context, so favourited state is readable from any component
- Persisted favourites using localStorage (survive a page refresh) via a custom useLocalStorage hook
- useState for the raw course list, search text, and category filter
- useEffect to fetch/load courses once on mount
- A Context provider wrapping the app for favourites state
Stretch goal: Add a loading spinner while courses are being fetched, and an empty state when the search matches nothing.