Skip to content

A React and Flask app providing real-time weather updates and 5-day forecasts using the OpenWeatherMap API

License

Notifications You must be signed in to change notification settings

meghna-cse/weather-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

weather-app 🌦️

Welcome to the Weather App! This project is a simple yet dynamic weather application that provides real-time weather updates and a 5-day forecast for any city in the world. It also allows users to get weather updates based on their current location.

The app is built using React for the frontend and Flask for the backend, utilizing the OpenWeatherMap API for fetching weather data.

Features

  • 🌍 Search Weather by City: Enter the name of a city to get the current weather and a 5-day forecast.
  • 📍 Get Weather by Location: Click "Use My Location" to get the weather for your current location using the browser's geolocation API.
  • 📅 5-Day Forecast: Provides a 5-day weather forecast with detailed weather icons.

Demo

Weather App video demo link

Tech Stack

Installation

To run this project locally, follow these steps:

Prerequisites

  • Node.js and npm installed
  • Python and pip installed

Clone the Repository

git clone https://github.com/yourusername/weather-app.git
cd weather-app

Backend Setup

  1. Navigate to the backend directory:
cd weather-app/backend
  1. Create and activate a virtual environment:
python -m venv venv
.\venv\Scripts\activate   # On MAC, use `source venv/bin/activate`
  1. Install the required dependencies using requirements.txt:
pip install -r requirements.txt
  1. Create a config.json file in the backend directory and add your OpenWeatherMap API key.
{
  "OPENWEATHERMAP_API_KEY": "your_api_key_here"
}
  1. Run the Flask server:
python app.py

Frontend Setup

  1. Navigate to the frontend directory:
cd weather-app/frontend
  1. Install the required dependencies:
npm install
  1. Start the React development server:
npm start
  1. Open your browser and go to http://localhost:3000 to see the app in action.

License

This project is open source and available under the MIT License.

Acknowledgements

About

A React and Flask app providing real-time weather updates and 5-day forecasts using the OpenWeatherMap API

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published