Saltar al contenido principal
Volver al Inicio

Aisiplan

Plataforma para la gestión de actividades de ocio y tiempo libre

Plataforma fullStack que centraliza actividades de ocio, permitiendo a usuarios descubrir e inscribirse, y a empresas gestionar sus publicaciones desde un panel.

TypeScriptReact.jsNode.jsScssViteExpressMySQLTypeORMJWTFigma

El Reto

No existía una plataforma que unificara toda la oferta de ocio local. Las alternativas (Eventbrite, Meetup, Airbnb Experiences, Fever) están fragmentadas: unas enfocadas al turismo, otras solo a música, y ninguna facilita el descubrimiento de actividades pequeñas o gratuitas de empresas locales. El reto era construir una web que centralizara toda la oferta y permitiera a pequeñas empresas publicar sin barreras.

Decisiones UX/UI

Identidad visual propia con logotipo y paleta naranja que transmite energía. Header fijo con navegación adaptativa al iniciar sesión. Página de inicio con buscador, actividades destacadas, categorías visuales y carrusel de empresas. Formularios con validación en tiempo real y mensajes claros. Accesibilidad: contraste suficiente, tipografía legible y etiquetas semánticas.

Arquitectura del Código

Frontend con React + Vite + TypeScript + Scss. Backend con Node.js + Express + TypeORM sobre MySQL. API RESTful con autenticación JWT, subida de archivos con Multer y middlewares de validación. Base de datos relacional con 5 tablas, claves foráneas y restricciones de integridad.

Problemas que Resuelve

Centraliza la oferta de ocio en un único acceso, eliminando búsquedas dispersas. Pequeñas empresas locales publican sin coste. Usuarios buscan por localización y categorías, se inscriben directamente. Empresas gestionan publicaciones e inscripciones desde un panel.

Funcionalidades Clave

• Sistema de autenticación con JWT y roles (empresa/usuario)

CRUD completo de actividades con formularios dinámicos

• Panel de perfil para empresas con gestión de actividades e inscripciones

• Buscador con filtros por texto, localización y categorías

• Subida de imágenes y vídeos con Multer

• Arquitectura modular escalable (backend separado del frontend)

• Base de datos relacional con 5 tablas y relaciones normalizadas

• Seeders para carga inicial de datos

Mi Rol

Desarrollo fullStack completo: investigación de mercado, diseño de identidad visual y prototipos en Figma, base de datos MySQL, backend con Node.js + Express + TypeORM, frontend con React + Vite + TypeScript + Scss, autenticación JWT, pruebas con Postman, despliegue en Vercel y documentación técnica.

Detalles Técnicos

Frontend: React + Vite + TypeScript + Scss. Componentes reutilizables, React Router para navegación, Context API para estado de autenticación

Backend: Node.js + Express + TypeORM. Arquitectura MVC con controladores, entidades, rutas y middlewares

Base de datos: MySQL relacional con 5 tablas (Category, UserData, Company, Activity, Registration), claves foráneas e índices

Autenticación: JWT con middlewares de protección de rutas y contexto de sesión en frontend

API REST: Endpoints completos para usuarios, empresas, actividades, categorías e inscripciones

Subida de archivos: Multer para imágenes y vídeos, almacenados en carpeta pública

Validación: Postman para pruebas de endpoints y middlewares de validación server-side

Metodología: Kanban con Trello, documentación en Notion, control de versiones con Git + GitHub

Infraestructura

Frontend: Vercel

Backend: Render

Base de datos: Aiven (MySQL)

Imágenes: Cloudinary