Desarrollo de una aplicación web dedicada con Supabase y Cloudflare

Hola, soy Otsuka, CTO de Liberogic.

Los ataques cibernéticos contra sitios web y sistemas empresariales se suceden, y hace un par de días también se habló de una vulnerabilidad crítica en PHP.

La arquitectura de las aplicaciones web de las que hablaremos hoy busca reducir en lo posible la carga de esas medidas de seguridad y de la operación, pero el tema de la seguridad lo queremos tratar en otra ocasión.

Para construir aplicaciones web a medida, adaptadas a los procesos de cada empresa, como solicitudes y aprobaciones, páginas de miembros, portales para clientes o proveedores y gestión de horas de trabajo, solemos usar la combinación de Supabase y Cloudflare.

Antes, había que montar por separado componentes en AWS como EC2, RDS, S3 y Cognito, o levantar servidores Linux e instalar por cuenta propia el servidor web, el middleware y el framework. Cada parte de la base de datos, la autenticación, la API y el almacenamiento de archivos implicaba un esfuerzo considerable de construcción y mantenimiento.
Con Supabase y Cloudflare, esa base la gestionan los servicios, y uno puede concentrarse en desarrollar las funciones que realmente necesita cada aplicación.

En este artículo presentamos brevemente qué tipo de aplicaciones web a medida se pueden crear combinando Supabase y Cloudflare.

Qué son las aplicaciones web a medida

Por «aplicación web a medida» nos referimos a una aplicación web desarrollada según la empresa y sus procesos de negocio.
Por ejemplo, algo como esto.

• Sistema interno de solicitudes y aprobaciones
• Página de miembros
• Portal exclusivo para socios comerciales
• Gestión de horas de trabajo y asistencia
• Gestión de proyectos
• Gestión de consultas
• Sistema de gestión para tiendas y sedes
• Sistema de uso compartido y revisión de archivos
• Gestión de encuestas y resultados de diagnósticos
• Paneles de administración para diversas operaciones de negocio

Cuando recibimos consultas de este tipo, primero investigamos si pueden resolverse con un SaaS existente o con un producto de paquete. En muchas operaciones estándar, esa opción suele ser más rápida y económica de implementar.

Sin embargo, al enumerar los requisitos, suele resultar difícil encontrar un producto que encaje exactamente con lo que se necesita.
Hay flujos de aprobación propios de cada empresa, información que varía según el departamento o la sede, y la necesidad de integrarse con sistemas existentes.

Dicho esto, en muchos casos concluimos que es mejor crear una aplicación web a medida que se adapte a los procesos de negocio, en lugar de seguir adaptando los procesos a un SaaS y cubriendo sus limitaciones con operaciones manuales. Así el flujo de trabajo del cliente resulta más fluido, y eso es lo que ofrecemos como propuesta.

Supabase reúne la base de datos para aplicaciones web

Supabase es un servicio que reúne en un solo lugar las funciones de backend que necesita una aplicación web.

Es un servicio con mucho impulso a nivel mundial, y más de 10 millones de desarrolladores lo utilizan. Y. Combinator, el acelerador de startups estadounidense de renombre, anunció que el 55 % de su lote más reciente adoptó Supabase, lo que lo está convirtiendo en una opción habitual como backend para nuevos servicios.

Estos casos de éxito proceden principalmente de servicios BtoC con muchos usuarios, pero nosotros utilizamos esta infraestructura convencidos de que también puede aplicarse tal cual a aplicaciones web de uso empresarial, es decir, las que se usan «a nivel interno» dentro de la empresa o con socios comerciales.

Entre sus funciones principales se encuentran:

• Database (base de datos PostgreSQL gestionada)
• Auth (autenticación de usuarios e inicio de sesión)
• API generada automáticamente (al definir una tabla, la API REST está disponible de inmediato)
• RLS (Row Level Security: control de permisos por fila)
• Storage (almacenamiento de archivos)
• Realtime (comunicación en tiempo real)
• Edge Functions (procesamiento de API sin servidor)

, entre otros.

