https://github.com/urayushjain/skylens
SkyLens is a weather website offering real-time forecasts, radar images, and detailed reports on temperature, humidity, wind speed, and air quality for locations worldwide, ensuring accurate updates
https://github.com/urayushjain/skylens
weaather website
Last synced: 3 months ago
JSON representation
SkyLens is a weather website offering real-time forecasts, radar images, and detailed reports on temperature, humidity, wind speed, and air quality for locations worldwide, ensuring accurate updates
- Host: GitHub
- URL: https://github.com/urayushjain/skylens
- Owner: URAYUSHJAIN
- Created: 2024-11-13T20:43:51.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-11-26T16:19:55.000Z (7 months ago)
- Last Synced: 2025-02-03T02:57:57.507Z (5 months ago)
- Topics: weaather, website
- Language: HTML
- Homepage: https://skylens.netlify.app
- Size: 69.3 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# SkyLens - Weather Website
SkyLens is a weather website offering real-time forecasts, radar images, and detailed reports on temperature, humidity, wind speed, and air quality for locations worldwide, ensuring accurate updates.
### 🌐 Live Demo
Check out the live demo [here](https://skylens.netlify.app/).
## 🚀 Features
- **Real-time Weather Data**: Get current weather information such as temperature, humidity, and wind speed for any city.
- **Weather Icons**: Display weather conditions with corresponding icons (clouds, rain, clear, etc.).
- **Location Search**: Easily search for the weather by entering any city name.
- **Responsive Design**: Optimized for desktop and mobile viewing.
- **Detailed Weather Report**: View humidity, wind speed, and temperature at a glance.
## 📂 Project Structure
```plaintext
├── index.html # Main HTML file for structure
├── style.css # Stylesheet for UI design
├── images/ # Folder containing weather icons and images
│ ├── clear.png
│ ├── clouds.png
│ ├── drizzle.png
│ ├── rain.png
│ └── humidity.png
├── script.js # JavaScript file for fetching weather data and functionality
└── README.md # Project documentation
```
## 🛠️ Technologies Used
- **HTML5**: For structuring the web page.
- **CSS3**: For styling and layout.
- **JavaScript**: For weather data fetching, search functionality, and UI interaction.
- **OpenWeather API**: For fetching real-time weather data.
## 💻 How to Use -
1. **Visit the Website**: [SkyLens](https://skylens.netlify.app/)
2. **Enter a City Name**: Type the name of the city in the search bar.
3. **View Weather Data**: See the temperature, humidity, and wind speed for the city.
4. **Check Weather Icons**: View weather conditions based on icons (clouds, rain, clear, etc.).
## 📦 Installation
1. Clone the repository:
```bash
git clone https://github.com/URAYUSHJAIN/skylens.git
```
2. Open `index.html` in your browser.
## 🤝 Contributing
Contributions are welcome! Feel free to open issues or submit pull requests.
## 📝 License
This project is licensed under the [MIT License](LICENSE).
---
🌟 **Star this repository** if you found this project helpful! 😊