Connect WeatherNow to the Weather API

Now that the WeatherNow interface is running, it is time to give the app access to real weather information. In this module, you will connect the project to OpenWeather and build the first part of the data flow that powers the dashboard.

You will start by preparing the API key safely through the Vite environment variable, then build the current-weather request in App.jsx. From there, you will add loading and error states so the interface can communicate what is happening while a request is in progress or when something goes wrong. Finally, you will connect the search form so a city entered by the user produces a real API response.

By the end of the module, searching for a valid city should trigger a real weather request and give WeatherNow the data it needs for the next stage. You will not build the complete weather display yet; the goal here is to establish a reliable data connection first.

What to expect:

• Configure the OpenWeather API key.
• Build the current-weather request.
• Track loading and request errors.
• Connect city search to the request flow.
• Verify a real response in the browser before moving on.