Skip to main content

Tech Stack i estructura

Aquest document descriu l’stack tecnològic i l’estructura general del projecte Line Dance Platform (LDP).


Stack principal

Backend

  • Llenguatge: Java
  • Framework: Spring Boot
  • Funcions clau:
    • API REST per a totes les apps (web, mòbil, futurs clients),
    • lògica de negoci,
    • autenticació i autorització (JWT),
    • integració amb la base de dades.

Base de dades

  • SGBD: PostgreSQL
  • Característiques:
    • relacional, amb suport per JSONB,
    • bona integració amb Spring Data,
    • extensible amb índexs avançats (p. ex. pg_trgm per cerques de text).
  • Migracions:
    • gestionades amb Flyway.

Frontend web

  • Llenguatge: TypeScript
  • Framework: React
  • Objectiu:
    • UI d’admin/teacher,
    • CRUD ric de dades,
    • cercadors i llistes avançades.

App mòbil (futur)

  • Plataforma principal: Android
  • Stack previst:
    • Kotlin + Jetpack Compose,
    • consum de la mateixa API REST del backend.

Documentació

  • Eina: Docusaurus
  • Contingut:
    • visió i roadmap,
    • arquitectura,
    • guies de desenvolupament,
    • històric de canvis.

Estructura de carpetes (nivell alt)

A nivell de monorepo, l’estructura típica és:

line-dance-platform/
├── backend/ # Spring Boot + PostgreSQL
├── frontend/ # React + TypeScript (UI web)
├── android/ # (futur) App mòbil
└── docs-web/ # Docusaurus (aquesta documentació)

backend/

Conté:

  • codi Java (entitats, serveis, controllers),
  • fitxers de configuració Spring,
  • migracions Flyway (src/main/resources/db/migration),
  • tests de backend.

Funció principal:

  • exposar l’API per:
    • frontend,
    • app mòbil,
    • qualsevol integració externa.

frontend/

Conté:

  • aplicació React (TypeScript),
  • components de UI,
  • pàgines i rutes,
  • clients d’API,
  • gestió d’estat (si s’utilitza una llibreria).

Objectiu:

  • ser la “porta d’entrada” d’admins/teachers per gestionar dades.

android/ (futur)

Servirà per:

  • l’app pública de consulta de balls, cançons, events, etc.

Es definirà:

  • estructura de mòduls (p. ex. app, core, feature-*),
  • dependències (Compose, Retrofit/Ktor, Room, etc.).

docs-web/

Projecte Docusaurus on viu:

  • tota la documentació funcional i tècnica,

organitzada per carpetes com:

  • overview/
  • architecture/
  • roadmap/
  • dev/
  • ai/
  • history/
  • meta/
  • etc.

Dependències i components destacats

Backend (Spring Boot)

  • Spring Web (REST)
  • Spring Data JPA (persistència)
  • Spring Security (auth + rols)
  • Flyway (migracions)
  • PostgreSQL driver

Altres opcions/futur:

  • Actuator per monitorització,
  • clients per APIs externes (Spotify, YouTube, etc.).

Frontend (React)

  • React + React DOM
  • TypeScript
  • React Router (o equivalent) per rutes
  • Llibreria de formularis (React Hook Form o similar)
  • Llibreria de validació (Zod o similar)
  • Llibreria de components UI (segons stack que s’acabi utilitzant)

Documentació (Docusaurus)

  • Template classic amb TypeScript
  • Sidebars configurats per mostrar:
    • overview
    • architecture
    • roadmap
    • dev
    • history
    • etc.

Entorns

Local

  • Backend:
    • arrencat en local amb configuració de dev (DB local, ports oberts).
  • Base de dades:
    • instància local de PostgreSQL (o via docker-compose).
  • Frontend:
    • mode dev (hot reload).
  • Docs:
    • npm run start dins docs-web per previsualitzar documentació.

Entorns remots (futur)

Es preveu treballar amb:

  • Entorn de test/staging:
    • per validar noves funcionalitats amb dades de prova.
  • Entorn de producció:
    • per ús real de professors/balladors.

Els detalls de cada entorn i com desplegar-hi es documenten a:

  • repos-envs/repos-overview
  • repos-envs/environments
  • dev/backend-setup
  • dev/dev-guide

On aprofundir

Per entendre la foto global del sistema:

  • architecture/architecture-overview

Per veure com evoluciona el model de dades:

  • architecture/db-redesign-plan

Per veure com entra i es processa la informació externa:

  • architecture/import-system

Per entendre el roadmap tècnic:

  • roadmap/roadmap-technical-details