A fast, simple and intuitive weather app with a clean interface — no clutter, no ads.
- 🌍 Geolocation-based — Automatically detects your location
- 🎨 Dynamic backgrounds — Visual effects that match the weather
- 📱 PWA support — Install on any device, works offline
- ⚡ Lightning fast — Built with Vite for optimal performance
- 🧪 Fully tested — Unit tests with Vitest, E2E with Playwright
- Node.js 20 or higher
- npm or yarn
- OpenWeatherMap API key (free)
-
Clone the repository
git clone https://github.com/your-username/weather-app.git cd weather-app -
Set up environment variables
cp .env.example .env
Then edit
.envand add your OpenWeatherMap API key:VITE_API_URL=https://api.openweathermap.org/data/2.5 VITE_API_KEY=your_api_key_here
-
Install dependencies
npm install
-
Start the development server
npm start
Open http://localhost:5173 in your browser.
| Command | Description |
|---|---|
npm start |
Start development server |
npm run build |
Build for production |
npm run preview |
Preview production build |
npm test |
Run unit tests |
npm run test:watch |
Run tests in watch mode |
npm run test:ui |
Run tests with Vitest UI |
npm run test:coverage |
Generate coverage report |
npm run e2e |
Run E2E tests |
npm run e2e:ui |
Run E2E tests with UI |
npm run lint |
Run ESLint |
npm run type-check |
Run TypeScript type checking |
The app supports dynamic backgrounds for these weather conditions:
| Type | Description |
|---|---|
| ☀️ Clear | Warm sunset gradient |
| ☁️ Clouds | Silver-gray atmosphere |
| 🌧️ Drizzle | Soft blue tones |
| 🌧️ Rain | Deep blue with rain animation |
| ❄️ Snow | Light blue with snowfall effect |
| ⛈️ Thunderstorm | Dark purple with lightning |
This project is licensed under the MIT License — see the LICENSE file for details.
Made with ❤️ by Alexsandro Silva Alves