Weather Dashboard Web App
A responsive web dashboard that fetches current weather and a multi-day forecast from a public API and visualizes temperature trends with Chart.js. Learners practice the Fetch API, async/await, and integrating a charting library.
- Estimate
- ~9h
- Steps
- 6
- Completed by
- 0
- Proposed by
- codeseed.app
Fetch API · Chart.js · HTML/CSS
Project roadmap
- 01
Build the search UI
~1.5hCreate a city search input with debounced user input handling.
- 02
Fetch weather data
~1.5hUse async/await with the Fetch API to retrieve current and forecast weather data.
- 03
Show current conditions
~1.5hRender a styled summary card with icons and current temperature.
- 04
Plot the forecast
~2hUse Chart.js to plot the multi-day temperature trend.
- 05
Add search history
~1.5hStore recent searches in localStorage and let users reselect them quickly.
- 06
Handle errors and loading
~1hAdd loading spinners and graceful error messages for failed API calls.
Resources
- DocsJavaScript (MDN)
Ready to build this?
Get a GitHub repo and start building. Your AI reviewer checks each step as you go.
Tech stack