🌤️ Weather App


A clean, responsive, and full-stack Weather App built using HTML, CSS, JavaScript, and a Node.js + Express.js backend.
Powered by the OpenWeather API, the app displays real-time weather information including temperature, humidity, wind speed, and dynamic weather icons — all wrapped in a smooth, modern UI.
📸 Screenshots
🌍 Live Demo
The application is split into two separately deployed components, showcasing a modern service-oriented architecture.
✨ Features
- 🔍 Search weather by city name
- 🌡️ Real-time temperature, humidity, wind speed
- ⛅ Dynamic weather icons that adapt to conditions
- 🔄 Now uses Node.js backend with Axios for secure API calls
→ Your OpenWeather API key is hidden on the server
- ⚠️ Proper error handling for unknown cities
- 🎨 Modern, fast, responsive UI
- 🌐 Smooth frontend–backend integration
🧰 Tech Stack

Frontend
- HTML5 – Structure
- CSS3 – Styling + responsive design
- JavaScript (ES6) – Fetching from backend & UI logic
Backend
- Node.js
- Express.js
- Axios – For calling the OpenWeather API
- Render – Backend deployment
- Vercel – Frontend hosting
⚙️ Setup & Installation
-
Clone the repository
git clone https://github.com/TonyStark-19/Weather-app.git
-
Install server dependencies
cd Backend
npm install
-
Add your environment variable
Create a .env file inside /Backend:
API_KEY=YOUR_OPENWEATHER_API_KEY
-
Start backend
node server.js
-
Open frontend
Just open public/index.html in your browser.
📌 Usage
-
Enter a city name in the search bar.
-
Click the search button or press Enter.
-
View real-time weather details, including:
- 🌡️ Temperature
- 💧 Humidity
- 🌬️ Wind Speed
- 🌤️ Dynamic Weather Icon
🧠 Future Improvements
- Add 5-day forecast feature
- Include geolocation for auto-detecting current city
- Switch between Celsius and Fahrenheit
- Add dark/light theme toggle
🙌 Contributing
Feel free to fork this project, make improvements, and submit a pull request!
🙌 Acknowledgements
📜 License
This project is licensed under the MIT License – which means you are free to use, modify, and distribute the code for personal or commercial purposes with proper attribution.
See the LICENSE file for full details.
💡 Built with ❤️ by Aditya chandel