Atlas Tech

Directorio del ecosistema tecnologico de Sinaloa

---

Plataforma web construida con Next.js y Payload CMS para gestionar el directorio de startups, empresas, comunidades y personas del ecosistema tech de Sinaloa.

Este repositorio cubre un solo estado por ahora, pero esta diseñado para que cualquier persona pueda hacer fork y crear el atlas de su propio estado.

Stack

• Next.js 15 — framework fullstack con App Router y React Server Components
• Payload CMS 3 — CMS headless integrado en Next.js, panel de admin en /admin
• React 19 + Tailwind CSS 4 — UI con componentes cliente y utilidades CSS
• Drizzle ORM — esquemas de base de datos para auth y tablas custom (src/db/schema/)
• PostgreSQL — base de datos principal (Payload usa su propio adaptador, Drizzle maneja el esquema de auth)
• better-auth — autenticacion de usuarios con Google OAuth
• S3 — almacenamiento de imagenes (Cloudflare R2 en produccion, MinIO local)

Inicio rapido

pnpm install
cp .env.example .env      # configura tus variables
pnpm dev                   # servidor de desarrollo en localhost:3000

El panel de administracion de Payload esta disponible en /admin.

Como funciona la publicacion de contenido

1. Un usuario inicia sesion con su cuenta de Google
2. Desde su dashboard, envia un registro a traves del formulario wizard seleccionando el tipo (startup, empresa, comunidad, etc.)
3. El registro se guarda como borrador en la base de datos via Payload
4. Un moderador revisa el registro desde el panel de admin (/admin) y lo publica o lo rechaza con una nota de retroalimentacion
5. Al publicarse, el contenido aparece automaticamente en el directorio publico

Las imagenes (logos, portadas) se suben a almacenamiento S3 compatible (Cloudflare R2 en produccion, MinIO en desarrollo local).

Wallet passes

Los usuarios autenticados pueden generar un pase digital con su perfil del directorio, compatible con:

• Apple Wallet — genera un archivo .pkpass descargable
• Google Wallet — genera un link para agregar el pase

Requiere configurar los certificados de Apple y la service account de Google (ver variables de entorno).

Variables de entorno

Copia .env.example y configura segun tu entorno:

Requeridas:

Variable	Descripcion	Como obtenerla
DATABASE_URI	Conexion a PostgreSQL	Local: postgresql://user:pass@localhost:5432/db. Produccion: Neon, Supabase, etc.
PAYLOAD_SECRET	Secret para Payload CMS	Genera con openssl rand -hex 16
BETTER_AUTH_SECRET	Secret para autenticacion	Genera con openssl rand -base64 32
NEXT_PUBLIC_SITE_URL	URL publica del sitio	http://localhost:3000 en desarrollo
GOOGLE_CLIENT_ID	ID de cliente OAuth de Google	Crea un proyecto en Google Cloud Console, configura la pantalla de consentimiento OAuth y crea credenciales tipo "ID de cliente de OAuth" para aplicacion web
GOOGLE_CLIENT_SECRET	Secret del cliente OAuth	Se genera junto con el Client ID en el paso anterior

Almacenamiento S3 (imagenes):

Variable	Descripcion
S3_ENDPOINT	URL del endpoint S3. Local: http://localhost:9000 (MinIO). Produccion: https://<account-id>.r2.cloudflarestorage.com (Cloudflare R2)
S3_BUCKET	Nombre del bucket
S3_ACCESS_KEY_ID / S3_SECRET_ACCESS_KEY	Credenciales de acceso al bucket
S3_REGION	Region (us-east-1 para MinIO, auto para R2)
MEDIA_URL	URL publica donde se sirven las imagenes

Wallet passes (opcional):

Variable	Descripcion
APPLE_PASS_*	Certificados para Apple Wallet. Guia: Apple Developer — Wallet
GOOGLE_WALLET_*	Service account y IDs para Google Wallet. Guia: Google Wallet API

Docker

El Dockerfile multi-stage construye la app en 3 fases:

1. deps — instala dependencias con pnpm install --frozen-lockfile
2. builder — genera el import map de Payload, ejecuta migraciones de base de datos y construye la app Next.js
3. runner — imagen minima de produccion con el output standalone de Next.js

docker build --build-arg DATABASE_URI="postgresql://..." -t atlas-tech .
docker run -p 3000:3000 --env-file .env atlas-tech

La base de datos debe estar accesible durante el build para que las migraciones se ejecuten.

Mapas

Los mapas geograficos utilizan archivos tipo AGEM (Area Geoestadistica Municipal) de INEGI:

https://www.inegi.org.mx/temas/mg/#mapas

Coloca el archivo descargado en public/topo/.

Crea tu propio atlas

1. Haz fork de este repositorio
2. Configura tu base de datos PostgreSQL y variables de entorno
3. Crea credenciales OAuth en Google Cloud Console
4. Descarga los mapas AGEM de tu estado desde INEGI
5. Despliega con Docker o en cualquier plataforma compatible con Next.js