ClearSky is a modern, multilingual weather app built with Next.js and TypeScript, powered by the Visual Crossing Weather API. It offers real-time weather insights, interactive visualizations, and a sleek, responsive UI that adapts to your device, theme preference, and language.
Features
Real-time Conditions: Displays current weather including temperature, humidity, wind, and more.
Sunrise & Sunset Tracking: See how long until or since sunrise/sunset in your location.
Daily Weather Graphs:
14-Day Forecast Visualization:
UI Enhancements:
Dark/Light Mode
Celsius/Fahrenheit Toggle
Multilingual Support: English, Spanish, German, and Japanese.
Fully Responsive Design: Optimized for mobile, tablet, and desktop.
Runnig & Deploying
Run Locally
Clone the repository:
git clone https://github.com/your-username/weather-next.git
cd weather-next
Install dependencies
npm install
Set up environment variables:
WEATHER_API_KEY=your_api_key_here
Start the development server:
npm run dev
Open http://localhost:3000 to view the app in your browser. (You can set a different port, or you may be assigned a different port if 3000 is in use.)
Deploy
You can easily deploy ClearSky using platforms that support Next.js, such as Vercel:
Push your code to a GitHub/GitLab/Bitbucket repo.
Go to
vercel.com, import the project, and follow the setup steps.
Set your WEATHER_API_KEY in the environment variables
Tech Stack
Language: TypeScript
Charting: Recharts
