×

Agrega auth a tu app en menos de 10 min

the next craft

Ignacio Rueda · @jibaru · Software Engineer @ Clerk

READY.█

10 PRINT "QUIÉN SOY"

Ignacio Rueda

Soy software engineer en Clerk.com, desde Lima, Perú. Me gusta construir cosas con mis amigos de Crafter Station, y ahora estoy creando contenido en mi canal de YouTube.

jibaru.dev

jibaru

@IgnacioRuedaB

@ignacio-rueda

20 PRINT "EL PROBLEMA"

Auth a mano son semanas

A mano

Hash de passwords

Sesiones y refresh tokens

OAuth, proveedor por proveedor

MFA, reset, magic links

Panel para ver usuarios

Con Clerk

npx clerk init

30 PRINT "QUÉ ES CLERK"

Autenticación y gestión de usuarios completas. Llegan como componentes que ya funcionan, no como un SDK que te toca cablear.

1Componente para tener login

0Tablas que mantener

50KUsuarios retenidos gratis

Y un dashboard de verdad: usuarios, sesiones, organizaciones y logs, sin que construyas un panel de admin. dashboard.clerk.com →

40 PRINT "QUÉ TRAE"

Todo lo que ibas a escribir a mano

Componentes <SignIn />, <SignUp /> y <UserButton /> con tu marca.

Organizations Multi-tenant B2B: equipos, roles e invitaciones.

Billing Suscripciones y features bajo llave por plan.

Seguridad MFA, passkeys y detección de bots por defecto.

SSO Google, GitHub y SAML para empresas.

Webhooks Cada evento de usuario, directo a tu base.

50 PRINT "FUNCIONA CON"

Tu stack ya tiene soporte

Next.js El quickstart de hoy

React

React Router

TanStack Start

Astro

Nuxt

Vue

Expo

Swift

Android

Express

Fastify

Todos salen del mismo comando.

60 PRINT "CLERK CLI"

Clerk CLI

Toda tu cuenta de Clerk desde la terminal. Tú la manejas, y tu agente también.

Instalarbash

$ npm install -g clerk # o sin instalar nada $ npx clerk · $ bunx clerk

70 PRINT "UN SOLO COMANDO"

Proyecto~/mi-app

$ npx clerk init ✓ Next.js detectado · bun ✓ @clerk/nextjs instalado ✓ Middleware y <ClerkProvider /> listos ✓ Keys escritas en .env.local

01

Detecta Tu framework y tu package manager.

02

Instala SDK, middleware y páginas de auth.

03

Conecta Linkea tu app y baja las keys.

80 PRINT "COMANDOS"

Los que vas a usar

clerk auth loginEntra a tu cuenta.

clerk initConfigura Clerk en el proyecto.

clerk env pullBaja las keys a .env.local.

clerk usersCrea, lista y borra usuarios.

clerk doctorRevisa que tu integración esté sana.

clerk deployPasa la app a producción.

Y cuando compile lento: clerk bird — Flappy Bird en la terminal.

90 PRINT "CLERK SKILLS"

Clerk Skills

Tu agente deja de adivinar cómo se usa Clerk. Las skills le dan los patrones oficiales, escritos por quienes hacen el producto.

Instalar las skillsbash

$ npx skills add clerk/skills

Claude Code · Cursor · Windsurf · Copilot · Codex · Gemini CLI

100 PRINT "EL CATÁLOGO"

Una skill por trabajo

/clerkEnruta al resto.

/clerk-setupClerk en cualquier framework.

/clerk-cliManeja Clerk desde la terminal.

/clerk-custom-uiFlujos y estilos propios.

/clerk-orgsMulti-tenant B2B.

/clerk-billingSuscripciones y feature gating.

/clerk-webhooksEventos en tiempo real.

/clerk-testingE2E de los flujos de auth.

/clerk-nextjs-patternsMiddleware, Server Actions, caché.

Más las de cada plataforma: React, TanStack, Astro, Nuxt, Vue, Expo, Swift y Android.

110 PRINT "LOS 10 MINUTOS"

De cero a login, en vivo

00:00npx clerk init sobre un Next.js recién creado
02:00Levantar el server y ver <SignIn /> ya funcionando
04:00Poner <UserButton /> en el header
06:00Proteger /dashboard con auth() en el middleware
08:00Pedirle a la skill que agregue Organizations
10:00clerk doctor · todo verde

Deja de escribir auth y ponte a shippear

El siguiente paso es npx clerk init en el proyecto que tienes abierto ahora.

the next craft

clerk.com/docs · jibaru.dev

READY.█