FilmFlix - Netflix-like Application

Una aplicación tipo Netflix construida con TMDB API, React 18 (legacy), Tailwind CSS y shadcn/ui.

🚀 Quick Start

# Instalación
npm install

# Development
npm run dev

# Build
npm run build

📚 Documentación

Planificación & Análisis

• API Endpoints - Endpoints TMDB, rate limiting, transformaciones
• Modelo de Datos - Schema 3NF, entidades, validación
• Arquitectura - Capas, flujo de datos, React 18 legacy

Desarrollo

• UI Kit & Design System - Componentes shadcn/ui, tokens Tailwind, especificaciones
• Design System Spec - Especificación completa: tokens, estados, variantes, accesibilidad
• Component Catalog - Referencia visual rápida de componentes
• TMDB Setup Guide - Guía para obtener credenciales de TMDB
• Plan de Commits - Conventional commits, tags, ciclo de release
• Dependencias - Gestión de versiones, security policy

Release Management

• Versionado & Release - SemVer, release notes, automation
• Changelog - Historial de versiones y cambios

🎯 Stack Tecnológico

Capa	Tecnología
Frontend	React 18 (clases + setState)
Estilos	Tailwind CSS v3
Componentes UI	shadcn/ui
HTTP Client	Fetch API + HTTPClient wrapper
State	LocalStorage + Context API
API Externa	TMDB v3

📋 Current Release

Version: v0.2.0 (Documentation Complete)
Status: Ready for Implementation

Features Completados

• ✅ Documentación de API endpoints con análisis completo
• ✅ Modelo de datos normalizado (3NF)
• ✅ Arquitectura de sistema completa
• ✅ Plan de commits secuenciados (25 commits)
• ✅ UI Kit & Design System specification

Próximos Pasos

• 🔄 Implementación de componentes UI
• 🔄 Setup de proyecto React
• 🔄 HTTPClient + Normalizer layer
• 🔄 Home & Grid components

🎨 Design System

Paleta de colores dark-first optimizada para streaming:

• Fondo principal: #0b0b0f (casi negro)
• Superficies: #11131a / #151827 (gris oscuro)
• Texto: #f2f2f7 (blanco roto)
• Acentos: Purpura/Rosa (gradientes Netflix-style)

Ver UI Kit completo para tokens, componentes y especificaciones de accesibilidad.

🏗️ Project Structure

verflix/
├── DOCS/
│   ├── api_endpoints.md
│   ├── data_model.md
│   ├── arquitectura.md
│   ├── ui_kit.md              # Design System
│   ├── plan_commits.md
│   ├── versionado_release.md
│   ├── dependencias.md
│   └── changelog.md
├── src/
│   ├── components/
│   │   ├── common/
│   │   ├── layout/
│   │   └── media/
│   ├── pages/
│   ├── services/
│   └── App.js
└── README.md

📖 Cómo Usar Esta Documentación

1. Nuevo en el proyecto: Lee arquitectura.md
2. Setup inicial: Sigue TMDB Setup Guide para configurar la API
3. Implementar componentes:
   • Ver Design System Spec para especificaciones completas
   • Usa Component Catalog como referencia rápida
4. Entender la data: Consulta data_model.md
5. Release nuevo: Sigue versionado_release.md

🔗 Enlaces Útiles

• TMDB API Docs
• shadcn/ui
• Tailwind CSS
• React 18 Docs

📝 License

MIT