Skip to main content

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.

Weather App TS has no backend and requires no API key — all weather and geocoding data is fetched directly from the free Open-Meteo API at runtime. The only prerequisites are Node.js 18 or later and npm (or an equivalent package manager such as Yarn or pnpm). Once those are in place you can go from a fresh clone to a running local dashboard in under five minutes.
1

Clone the repository

Use git clone to download the project source and then change into the new directory.
git clone https://github.com/cristhianblaffita-web/Weather-App-Ts.git
cd Weather-App-Ts
2

Install dependencies

Install all production and development dependencies declared in package.json. Choose whichever package manager you prefer.
npm install
3

Start the development server

Launch the Vite development server with hot module replacement enabled.
npm run dev
Vite will start almost instantly and print a local URL to the terminal. Open http://localhost:5173 in your browser to see the live dashboard. Any file change you save is reflected in the browser within milliseconds — no manual refresh needed.
4

Search for a city

The app loads Berlin by default (see Default City below). To explore weather for a different location, click the search bar in the navigation header and start typing a city name. The debounced autocomplete queries the Open-Meteo Geocoding API after a brief pause and presents a list of matching places. Select any result and the dashboard immediately fetches and renders current conditions, the hourly forecast, and the 7-day daily forecast for that location.

​
Available Scripts

The four scripts defined in package.json cover the full development and deployment lifecycle.
ScriptCommandDescription
devnpm run devStarts the Vite development server with HMR at http://localhost:5173
buildnpm run buildType-checks the project with tsc -b then bundles it for production output
previewnpm run previewServes the production build locally to verify the output before deploying
lintnpm run lintRuns ESLint across the entire project to surface code-quality issues

​
Default City

When the application boots for the first time — before any city has ever been selected — WeatherContext.tsx falls back to a hardcoded DEFAULT_CITY constant that points to Berlin, Germany. 
const DEFAULT_CITY: Place = {
  id: 2950159,
  name: 'Berlin',
  latitude: 52.52437,
  longitude: 13.41053,
  country_code: 'DE',
  country: 'Deutschland'
};
On every subsequent visit the context reads from localStorage first. If a selectedCity entry is present — written automatically whenever the user picks a city — that stored value takes precedence over DEFAULT_CITY, so the dashboard always reopens on the location the user last viewed. If the stored value is missing or cannot be parsed (for example, after clearing browser storage), the application falls back to Berlin seamlessly without throwing an error.
Ready to understand how all the pieces fit together? Head over to the Architecture Overview to explore the data-flow between the Open-Meteo APIs, the React Context layer, custom hooks, and the UI components.

Build docs developers (and LLMs) love

Get started for freeTalk to us