A simple web application that displays the local weather based on the user's IP address location. The application uses IP-API to determine the user's location and WeatherAPI.com to fetch weather data.
- Automatic location detection using IP geolocation
- Current weather display including:
- Temperature (°C)
- Feels like temperature
- Weather condition with icon
- Wind speed and direction
- Humidity
- Responsive design for all device sizes
- Loading and error states
- Next.js 15
- TypeScript
- Tailwind CSS
- Axios for API requests
- Zod for data validation
- Lucide React for icons
- Node.js 18.17 or later
- WeatherAPI.com API key (sign up for free at WeatherAPI.com)
- Clone the repository
- Install dependencies:
npm install- Set up environment variables:
- Copy the
.env.local.examplefile to.env.local:cp .env.local.example .env.local
- Edit
.env.localand add your WeatherAPI.com API key:NEXT_PUBLIC_WEATHER_API_KEY=your_api_key_here
- Copy the
npm run devThe application will be available at http://localhost:3000.
You can also set the environment variable directly when running the application:
NEXT_PUBLIC_WEATHER_API_KEY=your_api_key_here npm run devTo build the application for production:
npm run buildTo start the production server:
npm startFor production deployment, make sure to set the NEXT_PUBLIC_WEATHER_API_KEY environment variable in your hosting platform.
src/app/- Next.js application codecomponents/- React componentslib/- Utility functions and API servicespage.tsx- Main page componentlayout.tsx- Root layout component
This project is licensed under the MIT License - see the LICENSE file for details.