LonLife (TFG)

Aplicación web de nutrición que incluye compra de producos de nutrición, opción de ser usuario premium para contenido exclusivo y la posibiloidad de pagar por planes de nutrición personalizados.

Ver en GitHub Ver proyecto

1 / 4

Stack Tecnológico

Tecnologías utilizadas en el desarrollo de LongLife

Frontend

Vue 3

Framework Principal

Framework progresivo de JavaScript para construir interfaces de usuario reactivas. Utilizado con Composition API para mejor organización del código.

TypeScript

Lenguaje Base

Lenguaje de tipado fuerte para lógica de aplicación, manipulación de datos y gestión de estado.

HTML5

Estructura

Semántica moderna para una estructura de página accesible y optimizada para SEO.

Tailwind CSS

Estilos

Estilos modernos con flexbox, grid y animaciones para una interfaz atractiva y responsive.

Backend

CodeIgniter 4

Framework PHP

Framework PHP ligero y potente para el desarrollo de la API REST. Proporciona arquitectura MVC, routing y gestión de sesiones.

RESTful APIMVC PatternAuthentication

PHP 8+

Lenguaje Backend

Lenguaje de servidor para lógica de negocio, procesamiento de datos y gestión de autenticación de usuarios.

Base de Datos

MySQL

Base de Datos Relacional

Sistema de gestión de bases de datos relacional para almacenar y gestionar datos de usuarios, productos y transacciones.

El Desafío

Retos técnicos y problemáticas resueltas en el desarrollo

Creación de una Tienda Intuitiva

Desarrollar una experiencia de compra fluida y atractiva que permitiera a los usuarios navegar por productos nutricionales, visualizar detalles y realizar compras de forma sencilla. Se implementó un catálogo dinámico con filtrado, carrito de compras y proceso de checkout optimizado.

Integración de Stripe

Implementar un sistema de pagos seguro y completo utilizando Stripe API. Los principales retos incluyeron:

Gestión de webhooks para confirmación de pagos
Manejo de estados de transacción (pendiente, completado, fallido)
Integración de métodos de pago múltiples
Seguridad en el manejo de datos sensibles de tarjetas

Sistema de Suscripciones Premium

Crear un modelo de suscripción recurrente con Stripe Subscriptions que permitiera a los usuarios acceder a contenido exclusivo. Desafíos resueltos:

Gestión de renovaciones automáticas mensuales/anuales
Control de estados de suscripción (activa, cancelada, vencida)
Sincronización entre Stripe y la base de datos local
Portal de cliente para gestionar suscripciones

Panel de Administración

Desarrollar un panel completo para gestionar toda la plataforma:

CRUD de productos con gestión de imágenes y stock
Gestión de usuarios y roles (cliente, premium, administrador)
Visualización de transacciones y reportes de ventas
Control de contenido exclusivo para usuarios premium
Dashboard con métricas y estadísticas en tiempo real

Lógica de Planes y Empleados

Implementar un sistema complejo de planes nutricionales personalizados:

Asignación de nutricionistas (empleados) a clientes
Creación y gestión de planes personalizados por usuario
Sistema de calendario para seguimiento de planes
Comunicación entre clientes y nutricionistas
Gestión de disponibilidad y carga de trabajo de empleados

Manejo de Estados Complejos

Coordinar múltiples estados interrelacionados: autenticación de usuario, estado de suscripción, carrito de compras, planes activos y rol de usuario. Se implementó un sistema de gestión de estado reactivo con Vue 3 Composition API y Pinia para mantener la consistencia de datos en toda la aplicación.