Saltar al contenido
Lucas Batista
Producto digitalEn producción2026

QRPronto

Generador de códigos QR gratis en el navegador — y un panel de QR dinámico con destino editable

Ver proyecto en vivo8 flujos en video
React 19Vite 7TypeScriptReact Router 7NestJS 11Node.js
Funciona enGenerador gratuito (web)Panel del QR dinámicoAPI REST pública
qrpronto.com
tipos de código QR, del PIX al Wi-Fi
17
datos enviados al servidor en el generador gratuito
0
modelos en la base de datos del QR dinámico
11
idiomas: portugués, inglés y español
3

01

Visión General

QRPronto empieza como una herramienta gratuita: el visitante elige entre 17 tipos de código QR (URL, PIX (el sistema de pagos instantáneos de Brasil), Wi-Fi, vCard, WhatsApp, evento, cripto, redes sociales…), personaliza color, estilo de los puntos, borde, centro, degradado y logo central, y descarga en PNG, SVG o PDF. Nada de esto pasa por un servidor — el payload se arma y el código se dibuja en el propio navegador con qr-code-styling, así que no hay registro, no hay vencimiento y no circulan datos del usuario. Quien necesita más pasa a la segunda mitad del producto: el QR dinámico. Ahí el código impreso apunta a un enlace corto de QRPronto, y el destino se edita desde el panel — con historial de cada cambio, conteo de escaneos por día, dispositivo y país, campañas que consolidan varios códigos, reglas de redirección por país, dispositivo u horario, pruebas A/B, webhooks y una API pública con clave. El panel se comunica con una API en NestJS + Prisma, suscripción mediante Stripe y eventos de escaneo en tiempo real por Socket.IO.

Mi rol

Desarrollo completo del producto: front-end en React, API en NestJS, modelado con Prisma, motor de redirección y analítica, suscripción con Stripe, i18n, SEO y despliegue.

Categoría

Producto digital

Año

2026

Estado

En producción

Plataformas

Generador gratuito (web)Panel del QR dinámicoAPI REST pública

El generador gratuito no se comunica con ningún servidor: es solo el navegador. El QR dinámico es otra historia — el panel conversa con una API en NestJS, que guarda todo en Prisma y también responde por el enlace corto al que apunta el código impreso.

React 19 + Vite

Vercel

qr-code-stylingjsPDFi18nextdriver.js

API NestJS 11

Railway

JWT + PassportThrottlerSocket.IOStripe

Prisma + PostgreSQL

11 modelos

Organización y planesCódigos y escaneosCampañas y pruebas A/BWebhooks y claves

Motor de redirección

lo que corre al escanear

geoip-liteua-parser-jsIP solo como hash302 sin esperar el registro

Sincronización: Lo que es gratuito no depende de infraestructura: un QR estático generado en el navegador sigue funcionando aunque el servicio se caiga.

02

El Problema

Un código QR en material impreso es una decisión irreversible: la URL queda grabada en el papel. Si el menú cambia de dirección, si la promoción termina, si el enlace se rompe, todo el material se pierde. Y del otro lado está el problema opuesto: quien solo quiere un QR simple para el Wi-Fi o para el PIX se ve obligado a crear una cuenta en un servicio que vence el código a los pocos días o le pone marca de agua.

03 — La Solución

Atender los dos casos con el mismo producto. El generador estático resuelve el uso simple de forma gratuita y sin registro, procesando todo en el navegador. El QR dinámico resuelve lo impreso: el código apunta a un enlace corto y el destino se cambia desde el panel, con historial, métricas de escaneo y reglas condicionales — sin reimprimir nada.

04

Por dentro del producto

El sistema en funcionamiento, grabado de la aplicación real con una tienda de demostración — ninguna pantalla es un mockup.

01

Generador

Del campo vacío al PNG, sin salir de la pantalla

Formulario a la izquierda, código a la derecha, actualizándose con cada tecla. Eliges el tipo, escribes, cambias el color, cambias la forma de los puntos, aplicas un degradado, sueltas un logo en el centro y descargas. No hay botón de generar, ni paso siguiente, ni registro al final.

  • Todo dibujado en el navegador con qr-code-styling
  • Con logo central, la corrección de errores sube sola a H
  • Historial local de los últimos códigos generados
Generador
02

Tipos

Diecisiete tipos — y cada uno con el formulario adecuado

El PIX pide clave, beneficiario, ciudad y monto, y arma un BR Code válido. El Wi-Fi pide red, seguridad y contraseña. La vCard pide nombre, empresa, cargo y teléfono. El tipo no cambia solo el placeholder: cambia el payload que va dentro del código.

  • PIX, Wi-Fi, vCard, evento y cripto con campos propios
  • Atajos para Instagram, TikTok, YouTube, Spotify y LinkedIn
  • Una página de SEO dedicada para cada tipo
