SkyCast-Weather-Dashboard

KO | EN

gitlite — search

#ai #llm #go #machine-learning #docker #macos #nodejs #windows #awesome #cli #awesome-list #pytorch #security #open-source

SkyCast-Weather-Dashboard

(★ 11)

SkyCast – A modern weather dashboard with real-time weather, AQI, hourly & 5-day forecasts, temperature trends, weather animations, and geolocation support.

SkyCast-Weather-Dashboard 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# 🌤️ SkyCast
![HTML5](https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white)
![CSS3](https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge&logo=css3&logoColor=white)
![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
![OpenWeather](https://img.shields.io/badge/OpenWeather-FFB703?style=for-the-badge)
![Chart.js](https://img.shields.io/badge/Chart.js-FF6384?style=for-the-badge&logo=chartdotjs&logoColor=white)
![Vercel](https://img.shields.io/badge/Vercel-000000?style=for-the-badge&logo=vercel&logoColor=white)

### Modern Real-Time Weather Dashboard

Real-time Weather • AQI • Forecast • Interactive Charts • Geolocation

</div>

A modern, responsive weather dashboard built using **HTML, CSS, and JavaScript** that provides real-time weather information, air quality, hourly forecasts, 5-day forecasts, temperature trends, weather animations, and location-based weather.

---

## 🚀 Live Demo

</p>

---

## 📸 Screenshots

### Dashboard

![Dashboard](https://raw.githubusercontent.com/chintasankarraj/SkyCast-Weather-Dashboard/main/images/dashboard.png)

---

### Forecast

![Forecast](https://raw.githubusercontent.com/chintasankarraj/SkyCast-Weather-Dashboard/main/images/forecast.png)

---

### Rain Animation

![Rain](https://raw.githubusercontent.com/chintasankarraj/SkyCast-Weather-Dashboard/main/images/rainanimation.png)

---

### 5Day Forecast

![Five Day Forecast](https://raw.githubusercontent.com/chintasankarraj/SkyCast-Weather-Dashboard/main/images/5dayforecast.png)

---

## ✨ Features

- 🌍 Search weather for any city worldwide
- 📍 Get weather using your current location
- 🌡️ Real-time temperature and "Feels Like" temperature
- 📈 Interactive Temperature Trend Chart (Chart.js)
- 🕒 Accurate Next 24 Hours Forecast
- 📅 Accurate 5-Day Weather Forecast
- 🌅 Sunrise & Sunset timings
- 🌫️ Air Quality Index (AQI)
- 💨 Wind Speed
- 💧 Humidity
- 👀 Visibility
- 🌡️ Atmospheric Pressure
- 🌧️ Dynamic Rain Animation
- ☁️ Animated Cloud Effects
- 🌙 Automatic Day/Night Theme
- 🕘 Timezone-aware forecasts
- 🔎 Recent Search History
- 📱 Fully Responsive UI
- ✨ Modern Glassmorphism Design

---

## 🛠️ Tech Stack

- HTML5
- CSS3
- JavaScript (ES6)
- OpenWeatherMap API
- Chart.js
- Vercel

---

## 📂 Project Structure

```
SkyCast/
│
├── index.html
├── style.css
├── app.js
├── README.md
└── images/
```

---

## ⚙️ Installation

Clone the repository

```bash
git clone https://github.com/chintasankarraj/SkyCast-Weather-Dashboard.git
```

Go into the folder

```bash
cd weather-app
```

Open

```
index.html
```

or run using Live Server.

---

## 📌 APIs Used

OpenWeatherMap API

- Current Weather API
- 5-Day Forecast API
- Air Pollution API
- Geocoding API

---

## 🌟 Highlights

✔ Accurate timezone handling

✔ Interactive temperature trend chart

✔ Dynamic weather animations

✔ Responsive dashboard

✔ Real-time weather data

✔ Professional UI/UX

---

## 🔮 Future Improvements

- UV Index
- Weather Alerts
- Multiple Themes
- Weather Maps
- Sunrise/Sunset Chart
- Favorite Cities
- PWA Support

---

## 👨‍💻 Author

**Chintasankarraj**

GitHub:
https://github.com/chintasankarraj

LinkedIn:
https://www.linkedin.com/in/chintasankarraj/

---

## ⭐ Support

If you like this project, consider giving it a ⭐ on GitHub.

SkyCast-Weather-Dashboard

SkyCast-Weather-Dashboard 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

SkyCast-Weather-Dashboard

SkyCast-Weather-Dashboard 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README