Skip to content

Latest commit

 

History

History
86 lines (57 loc) · 2.21 KB

File metadata and controls

86 lines (57 loc) · 2.21 KB

Weather-App

Welcome to the Weather App, a React-based web application that provides current weather information and forecasts using OpenWeatherMap APIs. This project aims to showcase my skills in React and enhance my understanding of working with external APIs.

Demo

https://itsmetrina.github.io/weather-app/

Tech Stack

  • React
  • CSS
  • OpenWeatherMap APIs

Features

  • Current Weather: Get real-time weather data for your location or any city around the world.
  • 5-Day Forecast: Plan ahead with a 5-day weather forecast.
  • Automatically detect and display the weather for the user's current location.
  • City Search: Search for weather information by entering the name of a city.
  • Error Handling: Display informative messages if there are API errors or empty responses.
  • Day/Night Mode: Automatically switch between light and dark modes based on the time of day.
  • Responsive Design: Enjoy a seamless experience across various devices.
  • Toggle between 12hr and 24hr format.
  • Live previews

API Reference

Current Weather API

  GET /data/2.5/weather?lat=${latitude}&lon=${longitude}&appid={api_key}/&units=metric
Parameter Type Description
appid string Required. Your API key
lat number Required. Latitude of the location
lon number Required. Longitude of the location

Forecast API

  GET /data/2.5/forecast?lat=${latitude}&lon=${longitude}&appid={api_key}/&units=metric
Parameter Type Description
appid string Required. Your API key
lat number Required. Latitude of the location
lon number Required. Longitude of the location

Run Locally

Clone the project

  git clone https://github.com/itsmetrina/weather-app.git

Go to the project directory

  cd weather-app

Install dependencies

  npm install

Start the server

  npm run start

Acknowledgements

  • Layout inspired by various free weather website templates.
  • OpenWeatherMap for providing the Current Weather, and Forecast APIs.