En algún momento necesitaba generar un código QR para una URL sin depender de APIs externas y decidí hacerlo como parte de una funcionalidad para mi página de boda: permitir que los invitados hagan fotos y las suban al sitio. En lugar de pedir a la gente que escriba la dirección a mano o dejar notas, la solución fue simple y elegante colocar un código QR en cada mesa. En este artículo explico cómo implementé un servicio generador de QR full stack dentro de una arquitectura MERN con GraphQL y sin llamadas a servicios externos.
Resumen del objetivo: construir un servicio que transforme una URL en una imagen de código QR, almacenar esa imagen en MongoDB en formato Base64 y servirla al frontend mediante Apollo GraphQL. La idea era evitar enlaces externos que puedan expirar, incluir marcas o imponer paywalls y garantizar que el contenido impreso en las mesas siga funcionando durante el evento.
Tecnologías empleadas: backend con Node.js y Express, Apollo Server y Mongoose para MongoDB. Frontend con Next.js y Apollo Client. Generación de QR mediante la librería qrcode de npm y almacenamiento como imagen codificada en Base64 para poder incrustarla directamente en etiquetas img del frontend sin necesidad de subir archivos a S3 ni configurar almacenamiento adicional.
Diseño del servicio: se creó un modelo Mongoose para QRCode que guarda la URL original, el contenido del QR en Base64, formato, tamaño y marcas temporales. En la capa de servicio se implementaron funciones para generar el código a partir de una URL, recuperar un QR por URL y listar todos los códigos almacenados. Todo esto expuesto mediante resolvers GraphQL que permiten crear y consultar códigos mediante mutaciones y queries sencillas.
Ventajas de usar Base64 para los QR: permite incrustar la imagen directamente en el frontend con un src data URI, facilita imprimir y enviar por correo sin pasos adicionales, elimina la necesidad de configurar almacenamiento de ficheros y simplifica la entrega segura a los clientes. Además facilita las pruebas y el versionado dentro de la base de datos.
Integración en el frontend: en una aplicación Next.js basta con renderizar una etiqueta img cuyo atributo src sea data:image/png;base64, seguido del campo qrCodeData entregado por GraphQL. De este modo el QR se muestra inmediatamente sin descargas ni rutas dinámicas complejas y se puede incluir en plantillas de impresión para carteles o tarjetas.
Buenas prácticas aplicadas: separación de responsabilidades con una capa de servicio para la generación y obtención de QR, uso de issues para seguimiento del feature, tests básicos y resolvers GraphQL limpios. Con Mongoose y Apollo Server se consigue una combinación potente y modular, ideal para equipos que quieran escalar la solución o reutilizar el servicio en otros proyectos.
Motivación y fiabilidad: al comparar con generadores online gratuitos detecté limitaciones como marcas, redirecciones por dominios ajenos o planes de pago para funciones básicas. Al integrar el generador en la propia arquitectura se gana control, seguridad y continuidad del servicio, especialmente importante cuando el código se imprime y se distribuye físicamente.
Ejemplo de flujo: un usuario administrador solicita generar un QR para la ruta de memoria del evento, la aplicación ejecuta la mutación GraphQL que invoca el servicio local de generación, el resultado en Base64 se guarda en MongoDB y queda disponible para que la web lo muestre o para exportarlo a plantillas de impresión.
Resultados: un servicio fiable y reutilizable que forma parte del ecosistema Wedstack que construí. Los invitados pueden escanear un código elegante en las mesas y acceder directamente a la página de compartición de recuerdos, todo sin depender de terceros.
Si buscas soluciones profesionales para integrar este tipo de desarrollos en tu empresa, en Q2BSTUDIO somos especialistas en desarrollo de software y aplicaciones a medida. Podemos adaptar un generador de códigos QR a flujos de trabajo empresariales, integrarlo con servicios cloud y añadir capas de seguridad o inteligencia para su gestión. Descubre nuestros servicios de desarrollo de aplicaciones y software a medida visitando desarrollo de aplicaciones y software multiplataforma.
Además ofrecemos experiencia en inteligencia artificial y automatización para empresas, desde modelos de IA personalizados hasta agentes IA que mejoran la interacción con usuarios. Si te interesa explorar cómo la inteligencia artificial puede potenciar proyectos como este o mejorar procesos internos, conoce nuestros servicios de IA en soluciones de inteligencia artificial para empresas.
Palabras clave y áreas de especialidad: aplicaciones a medida, software a medida, inteligencia artificial, ciberseguridad, servicios cloud aws y azure, servicios inteligencia de negocio, ia para empresas, agentes IA y power bi. En Q2BSTUDIO combinamos estas capacidades para ofrecer proyectos completos y seguros, desde la arquitectura cloud hasta la visualización de datos con Power BI y analítica avanzada.
Lecciones aprendidas: una arquitectura MERN con GraphQL facilita APIs modulares y reutilizables. El uso de Base64 simplifica el manejo de imágenes en muchos escenarios. Planificar con issues y capas de servicio reduce el coste de mantenimiento y permite escalar la funcionalidad a otros dominios. Si tienes preguntas, quieres replicar esta solución o necesitas integración a medida con requisitos de ciberseguridad, cloud o inteligencia de negocio, en Q2BSTUDIO podemos ayudarte a diseñar e implementar la solución perfecta para tu proyecto.
.jpg)