OpenWeatherClone

A modern, full-stack weather application featuring a Laravel backend (API) and a Next.js frontend. Provides real-time weather data for any city using the OpenWeatherMap API, with a beautiful, responsive UI.

Features

• Search weather by city name
• Real-time weather data: temperature, humidity, wind speed, description, and icon
• Responsive, modern UI using TailwindCSS and RippleUI
• Laravel API backend with MySQL database
• Environment variables for secure API key management

Tech Stack

• Backend: Laravel, PHP, MySQL
• Frontend: Next.js (React), TypeScript, TailwindCSS, RippleUI
• API: OpenWeatherMap

Getting Started

Prerequisites

• Node.js & npm
• PHP & Composer
• MySQL

Backend Setup (Laravel)

1. cd weather-api
2. Copy .env.example to .env and set your MySQL and OpenWeatherMap API credentials:

   OPENWEATHERMAP_API_KEY=your_api_key_here
   

3. Install dependencies:

   composer install
   

4. Generate app key:

   php artisan key:generate
   

5. Run migrations:

   php artisan migrate
   

6. Start the server:

   php artisan serve
   

Frontend Setup (Next.js)

1. cd weather-frontend
2. Install dependencies:

   npm install
   

3. Start the development server:

   npm run dev
   

Usage

• Visit the frontend at http://localhost:3000 (or your configured port)
• The backend API runs at http://localhost:8000
• Enter a city name to get live weather data

Environment Variables

• Backend: .env (Laravel)
  • OPENWEATHERMAP_API_KEY=your_api_key_here
• Frontend: .env.local (if needed for client-side API keys)

License

MIT

---

Built with ❤️ by OpenWeatherClone contributors.