Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/shaw145/weather-app
This is a Simple Weather App build using html ,css and Javacript
https://github.com/shaw145/weather-app
beginner-project html-css-javascript javascript javascript-practice javascript-project javascript-projects project weather weather-app weather-app-javascript
Last synced: about 2 months ago
JSON representation
This is a Simple Weather App build using html ,css and Javacript
- Host: GitHub
- URL: https://github.com/shaw145/weather-app
- Owner: Shaw145
- Created: 2024-04-28T09:28:12.000Z (10 months ago)
- Default Branch: master
- Last Pushed: 2024-04-30T08:33:31.000Z (10 months ago)
- Last Synced: 2024-11-05T09:47:03.636Z (3 months ago)
- Topics: beginner-project, html-css-javascript, javascript, javascript-practice, javascript-project, javascript-projects, project, weather, weather-app, weather-app-javascript
- Language: CSS
- Homepage: https://shaw145.github.io/Weather-App/
- Size: 4.99 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# Weather App Project
![Weather App Demo](images/demo.png)
## Overview
This is a simple weather app project built using HTML, CSS, and JavaScript also fully Responsive. The app allows users to input a city and retrieves real-time weather data, including temperature, humidity, and wind speed, for that city. Additionally, the app displays dynamic city images that change with each search, enhancing the user experience (not all the time although).
The project was developed as a beginner-level JavaScript project and serves as a practical application of basic web development concepts.
## Features
- Input field to enter the desired city
- Real-time weather data retrieval using APIs
- Display of temperature, humidity, and wind speed
- Dynamic city images that change with each search## How to Use
1. Clone the repository to your local machine.
2. Open the `index.html` file in your web browser.
3. Enter the name of the city you want to check the weather for in the input field.
4. Press the "Search" button to retrieve weather data.## Technologies Used
- HTML
- CSS
- JavaScript## APIs Used
- [OpenWeather API](https://openweathermap.org/api) for weather data retrieval.
- [Unsplash API](https://unsplash.com/developers) for dynamic city images.## Credits
- [**GreatStack**](https://www.youtube.com/@GreatStackDev)