This Weather App, prerequisute for advanced pre work assignment, allows users to search for any city and retrieve its current weather conditions along with a 7-day forecast.The app displays essential weather details such as temperature, wind speed, weather conditions, and images representing the current and forecasted weather. The user can toggle between Celsius and Fahrenheit for temperature units.
Features Search by City: Enter the name of a city to view its current weather and 7-day forecast. Toggle Temperature Units: Switch between Celsius and Fahrenheit. Responsive Design: Works on desktop and mobile devices. Localized Time: Displays the current local time of the searched city. Weather Conditions & Images: Displays weather condition texts and corresponding images.
Technologies Used HTML, CSS, JavaScript, Open Meteo API for weather data, OpenCageData API for geocoding, Vite for bundling
Prerequisites Before running the app locally, ensure that you have following installed: Node.js (v14+) NPM or Yarn
How to Download and Run Locally
- Clone the repository: git clone https://github.com/Kgonlez/weather_app.git
- Navigate to the project directory: cd weather-app
- Install dependencies: npm install or yarn install
- Create an account for open cage data at https://opencagedata.com/api#quickstart for geocoding API key
- Set up your environment variables: Create a new .env file in the root of your project and add your API keys VITE_GEOCODE_API_KEY= your_opencagedata_api_key
- Run Development Server: npm run dev or yarn dev
- Open the app in your browser in local host http://localhost:5173/
API Usage OpenCageData API: Used to convert city names to geographic coordinates(latitude and longitude) Open Meteo API: Fetches current weather and 7-day forecast data using the coordinates from OpenCageData
Known Issues If the entered city name does not exist, an error message will appear.