A simple and clean weather application built with HTML, CSS and JavaScript that fetches real-time weather data from the OpenWeatherMap API.
- Search for weather by city name
- Displays temperature (Β°C), humidity, description and weather emoji
- Handles API errors gracefully
- Responsive layout for mobile and desktop
- Light UI with smooth styling
To make this app work, you must insert your own API key from OpenWeatherMap.
- Go to https://openweathermap.org/api
- Create a free account (takes 1 minute)
- Go to the API Keys section in your profile: https://home.openweathermap.org/api_keys
- Copy your API key
- It may take up to 15 minutes before the key becomes active
Open config.js and replace the placeholder value with your own key:
// config.js
const API_KEY = 'your_openweathermap_api_key_here';Make sure this file is present in your project directory.
Keep it private and do not commit config.js with your key.
This example includes a placeholder for learning purposes only.
- HTML5
- CSS3
- JavaScript (ES6)
- Fetch API
- OpenWeatherMap
weather-app/
βββ index.html
βββ style.css
βββ index.js
βββ config.js β your API key goes here
βββ README.md
Created by Jakub Strycharz
π‘ This project was inspired by the BroCode tutorial on YouTube.
I followed the core structure but added small improvements and extras for learning purposes.
MIT β free to use, modify and distribute.
