Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/ivanespinosa/esg-mexico-sitio-web/llms.txt

Use this file to discover all available pages before exploring further.

El sitio web de ESG México está construido con Astro 6 y requiere Node.js ≥ 22.12.0, una cuenta de Sanity con un proyecto creado, y credenciales SMTP de Google Workspace para el endpoint de autoevaluación. Esta guía te lleva del repositorio vacío a un servidor de desarrollo funcionando en menos de cinco minutos, asumiendo que ya tienes Node.js y npm instalados en tu máquina.

​
Prerrequisitos

Antes de comenzar, asegúrate de contar con lo siguiente:

Node.js ≥ 22.12.0

La versión mínima de Node está declarada en package.json bajo el campo engines. Verifica con node -v.

Proyecto de Sanity

Crea un proyecto gratuito en sanity.io/manage y anota tu projectId y el nombre del dataset (por defecto: production).

Cuenta de Vercel

Necesaria para los deployments de producción. El adaptador @astrojs/vercel genera la salida optimizada para la plataforma.

​
Pasos de Instalación

1

Clonar el repositorio e instalar dependencias

Clona el repositorio desde tu fuente de control de versiones y ejecuta la instalación de dependencias desde la raíz del proyecto:
git clone <url-del-repositorio> esg-mexico
cd esg-mexico
npm install
Esto instala todas las dependencias declaradas en package.json, incluyendo Astro 6, TailwindCSS 4, React 19, @astrojs/vercel, @sanity/client y nodemailer.
2

Configurar las variables de entorno

Copia el archivo de ejemplo y rellena cada variable con tus credenciales reales:
cp .env.example .env
Abre .env en tu editor y completa los siguientes valores:
# Sanity — obtener en https://sanity.io/manage → proyecto → API
PUBLIC_SANITY_PROJECT_ID=xxxxxxxxx
PUBLIC_SANITY_DATASET=production

# Para el Studio (studio/.env)
SANITY_STUDIO_PROJECT_ID=xxxxxxxxx
SANITY_STUDIO_DATASET=production

# Vercel Deploy Hook (para rebuild automático al publicar en Sanity)
# Se crea en Vercel → proyecto → Settings → Git → Deploy Hooks
VERCEL_DEPLOY_HOOK_URL=https://api.vercel.com/v1/integrations/deploy/xxx

# SMTP de Google Workspace (buzon@esgmexico.net) — usado por /api/autoevaluacion
# SMTP_PASS es una "contraseña de aplicación" generada en la cuenta, NO la contraseña normal.
# Requiere verificación en 2 pasos activada en buzon@esgmexico.net.
SMTP_USER=buzon@esgmexico.net
SMTP_PASS=xxxxxxxxxxxxxxxx
Las variables PUBLIC_SANITY_PROJECT_ID y PUBLIC_SANITY_DATASET son expuestas al cliente (prefijo PUBLIC_). Nunca incluyas credenciales privadas con ese prefijo. SMTP_PASS debe ser una contraseña de aplicación de Google, no la contraseña de la cuenta.
El VERCEL_DEPLOY_HOOK_URL se usa para triggear rebuilds automáticos cuando se publica contenido nuevo en Sanity Studio. No es necesario para desarrollo local.
3

Instalar y arrancar Sanity Studio

El Studio de Sanity vive en el subdirectorio studio/ con su propio package.json. Instala sus dependencias y levanta el servidor:
cd studio
npm install
npx sanity dev
Sanity Studio quedará disponible en http://localhost:3333. Desde ahí puedes gestionar los documentos de tipo blogPost, noticia, author y tag.
Crea también un archivo studio/.env con las variables SANITY_STUDIO_PROJECT_ID y SANITY_STUDIO_DATASET para que el Studio apunte al proyecto correcto. Estos valores deben ser idénticos a los del .env raíz.
4

Iniciar el servidor de desarrollo de Astro

Regresa a la raíz del proyecto y ejecuta el script de desarrollo:
cd ..
npm run dev
Astro compilará el proyecto y levantará el servidor en:
http://localhost:4321
Los cambios en .astro, .ts, .tsx y archivos de contenido se reflejan automáticamente gracias al HMR de Vite.
5

Build de producción y preview local

Para verificar el build estático antes de un deploy, ejecuta:
npm run build
npm run preview
El comando build invoca astro build con el adaptador de Vercel (@astrojs/vercel) y genera la salida en .vercel/output/. El comando preview sirve esa salida localmente para validar el comportamiento en producción.
El adaptador Vercel genera una salida compatible con el sistema de archivos de Vercel Edge Network. No ejecutes preview en producción; usa el deploy en Vercel para eso.

​
Scripts Disponibles

Todos los scripts están declarados en package.json: 
{
  "scripts": {
    "dev":     "astro dev",
    "build":   "astro build",
    "preview": "astro preview",
    "astro":   "astro"
  }
}
ScriptDescripción
npm run devInicia el servidor de desarrollo en localhost:4321 con HMR activo
npm run buildGenera el build de producción con el adaptador de Vercel
npm run previewSirve localmente el output del build para validación
npm run astroAcceso directo al CLI de Astro (astro check, astro info, etc.)

​
Deploy en Producción con Vercel

npm i -g vercel
vercel --prod
Vercel detecta automáticamente el framework Astro y aplica la configuración del adaptador @astrojs/vercel.
El sitio de producción vive en https://www.esgmexico.net, configurado en astro.config.mjs bajo la clave site. Asegúrate de que el dominio esté correctamente configurado en el panel de Vercel antes del primer deploy a producción.

Build docs developers (and LLMs) love

Get started for freeTalk to us