https://github.com/rajjitlai/weather-app

A weather app showing the weather of a current location entered by the user. It uses HTML, CSS and JS utilizing Weather API
https://github.com/rajjitlai/weather-app

css html javascript js weather weather-api weather-app web web-development website

Last synced: about 2 months ago
JSON representation

A weather app showing the weather of a current location entered by the user. It uses HTML, CSS and JS utilizing Weather API

• Host: GitHub
• URL: https://github.com/rajjitlai/weather-app
• Owner: rajjitlai
• Created: 2024-03-25T00:53:13.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2024-03-25T05:22:41.000Z (about 2 years ago)
• Last Synced: 2025-07-16T17:22:46.597Z (11 months ago)
• Topics: css, html, javascript, js, weather, weather-api, weather-app, web, web-development, website
• Language: JavaScript
• Homepage:
• Size: 84 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# 🌤️ Premium Weather App

A sophisticated, interactive weather dashboard built with HTML5, CSS3 (Vanilla), and JavaScript. This application provides real-time weather analytics with a beautiful "Light Sky" aesthetic and smoky micro-animations.

![License](https://img.shields.io/badge/License-MIT-blue.svg)

![Version](https://img.shields.io/badge/Version-2.0.0-green.svg)

## ✨ Features

- **Real-time Weather Data**: Current temperature, humidity, wind speed, and location.

- **Dynamic Sky Theme**: A professional "Light Sky" design that feels alive and responsive.

- **Configurable API**: Built-in settings modal to securely store your OpenWeatherMap API key in `localStorage`.

- **Responsive Analytics**: Optimized for desktop, tablet, and mobile viewing.

- **Time Sync**: Displays current time for the searched city.

## 🚀 Getting Started

1. **Clone the repository**:

   ```bash

   git clone https://github.com/rajjitlai/weather-app.git

   ```

2. **Open `index.html`**:

   Simply open the `index.html` file in any modern web browser.

3. **Configure API**:

   Click the gear icon (⚙️) to open the settings and enter your **OpenWeatherMap API Key**.

## 🛠️ Built With

- **HTML5**: Semantic structure.

- **CSS3**: Premium glassmorphism, flexbox/grid, and @keyframes animations.

- **JavaScript**: Fetch API, LocalStorage, and dynamic DOM manipulation.

- **API**: [OpenWeatherMap API](https://openweathermap.org/api)

## ⚖️ License

Distributed under the MIT License. See `LICENSE` for more information.

---

**Maintained by Rajjit Laishram, 2026.**

*Project originally conceptualized in 2022.*