Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/affancoder/weatherapp
Weather App in React Technology
https://github.com/affancoder/weatherapp
api api-call front-end-development javascript netlify project react reactjs responsive-web-design weather weather-api
Last synced: 2 days ago
JSON representation
Weather App in React Technology
- Host: GitHub
- URL: https://github.com/affancoder/weatherapp
- Owner: affancoder
- Created: 2023-11-17T10:35:34.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-07-09T08:26:54.000Z (7 months ago)
- Last Synced: 2024-07-09T10:47:19.700Z (7 months ago)
- Topics: api, api-call, front-end-development, javascript, netlify, project, react, reactjs, responsive-web-design, weather, weather-api
- Language: JavaScript
- Homepage: https://weatherapp-affan.netlify.app/
- Size: 413 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# WeatherApp Web App
I've developed a sleek and user-friendly weather app using React, from a reliable weather API. The app provides accurate and up-to-date weather information, allowing users to effortlessly check forecasts, current conditions, and more. The intuitive design ensures a seamless user experience, making it easy for anyone to stay informed about the weather with just a few clicks.
https://github.com/affancoder/WeatherApp/assets/113276865/c7a0e715-8576-40d2-908e-7b6394274617
# Weather Web App
Welcome to the Weather Web App! This application allows users to check real-time weather information, including temperature, humidity, minimum and maximum temperatures, and weather type, all through a beautiful and responsive UI built with React.
## Features
- *Real-time Weather Data*: Get up-to-date weather information for any location.
- *Temperature Details*: View current, minimum, and maximum temperatures.
- *Humidity Levels*: Check the humidity level in percentage.
- *Weather Type*: See the current weather type (e.g., sunny, cloudy, rainy).
- *Responsive Design*: Optimized for both desktop and mobile devices.
## Technology Stack
- *Frontend*: React.js
- *API*: Weather data is fetched from a reliable weather API service.
- *Styling*: CSS for beautiful and consistent design across devices.
## Installation
To run this project locally, follow these steps:
1. *Clone the repository*:
bash
git clone https://github.com/affancoder/WeatherApp.git
cd weather-web-app
2. *Install dependencies*:
bash
npm install
3. *Run the app*:
bash
npm start
The app will be available at http://localhost:3000.
## Usage
1. Enter the name of the city in the search bar.
2. Click on the "Get Weather" button.
3. View the weather information displayed on the screen.
## Screenshots
Home Page
Weather Details
## Contributing
Contributions are welcome! If you have any ideas or improvements, feel free to open an issue or create a pull request.
## License
This project is licensed under the me.
---
Developed by [MD Affan Asghar](https://github.com/affancoder)
Feel free to contact me for any queries or suggestions.