# 🌌 AstroTenerife

AstroTenerife es una aplicación web que muestra la Imagen Astronómica del Día (APOD) 
utilizando la API oficial de la NASA: [https://apod.nasa.gov/apod/](https://apod.nasa.gov/apod/).

# 🌌 ¿Qué es APOD?

APOD (Astronomy Picture of the Day) es un proyecto de la NASA 
que publica diariamente una imagen o video relacionado con la astronomía, 
acompañada de una explicación escrita por astrónomos profesionales.

# 🚀 ¿Qué es la API de APOD?

La API de APOD permite acceder programáticamente a la imagen, 
vídeo y explicación astronómica del día. Proporciona datos en formato JSON 
y es gratuita para uso personal y educativo.

- **🌐 Endpoint principal:**  
  `https://api.nasa.gov/planetary/apod?api_key=TU_API_KEY`

- **🔑 Parámetros útiles:**
  - `date`: Fecha en formato `YYYY-MM-DD` para obtener la imagen de un día específico.
  - `api_key`: Tu clave personal de la NASA
	(puedes obtenerla gratis en [https://api.nasa.gov/](https://api.nasa.gov/)).
  - Ejemplo de uso:
    ```
    https://api.nasa.gov/planetary/apod?api_key=TU_API_KEY&date=2023-01-01
    ```

- **📄 Respuesta típica:**
  ```json
  {
    "date": "2023-01-01",
    "explanation": "Texto explicativo...",
    "media_type": "image",
    "service_version": "v1",
    "title": "Título de la imagen",
    "url": "https://apod.nasa.gov/apod/image/2301/imagen.jpg"
  }

# ✨ Características

* 🌟 Visualización diaria de la imagen/vídeo astronómico.
* 🌍 Traducción automática del título y la descripción al español.
* 📱 Diseño moderno y responsivo.
* 🔗 Botón para acceder al origen oficial de la imagen.
* 🖼️ Soporte para imágenes, vídeos y miniaturas.

# 🛠️ Uso

1. 🌀 Clona el repositorio:

   git clone <URL-del-repositorio>
   cd astronomy-ephemeris

2. 📦 Instala las dependencias:

   pnpm install

3. 🔧 Configura la variable de entorno en .env:

   NEXT_PUBLIC_URL_API_KEY=https://api.nasa.gov/planetary/apod?api_key=TU_API_KEY

   Puedes obtener tu API Key gratuita en https://api.nasa.gov/.

4. ▶️ Inicia el servidor de desarrollo:

   pnpm dev

5. 🌐 Accede a la aplicación en http://localhost:3000.

# 📂 Estructura del proyecto

- `app/`: 🌟 Páginas principales y lógica de presentación.
- `components/`: 🧩 Componentes reutilizables de la interfaz.
- `lib/`: 🛠️ Utilidades y lógica de acceso a datos.
- `public/`: 🌍 Recursos estáticos.

# 📜 Créditos

- 📸 Imágenes y datos: [NASA APOD](https://apod.nasa.gov/apod/)
- 🌍 Traducción automática: Google Translate API pública

# ⚖️ Licencia

Este proyecto es de uso libre para fines educativos y personales.

# 🌍 Despliegue en Vercel

Este proyecto está preparado para desplegarse fácilmente en Vercel.

# 📚 Librería necesaria

No necesitas instalar ninguna librería adicional para Next.js en Vercel, 
ya que Vercel soporta Next.js de forma nativa.

# ⚙️ Configuración recomendada

1. 🔧 Variables de entorno:

   En el panel de Vercel, añade la variable `NEXT_PUBLIC_URL_API_KEY` 
	 con el mismo valor que tienes en tu `.env`.

2. 📝 Archivo de configuración opcional:

   Si necesitas personalizar el comportamiento, puedes crear un archivo
	 `vercel.json` en la raíz del proyecto. Ejemplo básico:
   ```json
   {
     "builds": [
       { "src": "next.config.mjs", "use": "@vercel/next" }
     ]
   }

3. 🏗️ Comando de build:

   Vercel ejecuta automáticamente `pnpm build` o `npm run build` 
	 según el gestor de paquetes detectado. ```

4. 📋 Pasos previos:

   - Sube tu código a GitHub, GitLab o Bitbucket.
   - Conecta el repositorio en Vercel y selecciona el proyecto.
   - Configura las variables de entorno antes de desplegar.

Más información: 
[Documentación oficial Vercel + Next.js]
(https://vercel.com/docs/frameworks/nextjs/overview)

# 🔐 Variables de entorno en Vercel

Por seguridad, el archivo `.env` nunca se debe subir al repositorio.  
Para usar variables de entorno en Vercel:

1. Ve al panel de tu proyecto en Vercel.
2. Entra en **Settings > Environment Variables**.
3. Añade la variable `NEXT_PUBLIC_URL_API_KEY` y su valor.
4. Guarda y vuelve a desplegar el proyecto.

Así, Vercel inyecta las variables de entorno de forma segura durante el build y en producción.

# Autor

# 👨‍💻 **Iván Bazaga**

🚀 Desarrollador Frontend especializado en Angular y ecosistemas

Estudiante Intermedio con pasión por crear aplicaciones web modernas y eficientes. Este proyecto representa la aplicación práctica de conceptos avanzados.

# ☎️ Información de Contacto

# 🧰 Stack Tecnológico de Especialización

Frontend: Java SprinBoot • Astro • Angular 20 • TypeScript • RxJS • Bootstrap 5 • HTML5 • CSS3
Tools: Angular CLI • Git • VS Code • Prettier • Jasmine • Karma
Learning: NgRx • PWA • Node.js • Express • Mysql •  Oracle

📧 ¿Tienes preguntas o sugerencias?
¡No dudes en abrir un issue o contactarme directamente!