https://github.com/metamars2/weatherforme.github.io
https://github.com/metamars2/weatherforme.github.io
Last synced: 10 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/metamars2/weatherforme.github.io
- Owner: MetaMars2
- License: gpl-3.0
- Created: 2025-05-05T23:18:30.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-05-06T20:22:19.000Z (about 1 year ago)
- Last Synced: 2025-06-09T10:47:39.520Z (about 1 year ago)
- Language: JavaScript
- Size: 428 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# WeatherForMe
A simple web application to display current weather information for a searched city, built with HTML, CSS, and vanilla JavaScript.
## Features
* Search for weather by city name.
* Autocomplete suggestions for city names as you type.
* Displays current temperature, "feels like" temperature, humidity, and chance of rain.
* Indicates if it's currently raining or expected to rain soon.
* Animated UI elements for a smoother user experience.
* Responsive design for different screen sizes.
## Setup
1. **Clone the repository (or download the files):**
```bash
git clone
cd WeatherForMe
```
2. **Get a WeatherAPI.com API Key:**
* Sign up for a free API key at [https://www.weatherapi.com/](https://www.weatherapi.com/).
3. **Add API Key:**
* Open the `src/script.js` file.
* Find the line `const API_KEY = "YOUR_API_KEY_HERE";` (or similar).
* Replace `"YOUR_API_KEY_HERE"` with the actual API key you obtained.
## How to Run
Simply open the `src/index.html` file in your web browser. No build step or local server is required for the basic functionality.
## API Used
* [WeatherAPI.com](https://www.weatherapi.com/) - Provides weather data and city search functionality.
## Project Structure
```
WeatherForMe/
├── .gitignore # Files ignored by Git
├── README.md # This file
└── src/
├── index.html # Main HTML structure
├── script.js # JavaScript logic and API interaction
└── styles.css # CSS styling
└── media/
└── images/
└── sunny_cloud_logo_text.png # Logo image
└── fonts/
└── Ultra-font.html # Font
```