En el caso de las aplicaciones empresariales, la información de usuarios, los datos de proyectos, los datos de solicitudes y el historial de operaciones pueden gestionarse en la base de datos de Supabase.

Además, con Supabase Auth también es posible incorporar la función de inicio de sesión. Esta autenticación encaja bien con las aplicaciones empresariales porque admite el inicio de sesión con cuentas de Microsoft y de Google.

En las empresas que ya utilizan Microsoft 365 o Google Workspace, los empleados pueden iniciar sesión directamente con las cuentas que usan habitualmente. No es necesario emitir ni distribuir nuevos IDs y contraseñas exclusivos para la aplicación, y la gestión de altas y bajas de cuentas también puede integrarse con los sistemas existentes.

Antes era habitual crear por separado una base de datos y un sistema de autenticación y conectarlos entre sí, pero con Supabase los datos y la autenticación pueden unificarse en una sola plataforma.

Con Row Level Security (RLS),

• se puede mostrar solo los datos propios de cada usuario.
• Mostrar solo los datos de la misma sede
• Los administradores pueden verlo todo

Este tipo de control también puede implementarse en la propia base de datos.

En las aplicaciones de negocio, este control de permisos es especialmente importante.

Usar Cloudflare para la distribución del frontend

Sin embargo, Supabase por sí solo no cubre todo. Uno de los puntos que no cubre es el "alojamiento del sitio web (frontend)".
Aunque la base de datos y la API puedan alojarse en Supabase, la propia pantalla a la que accede el usuario en el navegador debe distribuirse desde otra ubicación.

Los principales proveedores para esta distribución son Vercel y Cloudflare. Nosotros elegimos Cloudflare, por varias razones.

• Permite gestionar de forma centralizada todo, desde DNS, CDN y WAF hasta la distribución de la aplicación, en Cloudflare
• Con Cloudflare Workers no solo se distribuye el frontend, sino que también se puede integrar el procesamiento de API y los servicios externos en un mismo lugar
• Ofrece servicios complementarios que encajan bien con las aplicaciones de negocio, como R2 (almacenamiento) y Access (control de acceso)
• Un modelo de facturación por transferencia de datos simple, con un presupuesto fácil de seguir

Quizás Cloudflare evoque sobre todo CDN y DNS, pero hoy en día es también un servicio plenamente útil como plataforma de ejecución para aplicaciones web.

Cloudflare desde la perspectiva de una agencia de desarrollo

En otras palabras, en esta arquitectura, Cloudflare se encarga de recibir los accesos de los usuarios y devolver las pantallas y las API, mientras que Supabase gestiona por detrás los datos, la autenticación y el control de permisos.

Combinar Supabase y Cloudflare

Por ejemplo, una arquitectura como esta.

Una aplicación que se ejecuta en Cloudflare Workers recibe los accesos de los usuarios y devuelve las pantallas y las API, mientras que Supabase se encarga de los datos y la autenticación en segundo plano.

Según sea necesario, se pueden enviar correos con SendGrid, guardar archivos en almacenamiento externo como Box o integrarse mediante API con otros sistemas de negocio.

La ventaja de esta arquitectura es que está compuesta por tecnologías estándar y no depende de un proveedor concreto para integrarse.
Siempre que un sistema admita integración por API, puede conectarse libremente, ya sea un sistema troncal existente o un SaaS que ya utilice. No existe esa limitación típica de los paquetes de software del tipo "este producto solo puede integrarse con ○○".

Ejemplos de aplicaciones de negocio que se pueden crear

Aplicación interna de solicitudes y aprobaciones

Una aplicación en la que las solicitudes se registran desde cada sede o responsable, y son aprobadas por superiores o administradores.
Según el usuario que haya iniciado sesión,

• solo se muestran sus propias solicitudes
• se muestran las solicitudes de su sede
• los administradores pueden ver todas las solicitudes

, entre otros controles.
Es como convertir en una aplicación web el trabajo que antes se gestionaba por correo electrónico y Excel.

Portal para socios comerciales

Se emite un ID de inicio de sesión para cada socio comercial y

