Primeros Pasos

Requisitos Previos

Lo que necesitas antes de construir un plugin de Whatalo.

Herramientas Requeridas

Node.js 18 o Superior

El CLI y la plantilla requieren Node.js 18+. Verifica tu versión:

node --version
# v18.0.0 o superior

Descárgalo de nodejs.org si lo necesitas.

pnpm (Recomendado)

La plantilla scaffoldeada usa pnpm como gestor de paquetes. Puedes usar npm o yarn si prefieres, pero el whatalo.app.toml usa pnpm dev y pnpm build por defecto.

npm install -g pnpm

El CLI de Whatalo

Instálalo globalmente:

npm install -g @whatalo/cli

Verifica la instalación:

whatalo --version

Alternativamente, ejecuta comandos CLI vía npx whatalo <comando> sin una instalación global.

Cuentas Requeridas

Cuenta de Desarrollador de Whatalo

Regístrate en el Developer Portal. Tu cuenta de desarrollador es separada de una cuenta de dueño de tienda — te permite crear y gestionar plugins.

Una Tienda de Desarrollo

Las tiendas de desarrollo son tiendas de prueba conectadas a tu cuenta de desarrollador. Se comportan como tiendas reales pero están aisladas de los datos de producción.

Crea una en el Developer Portal bajo Dev Stores. Puedes tener hasta 3 tiendas de desarrollo por cuenta de desarrollador.

Necesitas al menos una tienda de desarrollo antes de ejecutar whatalo dev.

Herramienta de Túnel

whatalo dev crea un túnel HTTPS público para que el admin (servido sobre HTTPS) pueda cargar tu plugin local. El CLI descarga y gestiona cloudflared automáticamente en el primer uso — no necesitas instalarlo manualmente.

Si prefieres una herramienta de túnel diferente, pasa la URL pública con --tunnel-url:

whatalo dev --tunnel-url https://mi-tunel-personalizado.example.com

Para desarrollar sin túnel (solo máquina local):

whatalo dev --no-tunnel

--no-tunnel significa que el admin carga http://localhost:5173, lo que solo funciona si el admin mismo está corriendo localmente.

Conocimientos Técnicos

La plantilla predeterminada usa:

  • React 19 — una SPA de React estándar
  • Vite — servidor de desarrollo y herramienta de build
  • TypeScript — todo el código de la plantilla está tipado

No necesitas usar React. Cualquier framework que produzca una aplicación web (Vue, Svelte, HTML/JS plano) funciona — implementas el protocolo App Bridge manualmente en lugar de usar los hooks del SDK.

Próximos Pasos

On this page