Description
A side project using the OpenWeatherMap API to provide current weather and five-day forecasts based on the user's location.
Role
- Across the project: Planning, service design, UI/UX design, and development
- Frontend: Weather API integration, pages and components, data processing, and caching logic
- Infrastructure: Vercel builds and deployments, environment variables, and CDN caching strategy
Technology
Team
- Solo project (planning, design, development, and deployment)
Website
Achievements
1. Learning and applying the Vue 3 Composition API
- Expanded beyond React by applying core Vue 3 features, including the Composition API, ref/reactive, computed, and watch.
- Learned the differences between frameworks through Vue's single-file component pattern and Vite's fast hot module replacement.
2. External APIs and data processing
- Integrated OpenWeatherMap's Current Weather and 5-Day Forecast endpoints to retrieve live weather data.
- Used the Geolocation API for automatic local weather lookups and added city-name searches.
3. UI/UX designed around the user experience
- Implemented dark and light themes, responsive layouts, and loading states.
- Saved favorite cities in local storage for quick access on return visits.
4. Deployment and operations
- Configured an automated CI/CD deployment pipeline on Vercel and managed API keys through environment variables.
- Optimized production performance and applied a CDN caching strategy.