• consultar documentos
• subir archivos
• Seguimiento del progreso
• Contacto
• Consulta de información del contrato

También se puede crear un portal para realizar tareas como esta.
También resulta relativamente sencillo controlar la información que se muestra a cada cliente o socio comercial.

Gestión de horas de trabajo y asistencia

Una aplicación en la que cada empleado introduce sus horas de trabajo y su dedicación, y que agrega los datos por proyecto y por responsable.
Cuando existen reglas propias o métodos de agregación específicos de la empresa, que los SaaS de control de asistencia habituales no contemplan bien, una aplicación web a medida encaja especialmente bien.

Este tipo de tareas suelen volverse más engorrosas cuando se intenta adaptarlas a un producto estándar.

Sistema de gestión de sucursales

También es adecuado para aplicaciones web en las que las tiendas y oficinas de todo el país registran su información y la sede la gestiona de forma centralizada.

Podemos atender desde herramientas internas que usan unas pocas personas hasta aplicaciones de negocio que se utilizan en varias sucursales.
Tampoco se trata solo de soluciones pequeñas por usar Supabase.
Según el diseño, puede utilizarse en una amplia variedad de casos.

Por ejemplo, en Liberogic hemos ayudado a desarrollar aplicaciones como estas.

Sistema de gestión de redes sociales "TOYOTA Social Hub" para Toyota Motor Corporation: diseño UI/UX y desarrollo de sistema

Criterios para decidir un aplicativo web a medida en lugar de un SaaS

Hasta aquí hemos destacado las ventajas de un aplicativo web a medida, pero no siempre es la mejor opción.
Entonces, ¿cómo saber cuándo conviene desarrollarlo? Estos son algunos indicadores basados en la experiencia con consultas reales.

• Las soluciones alternativas se han vuelto habituales
  , ya que los flujos de trabajo no encajan con las suposiciones de un SaaS: las rutas de aprobación varían según el departamento, hay muchas excepciones y la configuración no logra absorberlas
• Se requiere un control detallado de permisos y visualización
  : se quiere mostrar información distinta según el departamento, la sede o el cliente, pero los permisos de un SaaS no ofrecen suficiente granularidad
• El trabajo se reparte entre varias herramientas
  : se alterna entre Excel, correo y varios SaaS, y copiar y pegar datos se ha vuelto algo cotidiano
• Hay muchos campos de gestión y reglas de cálculo propios
  : los datos específicos de la empresa se fuerzan en los campos genéricos de un SaaS
• En el día a día sobra funcionalidad o falta lo necesario
  : al ser un SaaS genérico, la pantalla resulta compleja y no se usa en campo, o faltan justo las funciones que se necesitan

Si solo se cumple uno o dos de estos puntos, muchas veces basta con revisar la configuración o la operación del SaaS.
Sin embargo, si se cumplen varios y se acumulan pequeñas molestias a diario, consideramos que es momento de evaluar un aplicativo web a medida que se ajuste al trabajo.

De hecho, las consultas sobre un aplicativo web a medida suelen empezar con frases como «quiero pasar a web la información que llevamos en Excel», «quiero digitalizar las solicitudes que circulan por correo» o «quiero unificar en un solo lugar un trabajo que hoy pasa por varios SaaS».

Empezar en pequeño y crecer con el uso

Hasta aquí hemos hablado de la arquitectura técnica, pero para terminar, lo que nos gustaría transmitir no es tanto las funciones de Supabase o Cloudflare en sí, sino la forma en que llevamos el proyecto.

"Qué deberíamos construir" es algo que, sorprendentemente, no siempre se aclara a partir del documento de requisitos

El desarrollo de software convencional suele empezar con la definición de requisitos. Se documentan primero los procesos de negocio existentes y, a partir de ahí, se diseña un sistema que los cubra.

Sin embargo, este enfoque tiene un punto débil. Aunque el documento cubra todos los procesos sobre el papel, suele faltar una pregunta clave: "¿Será realmente fácil de usar?" y "¿Es necesaria esta función de verdad?". Así, los requisitos se acumulan sin que nadie los cuestione.
En especial, para quienes asumen la responsabilidad de impulsar la transformación digital sin ser especialistas en desarrollo de sistemas, juzgar la validez de los requisitos solo con texto y tablas resulta muy difícil.

