Arquitectura Técnica
Dos repositorios independientes: server (Laravel) y client (Nuxt)
Visión General
Repostea se compone de dos aplicaciones separadas que se comunican mediante API REST y WebSockets:
client/
Nuxt 3 (Vue 3)
→ HTTP/REST →
← WebSocket ←
server/
Laravel 12
↔
MySQL
+ Redis
server/ — Laravel 12
Stack
| Framework | Laravel 12, PHP 8.2+ |
| Base de datos | MySQL/MariaDB (SQLite para tests) |
| Caché/Sesiones | Redis |
| Autenticación | Laravel Sanctum (tokens SPA) |
| WebSockets | Laravel Reverb |
| Colas | Laravel Queue (Redis driver) |
| Tests | Pest v3.8+ |
| Análisis estático | PHPStan nivel 5 |
| Formato | Laravel Pint (PSR-12) |
Estructura
server/
├── app/
│ ├── Http/
│ │ ├── Controllers/Api/ # Controladores REST
│ │ ├── Middleware/ # Auth, CORS, rate limiting
│ │ ├── Requests/ # Form Requests (validación)
│ │ └── Resources/ # API Resources (transformación)
│ ├── Models/ # Eloquent models
│ ├── Services/ # Lógica de negocio
│ ├── Jobs/ # Tareas en cola
│ ├── Events/ # Eventos broadcast
│ └── Notifications/ # Notificaciones (email, push)
├── database/
│ ├── migrations/ # Esquema de BD
│ ├── factories/ # Factories para tests
│ └── seeders/ # Datos de prueba
├── routes/
│ ├── api.php # Rutas /api/v1/*
│ └── channels.php # Canales WebSocket
└── tests/
├── Feature/ # Tests de integración
└── Unit/ # Tests unitarios
API REST
Todos los endpoints bajo /api/v1/. Autenticación via Bearer token (Sanctum).
GET/postsListar posts (paginado)
POST/postsCrear post
GET/posts/{id}Detalle de post
POST/posts/{id}/voteVotar post
GET/posts/{id}/commentsComentarios (anidados)
POST/commentsCrear comentario
GET/subsListar comunidades
GET/users/{id}Perfil público
POST/auth/loginLogin (devuelve token)
POST/auth/registerRegistro
WebSockets (Reverb)
Eventos en tiempo real via Laravel Echo. Canales privados y de presencia.
agoraChat público (mensajes efímeros)
private-user.{id}Notificaciones personales
post.{id}Nuevos comentarios en post
client/ — Nuxt 3
Stack
| Framework | Nuxt 3 (Vue 3, Composition API) |
| Lenguaje | TypeScript (strict mode) |
| Estado | Pinia |
| Estilos | Tailwind CSS |
| HTTP | useFetch / $fetch (Nuxt built-in) |
| WebSockets | Laravel Echo + Pusher client |
| i18n | @nuxtjs/i18n (15+ idiomas) |
| Tests unitarios | Vitest |
| Tests E2E | Cypress |
| Linting | ESLint + Prettier |
Estructura
client/
├── components/
│ ├── posts/ # PostCard, PostList, PostForm...
│ ├── comments/ # CommentCard, CommentTree...
│ ├── agora/ # Chat en tiempo real
│ ├── ui/ # Componentes genéricos
│ └── layout/ # Header, Footer, Sidebar
├── composables/
│ ├── useAuth.ts # Autenticación
│ ├── useApi.ts # Wrapper de $fetch
│ ├── useWebSocket.ts # Conexión Echo
│ └── useInfiniteScroll.ts
├── pages/
│ ├── index.vue # Home (feed)
│ ├── post/[id].vue # Detalle de post
│ ├── s/[sub]/index.vue # Comunidad
│ ├── u/[username].vue # Perfil de usuario
│ ├── submit.vue # Crear post
│ └── auth/
│ ├── login.vue
│ └── register.vue
├── stores/
│ ├── auth.ts # Usuario actual, token
│ ├── posts.ts # Cache de posts
│ └── notifications.ts # Notificaciones
├── plugins/
│ ├── api.js # Plugin $api
│ └── echo.client.js # Laravel Echo
├── i18n/
│ └── locales/ # Traducciones (es, en, ca, eu, gl...)
└── cypress/
└── e2e/ # Tests E2E
Comunicación con el Server
API REST
El plugin api.js configura $fetch con:
- Base URL desde
NUXT_PUBLIC_API_URL - Token Bearer automático desde el store de auth
- Interceptor para manejar 401 (logout automático)
- Refresh de token transparente
WebSockets
Laravel Echo conecta a Reverb para eventos en tiempo real:
- Notificaciones push instantáneas
- Chat de Agora (mensajes efímeros)
- Actualizaciones de votos/comentarios en vivo
- Indicadores de presencia (quién está online)
Comandos
server/
# Desarrollo php artisan serve php artisan queue:listen php artisan reverb:start # Base de datos php artisan migrate php artisan db:seed # Calidad vendor/bin/pint # Formato vendor/bin/phpstan # Análisis php artisan test # Tests
client/
# Desarrollo npm run dev # Build npm run build npm run preview # Calidad npm run lint npm run quality # Tests npm run test npm run test:e2e
Autenticación y Federación
OAuth / Login Social
Laravel Socialite para login con proveedores externos:
- • Twitter/X
- • Telegram
- • Mastodon (cualquier instancia)
- • Mbin/Kbin
ActivityPub (Fediverso)
Federación con el fediverso:
- • Posts federados a Mastodon, Lemmy, Mbin
- • Comentarios federados
- • Perfiles con handle @user@instancia
- • Firmas HTTP para autenticación
- • Inbox/Outbox para actividades