Tipos
03

Salidas

PNG, SVG, PDF — y el material ya diagramado

Además de los tres formatos y de copiar al portapapeles, hay cinco plantillas de impresión que salen en PDF con el tamaño correcto: tarjeta de presentación, etiqueta, hoja A4 con nueve códigos, display de mesa para restaurante y póster A3. Para impresión, el código se regenera con corrección alta.

  • SVG vectorial para quien lo llevará a la imprenta
  • Hoja A4 con 9 copias para recortar
  • Display de mesa y póster A3 listos
Salidas
04

QR dinámico

El papel sigue igual, el destino cambia

Es la razón de ser del producto. El código impreso apunta a un enlace corto de QRPronto; el destino se cambia desde el panel en segundos. El historial guarda cada modificación con la URL anterior tachada, la nueva, la fecha y quién la hizo — porque en un menú impreso en mil volantes eso es una decisión con consecuencias.

  • Enlace corto generado con nanoid, único por código
  • Historial de cambios con autor y fecha
  • Contador de lecturas en vivo por Socket.IO
QR dinámico
05

Reglas

El mismo código llevando a cada persona a un lugar distinto

Las reglas se leen como frases: si el país es BR, va al menú en portugués; si el dispositivo es desktop, va al PDF; si pasaron las 18 h, va al menú nocturno. El motor evalúa en el momento del escaneo, junto con la prueba A/B y el UTM automático, y solo entonces devuelve el 302.

  • Condiciones por país, ciudad, dispositivo, sistema, hora y volumen
  • Prueba A/B con pesos y lecturas por variante
  • UTM aplicado al destino sin sobrescribir lo que ya existe
Reglas
06

Integraciones

Campañas, webhooks y una API con clave

Las campañas suman varios códigos en un solo panel — total de lecturas, países y cuántas vinieron de celular. Los webhooks se disparan en cada escaneo, con firma e historial de entregas (incluidas las que fallaron). Y la API pública permite crear y listar códigos con X-API-Key, para quien quiere generar QR directamente desde su propio sistema.

  • Campaña con números consolidados de sus códigos
  • Webhook firmado, con estado y tiempo de cada entrega
  • Clave de API con vista previa, último uso y revocación
Integraciones
07

Interfaz

Tema oscuro, tres idiomas, atajos y un tour

Todo el generador tiene tema oscuro, y la interfaz está en portugués, inglés y español con i18next. Hay atajos de teclado para los tipos más usados y un tour guiado con driver.js para quien abre la herramienta por primera vez y no sabe por dónde empezar.

  • Tema claro y oscuro en todas las pantallas
  • pt-BR, inglés y español cambiados al instante
  • Tour guiado en el botón de ayuda
Interfaz

05

8 flujos en video

Cada video muestra una tarea completa, de principio a fin. Haz clic para verlo con controles.

06

Funcionalidades Principales

01

17 tipos de código QR, sin registro

URL, texto, WhatsApp, teléfono, SMS, correo electrónico, vCard, Wi-Fi, ubicación, evento, cripto, PIX y los atajos de Instagram, TikTok, YouTube, Spotify y LinkedIn. El PIX genera un BR Code válido con clave, beneficiario, ciudad, monto e identificador.

02

Todo en el navegador

El payload se arma y el código se dibuja en el propio dispositivo con qr-code-styling — no se envía ningún dato a un servidor. Sin registro, sin vencimiento, sin marca de agua, y el código sigue funcionando para siempre porque no depende de ninguna redirección.

03

Estudio de personalización

Color y fondo, seis estilos de punto, cuatro de borde, dos de centro, degradados prediseñados o personalizados y logo central (propio o de una galería de 15). Al colocar un logo, el nivel de corrección de errores sube solo a H para que el código siga siendo legible.

04

QR dinámico con destino editable

El código impreso apunta a un enlace corto; el destino se cambia desde el panel en cualquier momento, con historial de cada modificación — quién la hizo, cuándo y de qué URL a cuál. El papel sigue siendo el mismo.

05

Escaneos, campañas y reglas

Cada lectura registra dispositivo, sistema, navegador, país y ciudad (IP guardada solo como hash), con UTM opcional. Las campañas consolidan varios códigos en un solo número, y las reglas envían el mismo QR a destinos distintos según país, ciudad, dispositivo, sistema, horario o volumen de lecturas.

06

Webhooks, API pública y planes

Webhook en cada escaneo con firma e historial de entregas, API REST por clave (X-API-Key) para crear y listar códigos, y suscripción mediante Stripe con cuatro planes, límites por plan y portal de facturación.

07

Pantallas del sistema

Capturas reales del producto, organizadas por módulo. Haz clic en cualquier pantalla para ampliarla.