Por eso, en Liberogic no nos limitamos a cerrar un extenso documento de requisitos desde el principio. En su lugar, creamos maquetas interactivas (prototipos de pantalla que se pueden manejar de verdad) con herramientas como Figma, v0 y Claude Code, y avanzamos en el proyecto con el cliente probándolas.

A diferencia de un documento de requisitos escrito, al manejar la pantalla uno puede experimentar de forma muy realista cómo funciona en la práctica. Y curiosamente, empiezan a surgir comentarios como "Con esta pantalla, esta parte del trabajo sería mucho más sencilla" o "¿No podríamos también automatizar aquella tarea que hacemos aparte?". La atención pasa de revisar documentos a mejorar la operativa.

En una aplicación web a medida, lo que más importa, sorprendentemente, es precisamente "qué deberíamos construir". Creemos que esto no se descubre en los documentos, sino compartiendo una imagen común a través de maquetas.

Implementar solo las funciones básicas y lanzar primero

No seguimos el modelo en cascada (waterfall), en el que todos los requisitos se definen al inicio para construir todo de una vez. Una vez que la maqueta define la dirección del proyecto, implementamos primero las partes básicas, como inicio de sesión, registro de datos, listados y panel de administración, y lanzamos con ellas.

A partir de ahí, mientras los usuarios utilizan el sistema y verificamos su experiencia y las reacciones en el terreno, añadimos funciones como aprobaciones, notificaciones por correo, gestión de archivos e integraciones con APIs externas.
La arquitectura con Supabase y Cloudflare encaja muy bien con este enfoque progresivo.

Crecer según el presupuesto y el valor para el negocio

"Empezar en pequeño y ampliar según sea necesario" también es una cuestión de presupuesto. Por ejemplo,

• desarrollando las funciones poco a poco, en función del presupuesto anual reservado
• lanzando primero una versión pequeña y ampliando la aplicación con inversiones adicionales cuando el valor para el negocio se haga visible

son algunas de las formas de avanzar. No es necesario reunir de antemano una gran inversión de desarrollo para tener una aplicación de negocio y hacerla crecer. Creemos que, en las aplicaciones de negocio, suele funcionar mejor mejorarlas a medida que se usan que intentar definir todos los requisitos perfectos desde el principio.

Conclusión

Combinando Supabase y Cloudflare, es posible crear una aplicación web dedicada con autenticación, base de datos, control de permisos, API y distribución de archivos en una configuración relativamente sencilla. Desde pequeñas herramientas internas hasta portales para clientes o sistemas de negocio que se usan en varias sedes, puede ampliarse según el caso de uso.

Sin embargo, lo realmente importante no son las herramientas en sí, como Supabase o Cloudflare, sino la forma de avanzar.

• Compartir primero una maqueta para dar una idea clara de cómo se usaría en la práctica, y descubrir qué es lo que realmente hay que construir
• Construir solo la parte básica y lanzar cuanto antes
• Usar la aplicación y hacerla crecer según el presupuesto y el valor para el negocio

Antes, este enfoque no era realista. El coste de implementar software y de construir la infraestructura era elevado, por lo que había que tenerlo todo definido de antemano antes de empezar a construir.

Hoy en día, gracias a stacks tecnológicos modernos como Supabase y Cloudflare, y al desarrollo y prototipado asistidos por agentes de IA, es posible avanzar en los proyectos de una forma más cercana al ideal: "crear primero algo tangible y hacerlo crecer con su uso". Liberogic se especializa precisamente en este enfoque.

"Este trabajo que hacemos con Excel y correos, ¿podría pasarse a la web?" o "Probamos un SaaS, pero no encaja del todo con nuestra forma de trabajar". Puede consultarnos en esta etapa sin problema. Le ayudaremos a diseñar una configuración que se adapte a su operativa, así que no dude en contactarnos.