A responsive weather dashboard built with React (Vite) and Tailwind CSS, allowing users to search and view real-time weather data for cities worldwide.
The app fetches data from the OpenWeatherMap API and displays key information such as temperature, humidity, wind speed, and weather conditions with icons.
- 🔍 Search by City – Enter any city to view its current weather.
- 🌡️ Weather Details – Displays temperature, humidity, wind speed, and condition icons.
- 📱 Responsive UI – Styled with Tailwind CSS for seamless use across devices.
- ☁️ API Integration – Uses OpenWeatherMap API for live weather data.
- React (Vite) – Frontend framework & build tool
- Tailwind CSS – Utility-first CSS framework for styling
- OpenWeatherMap API – Source of weather data
- Vercel – Deployment platform
git clone https://github.com/GeraldOkoth/weather-dashboard.git
cd weather-dashboard
npm install
Create a .env file in the project root and add your API key:
VITE_WEATHER_API_KEY=api_key
npm run dev
The app will open automatically at http://localhost:5173 in your default browser.
🤝 Contributing
Contributions, issues, and feature requests are welcome! Feel free to open an issue or submit a pull request.
If you encounter issues:
Make sure your Node.js version is compatible
Delete node_modules and reinstall:
rm -rf node_modules && npm install
Clear the cache:
npm cache clean --force
👨💻 Author