Formulario a la izquierda, código a la derecha, sin paso intermedio
Los diecisiete tipos de código QR en una sola cuadrícula
El código aparece mientras se escribe
Seis estilos de punto, cuatro de borde y dos de centro
Degradados prediseñados o armados a mano
Logo en el centro y la corrección de errores subiendo sola a H
Tamaño de 128 a 2048 px, margen y nivel de corrección
Tarjeta, etiqueta, hoja A4, mesa de restaurante y póster A3
Los últimos códigos generados, guardados en el propio navegador
Atajos para los tipos más usados
Toda la herramienta en tema oscuro
PIX con clave, beneficiario, ciudad y monto — BR Code válido

08

En el celular

En el celular el generador se convierte en dos pestañas — contenido y diseño —, y el diseño se divide en estilo, logo, configuración y plantillas. El código queda siempre visible arriba, actualizándose mientras se escribe. El panel del QR dinámico lo acompaña, en tarjetas.

Generador
Tipos
Código listo
Diseño
Logo
Configuración
Plantillas
Página de PIX
Planes
Panel
Campañas
API
Iniciar sesión

09

Tecnologías

Front-end

React 19Vite 7TypeScriptReact Router 7

Back-end

NestJS 11Node.jsPrisma 5

Base de datos

PostgreSQL (produção)SQLite (desenvolvimento)

Despliegue

VercelRailwayCloudflare DNS

Integraciones

StripeResendSocket.IOgeoip-lite

Bibliotecas

qr-code-stylingjsPDFi18nextdriver.jsreact-colorfulJSZip

10

Decisiones de Diseño

La pantalla del generador es una sola: formulario a la izquierda, código a la derecha, actualizándose con cada tecla — sin pasos, sin asistente, sin botón de generar. El panel del QR dinámico es deliberadamente lo opuesto: una lista de tarjetas con el número de lecturas y el destino actual en primer plano, porque quien abre el panel quiere justamente revisar o cambiar el destino. Verde azulado y esmeralda sobre fondo claro, con tema oscuro completo, tres idiomas y un tour guiado para quien llega perdido.

11

Desafíos Técnicos

El motor de redirección tiene que hacer mucho sin retrasar a quien escaneó: encontrar el código corto, registrar la lectura con dispositivo, navegador y geolocalización, evaluar pruebas A/B y reglas condicionales, aplicar UTM y disparar webhooks. El registro del escaneo, el incremento del contador y los webhooks salen de la ruta crítica — se disparan sin bloquear — y el visitante recibe el 302 apenas se resuelve el destino.

12

Resultados

  • Producto en línea en qrpronto.com, con el generador gratuito abierto y sin registro
  • Dos modelos en el mismo producto: herramienta gratuita como puerta de entrada y suscripción para el QR dinámico
  • 17 páginas de SEO, una por tipo de código, y un blog con 8 artículos que alimentan la búsqueda orgánica

13

Aprendizajes

  • Procesar todo en el navegador es un argumento de venta, no solo arquitectura: 'tus datos no salen de tu dispositivo' resuelve la objeción de quien genera QR de PIX y de Wi-Fi
  • El código QR es un problema de corrección de errores: al insertar un logo central el nivel debe subir a H, de lo contrario el código empieza a fallar en lectores malos — la app lo hace sola
  • Un enlace corto es la única parte que tiene que ser eterna: el QR apunta a él y el destino pasa a ser un dato editable, con auditoría de cada cambio
  • Una regla condicional de redirección es fácil de escribir y difícil de explicar — la interfaz tiene que leerse como una frase: si el país es igual a BR, redirigir a…

¿Te gustó este proyecto?

¿Tienes una idea parecida o quieres construir algo diferente? Hablemos.

WhatsAppEnviar mensaje

Otros proyectos

Ver todos
Portada — VendaíVista previa en video

SaaS

Vendaí

Sistema completo de punto de venta para pet shops, tiendas de alimento para animales, almacenes y comercios de barrio: POS con lector de código de barras, caja, inventario, fiado (venta a crédito), cuentas por pagar, PIX (el sistema de pagos instantáneos de Brasil), más de 50 informes y Recepción Segura — todo funcionando sin internet, con sincronización a la nube y una app de gestión en el celular.

Portada — EA CentralVista previa en video

Sistema web

EA Central

Tienda B2B de accesorios para celulares: catálogo con 349 productos y filtro por dispositivo (293 modelos), precio progresivo por cantidad, carrito con elección de colores, flete real y un checkout que abre WhatsApp con el pedido listo. Panel completo para el comerciante, exportación a Excel/PDF y medición con Meta Pixel + Conversions API.

Portada — PetzaraVista previa en video

SaaS

Petzara

Sistema completo de gestión para petshops: agenda con estado en tiempo real mediante Socket.io, clientes, mascotas, finanzas, colaboradores y suscripción mensual/anual con Stripe — PWA instalable en el celular o en la computadora.