https://github.com/megatron-xcoder/react_weather_app
Welcome to the React Weather App! This project provides real-time weather updates for any city or country using the OpenWeather API. Built with React and styled with Tailwind CSS, this app is designed to be sleek, responsive, and user-friendly.
https://github.com/megatron-xcoder/react_weather_app
react-weather react-weather-app react-weather-application react-weatherapp updated-weather-app weather weather-app
Last synced: 4 months ago
JSON representation
Welcome to the React Weather App! This project provides real-time weather updates for any city or country using the OpenWeather API. Built with React and styled with Tailwind CSS, this app is designed to be sleek, responsive, and user-friendly.
- Host: GitHub
- URL: https://github.com/megatron-xcoder/react_weather_app
- Owner: Megatron-XCoder
- Created: 2024-06-30T20:08:40.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-04-15T10:34:49.000Z (about 1 year ago)
- Last Synced: 2025-07-19T10:42:32.228Z (11 months ago)
- Topics: react-weather, react-weather-app, react-weather-application, react-weatherapp, updated-weather-app, weather, weather-app
- Language: JavaScript
- Homepage: https://sunnyweather.vercel.app/
- Size: 425 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# :sun_with_face: :thermometer: React Weather App
Welcome to the React Weather App! This project provides real-time weather updates for any city or country using the OpenWeather API. Built with React and styled with Tailwind CSS, this app is designed to be sleek, responsive, and user-friendly.

## Features
- **Real-time Weather Data :** Get current weather details including temperature, humidity, wind speed, and visibility.
- **Responsive Design :** Optimized for viewing on all devices, from desktops to smartphones.
- **Loading Animations :** Enjoy smooth and visually appealing loading animations.
- **Error Handling :** Custom error messages for invalid city or country inputs.
- **Dynamic Icons :** Weather-specific icons for a more intuitive interface.
- **Custom Fonts :** Modern and stylish look with Google Fonts integration.
## Technologies Used
- **React :** A JavaScript library for building user interfaces.
- **Tailwind CSS :** A utility-first CSS framework for rapid UI development.
- **OpenWeather API :** Provides comprehensive weather data.
- **Axios :** A promise-based HTTP client for the browser and Node.js.
- **Varcel :** A website to deploy your projects on web.
## Getting Started
- **Deployed Link** - CLICK HERE :smiley_cat: React-Weather-App
### Prerequisites
Ensure you have the following installed on your local machine:
- React JS
- Node.js
- npm (Node Package Manager)
### Usage
- Enter the **name of a city** or **country** in the search bar and press enter.
- View the current weather details including temperature, humidity, wind speed, and more.
### Contributing
- Contributions are welcome! Please fork the repository and submit a pull request for any features, bug fixes, or improvements.
### License
- This project is licensed under the **MIT License**.
### Acknowledgments
- Icons by React Icons
- Weather data by Open Weather Map
- CSS framework by Tailwind CSS