Project
Time to put it all together. Pick a real public dataset, fetch it, wrangle it into shape, and render it as a chart with a proper loading state.
Members only
5 minutes readOutline (draft)
- Pick a dataset: suggest 2 or 3 public APIs (e.g., World Bank indicators, GitHub repo stars over time, Open-Meteo weather). Student picks one.
- Step 1. Inspect the response: open the URL in a browser, read the shape, decide what fields you'll use.
- Step 2. Fetch with the canonical pattern: useEffect + loading + error states. Carry over the patterns from the fetching lesson.
- Step 3. Wrangle: reshape, group, or aggregate so the data fits the chart you have in mind.
- Step 4. Render: any chart type from earlier modules. Keep it small. The fetching pipeline is what's being graded today.
- Step 5. Polish: spinner, retry on error, sensible empty state if the API returns nothing.
- Stretch: refetch when a prop changes (year picker, country picker). Foreshadows interactivity.
Oh no! 😱
This lesson isn’t available just yet.
Take a look at the status badges next to each lesson in the sidebar to see when it’s coming out.
Thanks for your patience! 🙏