---
title: ECOTAGS 3D
emoji: 🌌
colorFrom: indigo
colorTo: green
sdk: static
sdk_version: "1.0.0"
app_file: index.html
pinned: false
---

# ECOTAGS 3D - Deploy en Hugging Face Spaces (Static)

Este proyecto es una app web 100% cliente (Three.js + Firebase + Gemini) que puede correr en un Space estático de Hugging Face.

## Estructura
- `index.html`: Aplicación principal.
- `styles.css`: Estilos opcionales.
- `scripts/`: Scripts auxiliares (si los usas).
- `netlify/` y `netlify.toml`: Configuración de Netlify (opcional; en Hugging Face Static no se usan).

## Importante sobre la API de Gemini
En un Space estático NO existe backend. Por lo tanto, la app hace llamadas directas a la API de Gemini con una clave guardada localmente en el navegador.

- Abre la sección "Configuración" dentro de la app (`index.html`).
- Pega tu clave de Gemini en "Gemini API Key (guardada localmente)" y pulsa "Guardar clave".
- La clave se almacena en `localStorage` del navegador y no se sube al servidor.

Si necesitas ocultar la clave del cliente, migra a un Space con backend (por ejemplo Gradio/Streamlit en Python) y usa los Secrets del Space para acceder a la API desde el servidor.

## Firebase: dominios autorizados
Si usas Firebase Auth/Firestore, añade los dominios del Space a la lista de dominios autorizados en la consola de Firebase:

- `https://<tu-usuario>-<tu-space>.hf.space`
- En previews/PRs, también pueden generarse subdominios temporales `https://<algo>.hf.space`.

En Firebase Console:
- Auth > Settings > Authorized domains: agrega los dominios del Space.
- Firestore Rules: asegúrate de tener las reglas que necesitas para lectura/escritura.

## Crear el Space
1. Ve a https://huggingface.co/spaces y crea un nuevo Space.
2. Tipo de Space: "Static".
3. Conecta tu repositorio o sube los archivos del proyecto (`index.html`, `styles.css`, etc.).
4. Configuración del Space (Static):
   - Build command: vacío (no hay build si no usas bundler)
   - Build output directory: `/` (raíz) o la carpeta donde esté tu `index.html`
5. Guarda y espera a que el Space se construya.

La app debería quedar accesible en `https://<tu-usuario>-<tu-space>.hf.space/`.

## Notas sobre el antiguo proxy de Netlify
Este proyecto incluye un proxy de Netlify en `netlify/functions/gemini-proxy.js` para ocultar la clave de Gemini cuando se despliega en Netlify. En Hugging Face (Static) ese endpoint no existe, por lo que la app intentará primero el proxy y, si falla, usará automáticamente la clave local.

- Puedes dejar esos archivos sin problema.
- Si deseas limpiar el repositorio para Hugging Face, elimina `netlify/` y `netlify.toml` (opcional).

## Migrar a Space con backend (opcional)
Si quieres ocultar la clave y hacer llamadas a Gemini desde el servidor:
- Crea un Space nuevo tipo Gradio o Streamlit (Python) o Node.
- Mueve la lógica del proxy (actualmente en `netlify/functions/gemini-proxy.js`) a una ruta del backend.
- Configura `GEMINI_API_KEY` como Secret del Space.
- En `index.html`, elimina el fallback local o invierte el orden para forzar el backend.

## Desarrollo local
Puedes abrir `index.html` en un servidor local sencillo (para evitar problemas de CORS y rutas):

- Con Python 3: `python -m http.server 8000`
- Con Node (serve): `npx serve .`

Luego visita `http://localhost:8000`.

Asegúrate de:
- Configurar la API key de Gemini localmente en la app.
- Tener los dominios locales autorizados en Firebase (`localhost`, `127.0.0.1`).