whatalo init

Crea un nuevo proyecto de plugin de forma interactiva — genera archivos, registra el plugin y muestra tus credenciales.

Sintaxis

whatalo init [opciones]

Opciones

Flag	Tipo	Descripción
`--portal-url <url>`	string	URL del Portal del Desarrollador

Flujo interactivo

whatalo init es un asistente guiado de 7 pasos. No necesitas estar autenticado antes de ejecutarlo — la autenticación se maneja de forma integrada si es necesario.

Paso 1 — Verificación de autenticación

Si no estás autenticado, se ejecuta automáticamente un Device Flow integrado. La misma autenticación basada en navegador que usa whatalo login corre sin salir del asistente.

Paso 2 — Nombre del plugin

Se te pide que ingreses un nombre para tu plugin (3–50 caracteres). El CLI genera automáticamente un slug seguro para URLs (minúsculas, solo guiones).

Paso 3 — Plantilla

Selecciona una plantilla de proyecto. Disponible actualmente:

React + Vite — TypeScript, Vite 7, React 19, @whatalo/plugin-sdk

Paso 4 — Crear o vincular

Opción	Qué sucede
Crear nuevo plugin	Registra un plugin nuevo via `POST /api/plugins`
Vincular existente	Lista tus plugins existentes — elige uno para vincular

Paso 5 — Generación de archivos

Los archivos de la plantilla se copian a un directorio nuevo con el nombre del slug. Las variables de Handlebars se reemplazan:

Variable	Valor
`{name}`	Nombre del plugin que ingresaste
`{slug}`	Slug generado automáticamente
`{clientId}`	ID del plugin desde el portal
`{sdkVersion}`	Versión actual de `@whatalo/plugin-sdk`

Paso 6 — Instalación de dependencias

Ejecuta pnpm install (o el gestor de paquetes detectado desde npm_config_user_agent).

Paso 7 — Mostrar el secreto

Si se creó un nuevo plugin, el client secret se muestra una sola vez. Esta es la única vez que lo verás — se guarda como hash en el portal y no puede recuperarse después.

  WHATALO_CLIENT_SECRET=wsk_live_xxxxxxxxxxxxxxxx

  Guárdalo ahora — no se volverá a mostrar.

Árbol de archivos generado

mi-plugin/
├── .env.example              # WHATALO_CLIENT_ID, WHATALO_CLIENT_SECRET
├── .gitignore
├── whatalo.app.ts            # defineApp() — manifiesto (permisos, páginas, URLs)
├── whatalo.app.toml          # Config del proyecto (nombre, slug, plugin_id, build, puerto dev)
├── package.json              # react 19, vite 7, @whatalo/plugin-sdk
├── tsconfig.json
├── vite.config.ts            # allowedHosts: true, headers CORS para iframe
├── index.html
├── README.md
└── src/
    ├── main.tsx
    ├── app.tsx               # Enrutamiento de páginas via switch(context.currentPage)
    ├── styles.css
    ├── pages/
    │   └── settings.tsx      # Página de Configuración educativa con guía
    ├── webhooks/
    │   └── verify.ts         # Verificador de webhooks HMAC-SHA256 con protección anti-replay
    └── components/
        └── whatalo-ui/       # 17 componentes UI preconstruidos + 2 hooks

Iniciar el desarrollo

Después de que whatalo init termine:

cd mi-plugin

# Copiar credenciales a .env
cp .env.example .env
# Agregar tu WHATALO_CLIENT_SECRET al .env

# Iniciar desarrollo
whatalo dev

Mensajes de error

Mensaje	Causa
`Authentication failed. Please run 'whatalo login' and try again.`	El Device Flow fue cancelado o falló
`Plugin name is required.`	Nombre vacío enviado
`Name must be at least 3 characters.`	El nombre es demasiado corto
`Name must not exceed 50 characters.`	El nombre es demasiado largo
`Directory "{slug}" already exists. Choose a different name.`	Ya existe una carpeta con ese slug localmente
`Failed to create plugin. Check that the slug is unique.`	El portal ya tiene un plugin con ese slug

Comandos relacionados

whatalo dev — Iniciar el desarrollo local
whatalo validate — Validar el proyecto generado

On this page