An open API service indexing awesome lists of open source software.

https://github.com/kaushalsahu07/weather

Weather app By Using HTML, CSS, JAVASCRIPT & API
https://github.com/kaushalsahu07/weather

api css html javascript openweathermap-api

Last synced: 8 months ago
JSON representation

Weather app By Using HTML, CSS, JAVASCRIPT & API

Awesome Lists containing this project

README

          

# Weather App

Welcome to the Weather App repository! This project is a web application that provides real-time weather updates for any location. It utilizes HTML, CSS, and JavaScript to deliver a user-friendly interface and fetches data using the OpenWeatherMap API.

## Features

- **Live Weather Data**: Get up-to-date weather information for your current location or search for any city worldwide.
- **5 Days Forecast**: You Can See your city 5 days forecast
- **Explore Section**: You Can See Many Random City Weather On Explore Section
- **Add More Citys**: You Can Add More Citys

### Technologies Used

- **Frontend**: HTML, CSS, JAVASCRIPT
- **API**: [OpenWeatherMap](https://openweathermap.org/)
- **Icons**: [Fontawesome](https://fontawesome.com/)

### Additional information

- **To get name of the location (city name or area name) by using longitude and latitude** :-
https://openweathermap.org/api/geocoding-api

- **To get current location weather** :-
https://openweathermap.org/current

- **To get 5 day forecast** :- https://openweathermap.org/forecast5

## Getting Started

To get a local copy up and running, follow these simple steps.

### Prerequisites

- A modern web browser.
- An API key from [OpenWeatherMap Api](https://home.openweathermap.org/api_keys)

### Installation

1. Clone the repository:
```sh
git clone https://github.com/kaushalsahu07/weather.git
```
2. Navigate to the project directory:
```sh
cd weather
```
3. Change API key for all the js files
```javascript
let apiKey = "Your API Key";
```
4. Open `index.html` in your browser to view the project.

### Usage

To use the Weather App, simply enter the name of the city in the search bar and press enter. The app will display the current weather conditions, including temperature, humidity, wind speed, and more.

## Contact
For any inquiries, reach out at [kaushalsahu.me@gmailcom](mailto:kaushalsahu.me@gmailcom).

GitHub: [@kaushalsahu07](https://github.com/kaushalsahu07).

Linkedin: [@kaushalsahu07](www.linkedin.com/in/kaushalsahu07).

Instagram: [@cd.kaushal](https://www.instagram.com/cd.kaushal?igsh=cTVram1ia3Vvamxz).

Portfolio: [Website Link ](https://kaushalsahu07.github.io/portfolio/).

X (Tweeter): [@kaushalsahu_07](https://x.com/kaushalsahu_07?t=7nk-jApWrJkgW6YwklJZWQ&s=09).