Skip to content

utkarsh-235/Weather-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

weather.mp4

Weather App

A simple and visually appealing weather application built using React.js. This app allows users to search for the current weather in any city and dynamically changes the background to match the weather conditions of the searched location.

Features

  • Dynamic Background: The app's background adapts to reflect the weather conditions (e.g., sunny, rainy, snowy).
  • City Search: Search for the weather of any city around the globe.
  • Weather Data: Displays temperature, weather description, and other details fetched from a weather API.
  • Responsive Design: Works seamlessly across devices, including desktops, tablets, and smartphones.

Technologies Used

  • React.js: Frontend library for building the user interface.
  • CSS: For styling the app.
  • OpenWeatherMap API: For fetching real-time weather data.

Installation

  1. Clone the repository:

    git clone https://github.com/your-username/weather-app.git
  2. Navigate to the project directory:

    cd weather-app
  3. Install dependencies:

    npm install
  4. Create a .env file in the root directory and add your OpenWeatherMap API key:

    REACT_APP_WEATHER_API_KEY=your_api_key_here
  5. Start the development server:

    npm start
  6. Open http://localhost:3000 in your browser to view the app.

Usage

  1. Enter the name of a city in the search bar.
  2. View the current weather details for the city.
  3. Enjoy the dynamic background that changes based on the weather condition.

Screenshots

Weather Display!

https://github.com/user-attachments/assets/4834928f-52fb-4ebe-9322-4bcec45eee20

Future Improvements

  • Add a 5-day weather forecast feature.
  • Include geolocation to fetch weather data for the user's current location.
  • Enhance UI with animations and additional weather details like UV index or air quality.
  • Improve accessibility and performance.

Contributing

Contributions are welcome! Feel free to open issues or submit pull requests to improve the project.

  1. Fork the repository.
  2. Create a new branch:
    git checkout -b feature-name
  3. Commit your changes:
    git commit -m 'Add some feature'
  4. Push to the branch:
    git push origin feature-name
  5. Open a pull request.

License

This project is licensed under the MIT License. See the LICENSE file for details.


Happy coding! 🚀

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published