Skip to content

AyushSingh360/Basic-Weather-Program-

Repository files navigation

🌤️ Vibrant Weather

Vibrant Weather is a stylish, fast, and responsive weather dashboard built with Next.js 14, TypeScript, and Tailwind CSS.
It fetches real-time weather and forecast data using the OpenWeather API.


✨ Features

  • 🌎 Current Weather Information
  • 📅 5-Day Weather Forecast
  • 🔥 Responsive Design (Mobile-friendly)
  • 🌙 Dark Mode Support
  • 🌀 Animated Weather Icons
  • ⚡ Built with cutting-edge technologies (Next.js App Router, Server Components)

🚀 Tech Stack


🛠️ Installation & Running Locally

  1. Clone the repository:

    git clone <https://github.com/AyushSingh360/Basic-Weather-Program->
    cd vibrant-weather
  2. Install dependencies:

    npm install

    or if you prefer:

    pnpm install
  3. Configure Environment Variables:

    Create a file named .env.local in the project root, and add: please use your own Openweater Api key

    OPENWEATHERMAP_API_KEY=24f35048331ae83b69492b1fbaaeeacc
  4. Run the development server:

    npm run dev

    Open http://localhost:3000 to view it in your browser.


🧩 Project Structure

/app
  /api         → Weather API routes (server-side)
  /components  → Reusable UI components
  /hooks       → Custom React hooks
  /styles      → Global CSS
/public         → Static assets

🧹 TODOs / Future Improvements

  • Add location auto-detection (using browser Geolocation API)
  • Show weather alerts (severe weather warnings)
  • Support multiple weather providers (backup APIs)

📜 License

This project is licensed under the MIT License.


👤 Author

Ayush Singh

Built with 💻, ☕, and a lot of ☀️ and ☁️!

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published