Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/somenath203/klimate
Click below to checkout the website
https://github.com/somenath203/klimate
light-dark-mode openweathermap openweathermap-api react reactjs shadcn shadcn-ui tailwind tailwindcss vite vitejs weather-app weather-app-react
Last synced: about 1 month ago
JSON representation
Click below to checkout the website
- Host: GitHub
- URL: https://github.com/somenath203/klimate
- Owner: somenath203
- Created: 2024-11-18T12:53:07.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2024-11-18T15:35:59.000Z (about 2 months ago)
- Last Synced: 2024-11-18T16:13:28.695Z (about 2 months ago)
- Topics: light-dark-mode, openweathermap, openweathermap-api, react, reactjs, shadcn, shadcn-ui, tailwind, tailwindcss, vite, vitejs, weather-app, weather-app-react
- Language: JavaScript
- Homepage: https://klimate-som.vercel.app/
- Size: 207 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Klimate
---
## Demo video of the overall application
https://www.youtube.com/watch?v=FJ254wKFZnM
---
## Introduction
Klimate is a web app that gives you detailed weather information for your location or any city you search for. It provides data like temperature, humidity, windspeed, sunrise, sunset, and more. The app also lets you view hourly temperature graphs and a 5-day forecast. You can save your favorite locations and easily access them later. With a light/dark mode feature, Klimate is designed for a smooth and user-friendly experience.
---
## Features of the Application
- **Detailed Weather Info**: Get information like location name, country, temperature, humidity, windspeed, and feels-like temperature. The app also shows an interactive icon to help visualize the weather.
- **Hourly Temperature Graphs**: View hourly temperature trends in a graphical format.
- **Additional Weather Details**: Check sunrise, sunset times, wind direction, pressure, and a 5-day forecast.
- **Search Any City**: Use the search bar to get weather details for any city. Your 10 most recent searches are saved under "Recent Searches."
- **Favorites**: Save the weather of any location to your favorites. The latest 10 favorites are shown on your dashboard and under the search bar.
- **Manage Favorites and Searches**:
- Remove all favorite locations or recent searches.
- Remove individual favorites directly from the dashboard.
- **Light/Dark Mode**: Switch between light and dark modes for better visibility and comfort.
---
## Technologies Used
- **React via Vite**: For building a fast and interactive user interface.
- **ShadCN UI**: For styling and UI components.
- **TailwindCSS**: For modern and responsive design.
- **TanStack Query**: For efficient data fetching and state management.
- **OpenWeatherMap API**: To fetch real-time weather data.
- **Recharts**: For creating interactive temperature graphs.
---
## Deployment Link
https://klimate-som.vercel.app/
---
## Disclaimer
The creator of this application is not responsible for any incorrect information displayed about any city or location, as the working and accuracy of the OpenWeather API, which provides the weather data, are
beyond the creator's control.