Weather App TS is a React application that delivers live weather data for any city in the world — no API key required. It fetches current conditions, the next 7 hours of hourly forecasts, and a 7-day daily outlook directly from the free Open-Meteo API. The UI automatically switches between light and dark themes based on whether it is currently day or night at the selected location.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/cristhianblaffita-web/Weather-App-Ts/llms.txt
Use this file to discover all available pages before exploring further.
Introduction
Learn what Weather App TS does, how it’s structured, and the technology choices behind it.
Quickstart
Clone the repo, install dependencies, and run the app locally in under five minutes.
Architecture
Understand the component tree, data flow, and how the React Context ties everything together.
Components
Explore every UI component — props, behaviour, and rendered output documented in detail.
Hooks & Utilities
Deep-dive into the custom hooks and pure utility functions that power data fetching and formatting.
API Integration
See exactly how the app calls the Open-Meteo Weather and Geocoding APIs, with full type references.
What the app does
Search for a city
Type at least two characters into the search bar. The app debounces your input and queries the Open-Meteo Geocoding API, showing a list of matching cities.
Select a location
Click a city from the dropdown. The selection is persisted to
localStorage so the same city loads on your next visit.View current conditions
The main panel shows the current temperature, feels-like temperature, humidity, wind speed, and cloud coverage for the selected city.
Tech stack
| Technology | Role |
|---|---|
| React 19 | UI rendering and component model |
| TypeScript 6 | Static typing for all components, hooks, and API responses |
| Tailwind CSS 4 | Utility-first styling |
| Vite 8 | Development server and production bundler |
| Open-Meteo API | Free, no-key weather and geocoding data |
| React Context API | Global state management |
localStorage | Persists the last-selected city |
use-debounce | Prevents excessive geocoding API calls while typing |