App del Clima

Lo que vas a construir

Una aplicacion del clima con React que consume la API de OpenWeatherMap. Podras buscar cualquier ciudad y ver temperatura actual, humedad, condicion climatica e iconos del clima en tiempo real. Aprenderas a trabajar con APIs externas, manejar API keys de forma segura, y mostrar datos dinamicos en una interfaz responsive.

API recomendada

OpenWeatherMap - Gratis hasta 1000 llamadas/día

Paso 1: Obtén API Key

1. Crea cuenta en openweathermap.org
2. Ve a API Keys
3. Copia tu key

Paso 2: Pídele a una IA la app

Necesito una app del clima en React que:
- Busque ciudad por nombre
- Muestre temperatura, humedad, condición
- Use la API de OpenWeatherMap
- Tenga iconos del clima
- Sea responsive
- Use Tailwind CSS

La API key viene de VITE_WEATHER_API_KEY.

Dame el código completo.

Paso 3: Configura la key

Crea .env:

VITE_WEATHER_API_KEY=tu-api-key

Código típico

const API_KEY = import.meta.env.VITE_WEATHER_API_KEY

async function getWeather(city: string) {
  const res = await fetch(
    `https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${API_KEY}&units=metric`
  )
  return res.json()
}

Si algo falló

Próximo paso

→ Calculadora Web — Lógica de UI