SkyCast

Overview

SkyCast is a full-stack weather application built with Next.js that delivers real-time weather conditions, hourly and daily forecasts, air quality information, and interactive map-based location search. By combining SSR and CSR, it provides fast performance, improved SEO, and a seamless user experience.

Key Features

Real-Time Weather & Forecasts: Integrated WeatherAPI to provide current weather conditions, hourly forecasts, daily forecasts, and air quality information.
Interactive Location Search: Implemented location search with a customized Leaflet map, allowing users to search for locations or select them directly from the map to view weather information.
Optimized Rendering & SEO: Leveraged Next.js SSR, CSR, pre-rendering, and dynamic metadata generation to improve performance and search engine optimization.
Efficient Data Fetching: Implemented server-side and client-side data fetching using React Query and Axios to enable efficient API communication and improved application performance.
Modern User Interface: Enhanced the user experience with smooth Framer Motion animations, reusable animation HOCs, and flexible React Icons for an engaging interface.
Application Architecture: Managed application state using the Context API and utilized Next.js API Routes to securely handle client-server communication.

Tech Stack