CodingNic

Build the Current Weather Experience

Build Weather Statistics

Build the Current Weather Experience 10 min read

Build Weather Statistics

Task

Connect the four reusable stat cards to current weather data.

File / section

src/components/WeatherStats.jsx and src/App.jsx

Change

Render <WeatherStats weather={weather} unit={unit} />. The component uses humidity, wind speed, pressure, and visibility. For metric wind speed, convert meters/second to km/h with weather.wind.speed * 3.6; imperial uses the API mph value.

Why this change matters

Stat stays reusable while WeatherStats decides which weather fields belong in the dashboard.

Test it

Confirm all four stat cards populate after a search.

Checkpoint

Humidity, wind, pressure, and visibility are displayed from live data.