feat: add comprehensive Claude Code configuration and best practices #4
+12,309
−507
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add complete Claude Code setup with specialized agents, slash commands, automation hooks, and CI/CD workflows to optimize development workflow. Changes: - Claude configuration: * Add mobile agent for Android/iOS development * Add slash commands: /review-api, /test-coverage, /security-audit, /deploy-checklist * Add session-start and before-commit hooks * Add feature specification template * Add comprehensive documentation in .claude/README.md - Project configuration: * Add .claudeignore for performance optimization * Add global Makefile with common commands (start, test, clean, etc.) * Add Backend/.env.example with all configuration options * Add Frontend/.env.example with all environment variables - CI/CD workflows: * Add automated testing workflow (Backend + Frontend + Integration) * Add Docker build & security scan workflow Benefits: - Improved productivity with slash commands for common tasks - Automated code quality checks with hooks - Consistent development standards with specialized agents - Better CI/CD coverage with automated testing - Clear documentation for onboarding new developers All configurations follow project conventions and are documented in .claude/README.md
…11CUsjjNQ5C9fjpHSa9gJmh feat: add comprehensive Claude Code configuration and best practices
Complete rebranding from Platziflix to Mindia with professional brand identity: Brand Identity: - Colors: Primary #1E3A8A (blue), Secondary #7C3AED (violet), Accent #06B6D4 (cyan) - Typography: Outfit Bold + Inter Regular (replacing Geist fonts) - Tagline: "Donde la mente y la tecnología se encuentran para aprender" - Concept: Mind + Media fusion representing intelligent learning Changes: - Update complete color palette to Mindia brand colors - Replace Geist fonts with Outfit (headings) + Inter (body) - Update all meta tags, SEO content, and Open Graph tags - Rebrand homepage banner from PLATZIFLIX to MINDIA - Update API description and welcome message - Update all environment variable templates - Replace red accent (#ff2d2d) with cyan accent (#06B6D4) Files modified: - Frontend/src/styles/vars.scss - New color system - Frontend/src/app/layout.tsx - Fonts and metadata - Frontend/src/app/page.tsx - Banner text - Frontend/src/app/page.module.scss - Banner styling - Frontend/.env.example - Environment variables - Backend/.env.example - Project name - Backend/app/main.py - API description
Diseño completamente renovado con efectos modernos y futuristas: Visual Improvements: - Fondo azul noche con gradiente (#0F172A → #1E293B) - Banner MINDIA con gradientes dinámicos (azul→violeta, cian→violeta) - Glassmorphism en cards con backdrop-filter blur - Grid tech background con pulso animado Animations: - fadeInDown en banner (1s) - pulseGlow en texto con drop-shadows - slideInLeft/Right en textos laterales (1.5s) - fadeInUp staggered en cards (0.1s-0.6s delay) - Hover effects mejorados con cubic-bezier bounce Effects: - Text glow con filter: drop-shadow - Gradient text con background-clip - Hover glow cian en cards (0 0 40px accent-glow) - Box-shadow multicapa con glows - Subtle radial gradient overlay Typography: - Incremento a 5rem en banner (más impacto) - Gradient text en teachers (cian→violeta) - Text-shadow para legibilidad en fondo oscuro - White text en card titles Colors Added: - primary-glow, secondary-glow, accent-glow (RGBA) - dark-bg-light: #1E293B Performance: - Hardware-accelerated (transform, opacity) - will-change implícito en transitions - Smooth cubic-bezier easing Files modified: - Frontend/src/styles/vars.scss - Nuevos glow colors - Frontend/src/app/page.module.scss - Animaciones y glassmorphism - Frontend/src/app/page.tsx - Layout mejorado del banner
- Banner ahora muestra MIND IA (separado) - Actualizar tagline: 'Aprende con inteligencia artificial' - Mayor separación entre palabras (gap: 1.5rem) - Laterales actualizados: MIND (izq) + IA (der)
🎨 COMPONENTES NUEVOS (14 archivos): 1️⃣ Navbar - Logo MIND IA con gradientes - Menú sticky con blur backdrop - Botones de autenticación - Smooth scroll behavior - Animaciones hover con glow 2️⃣ Hero Section - Título grande con gradientes - CTA buttons con animaciones - Stats (500+ cursos, 10K+ estudiantes, 4.8★) - Partículas flotantes animadas - Responsive design 3️⃣ SearchBar - Input con blur glassmorphism - Iconos animados - Clear button con rotate - Focus states con glow - Placeholder largo descriptivo 4️⃣ Filters Sidebar - 6 categorías con contador - Filtros por nivel (3 opciones) - Filtros por duración (4 rangos) - Rating slider (0-5 estrellas) - Checkboxes custom con animaciones - Sticky positioning 5️⃣ Badges en Cards - 🔥 TRENDING (red-orange gradient) - ✨ NUEVO (purple gradient) - ⭐ TOP RATED (cyan-blue gradient) - Lógica dinámica basada en rating/ratings - Pulse animation - Backdrop blur 6️⃣ Testimonials - Carrusel auto-rotating (5s) - 3 testimonios con avatares - Star ratings animados - Dots navigation - Smooth transitions - Quote decorativo 7️⃣ Footer - 4 columnas (About, Cursos, Soporte, Newsletter) - Logo MIND IA - Social links (Twitter, GitHub, LinkedIn) - Newsletter form - Hover effects con glow - Copyright con brand gradient 8️⃣ ScrollProgress - Barra fixed top - Gradiente tricolor (cyan→violet→blue) - Smooth width transition - Glow shadow 9️⃣ Layout Integration - Estructura completa de página - Grid de 2 columnas (filters + courses) - Section headers con "Destacados" - Contador de cursos - Responsive breakpoints 📐 ESTILOS ACTUALIZADOS: Frontend/src/app/page.module.scss: - contentSection, container, coursesWrapper - sectionHeader, sectionTitle, highlight - Media queries para responsive Frontend/src/components/Course/Course.module.scss: - Badge styles (new, trending, top) - Pulse animation - Gradient backgrounds Frontend/src/components/Course/Course.tsx: - getBadge() logic - Conditional badge rendering 📊 FEATURES IMPLEMENTADAS: ✅ Navbar fijo profesional ✅ Hero con CTA y stats ✅ Búsqueda avanzada ✅ Filtros sidebar (categorías, nivel, duración, rating) ✅ Badges dinámicos en cards ✅ Testimonials carousel ✅ Footer completo 4 columnas ✅ Scroll progress bar ✅ Layout responsive con filtros 🎭 ANIMACIONES & EFECTOS: - fadeInUp, fadeInDown, slideInLeft, slideInRight - pulseGlow en textos - badgePulse en badges - starPulse en ratings - Hover effects con scale, glow, translateY - Smooth cubic-bezier easings - Backdrop-filter blur en glassmorphism 💎 MEJORAS DE UX: - Sticky navbar que aparece al scroll - Progress bar muestra % de scroll - Filters sticky en sidebar - Cards con hover elevación - Testimonials auto-rotate con pause on hover - Newsletter form funcional - Social links con iconos SVG 📱 RESPONSIVE: - @media (max-width: 1024px) - oculta filters - @media (max-width: 768px) - ajusta tipografía - Flex-direction column en móviles Archivos modificados: 4 Archivos nuevos: 14 Total: 18 archivos Stack: Next.js 15 + React 19 + SCSS + TypeScript
🔍 BÚSQUEDA INTELIGENTE: - Debounce 300ms para evitar búsquedas excesivas - Búsqueda en nombre y descripción de cursos - Input sin lag visual (localQuery + useEffect) - Botón clear funcional 🎯 FILTROS FUNCIONALES: - Categorías clickables (6 opciones) - Nivel: Principiante, Intermedio, Avanzado - Duración: 4 rangos de tiempo - Rating mínimo: slider 0-5 estrellas - Botón "Limpiar" resetea todo - Filtrado en tiempo real ❤️ SISTEMA DE FAVORITOS: - Botón corazón en cada card (top-left) - Persiste en localStorage - Animación heartBeat al toggle - Toast notifications al agregar/quitar - Estado sincronizado globalmente 🎨 SKELETON LOADERS: - Componente SkeletonCourse creado - Shimmer animation profesional - Mismo tamaño que CourseCard - Listo para estados de carga 🔔 TOAST NOTIFICATIONS: - ToastProvider + ToastContext - 3 tipos: success, error, info - Auto-dismiss 3 segundos - Click to close manual - Posición top-right fixed - Animaciones slideIn/slideOut suaves 📦 CONTEXTOS GLOBALES: - CourseContext: búsqueda, filtros, favoritos - ToastContext: notificaciones - State management centralizado 📝 ARCHIVOS MODIFICADOS: - Frontend/src/app/layout.tsx - Providers - Frontend/src/app/page.tsx - Client component con filteredCourses - Frontend/src/components/Course/Course.tsx - Botón favoritos - Frontend/src/components/Course/Course.module.scss - Estilos favoritos - Frontend/src/components/Filters/Filters.tsx - Conectado a contexto - Frontend/src/components/SearchBar/SearchBar.tsx - Debounce 📝 ARCHIVOS CREADOS: - Frontend/src/contexts/CourseContext.tsx - Frontend/src/contexts/ToastContext.tsx - Frontend/src/components/Toast/Toast.tsx - Frontend/src/components/Toast/Toast.module.scss - Frontend/src/components/SkeletonCourse/SkeletonCourse.tsx - Frontend/src/components/SkeletonCourse/SkeletonCourse.module.scss 🎭 ANIMACIONES: - heartBeat en botón favoritos - shimmer en skeleton loader - slideIn/Out en toasts - Cubic-bezier suaves 💎 UX IMPROVEMENTS: - Búsqueda instantánea sin lag - Filtros interactivos en tiempo real - Feedback visual con toasts - Favoritos persistentes - Count dinámico de cursos Stack: Next.js 15 + React 19 + TypeScript + SCSS
…zation
📸 OPTIMIZACIÓN DE IMÁGENES:
- Migrado de <img> a Next.js <Image>
- Lazy loading automático
- Responsive sizes optimizados
- Configuración de dominios externos
- DeviceSizes: [640, 750, 828, 1080, 1200]
🗂️ CATEGORÍAS INTERACTIVAS:
- 8 categorías con iconos: 💻 🤖 📊 📱 🎨 ☁️ ⛓️ 🔐
- Cards circulares con glassmorphism
- Hover: rotate + scale + glow
- Click filtra cursos por categoría
- Integrado con CourseContext
- Grid responsive 4x2
- Animación slideUp staggered
🔗 BREADCRUMBS COMPONENT:
- Navegación jerárquica
- Glassmorphism background
- Separador "/" con color accent
- Último item sin link
- Hover glow effect
- TypeScript interfaces
🎨 PÁGINA 404 CUSTOM:
- Diseño acorde a MIND IA
- Título "404" con glow animado
- Mensaje gracioso sobre IA
- Partículas flotantes canvas
- Stats: 100% Perdido, 0% Encontrado
- Botón "Volver al inicio" gradiente
- Responsive design completo
📄 CURSO DETAIL MEJORADO:
- Hero con thumbnail grande + overlay
- Breadcrumbs: Inicio > Cursos > {name}
- Tabs dinámicos: Descripción | Contenido | Reviews
- Card de instructor con avatar
- Lista de clases con números
- Reviews con avatares y stars
- Botón CTA sticky "Empezar curso 🚀"
- Diseño completo MIND IA
🎯 INTEGRACIÓN HOME:
- Categories después de SearchBar
- Anchor id="cursos" para scroll
- Título "Explora por categoría"
📦 ARCHIVOS CREADOS (8):
- Frontend/src/components/Categories/Categories.tsx
- Frontend/src/components/Categories/Categories.module.scss
- Frontend/src/components/Breadcrumbs/Breadcrumbs.tsx
- Frontend/src/components/Breadcrumbs/Breadcrumbs.module.scss
- Frontend/src/app/not-found.tsx
- Frontend/src/app/not-found.module.scss
📝 ARCHIVOS MODIFICADOS (6):
- Frontend/next.config.ts - Image domains config
- Frontend/src/app/page.tsx - Categories integration
- Frontend/src/components/Course/Course.tsx - Next Image
- Frontend/src/components/Testimonials/Testimonials.tsx - Next Image
- Frontend/src/components/CourseDetail/CourseDetail.tsx - Tabs & Hero
- Frontend/src/components/CourseDetail/CourseDetail.module.scss - Full redesign
🎭 ANIMACIONES NUEVAS:
- slideUp staggered (categorías)
- pulse infinito (404 título)
- float particles (404 background)
- slideIn tabs (course detail)
- glowPulse (breadcrumbs hover)
💎 CARACTERÍSTICAS:
- TypeScript estricto en todo
- Responsive design completo
- Accesibilidad (aria-labels)
- SEO friendly (breadcrumbs, alt tags)
- Lazy loading images
- Smooth animations
Stack: Next.js 15 + React 19 + TypeScript + SCSS
💜 PÁGINA DE FAVORITOS: - Ruta /favorites creada - Usa useCourses() para favoritos - Grid de cursos favoritos - Empty state con EmptyState component - Header con contador dinámico - Loading state mientras carga - Responsive design completo ❤️ NAVBAR CON FAVORITOS: - Link "Favoritos" en menú - Badge contador animado (pulse) - Badge solo visible si hay favoritos - Gradiente MIND IA - Integrado con contexto ⬆️ SCROLL-TO-TOP BUTTON: - Botón flotante bottom-right - Visible solo cuando scroll > 300px - Smooth scroll behavior - Glassmorphism + glow effect - Hover animations - Responsive (menor en mobile) - z-index alto 📦 EMPTY STATE COMPONENT: - Reutilizable con props - Props: icon, title, message, actionLabel, actionHref - Glassmorphism design - Animaciones fadeIn + slideUp - Botón con gradiente - Responsive ⏳ LOADING STATES MEJORADOS: - 6 SkeletonCourse mientras loading - Timeout 500ms para UX suave - Transición suave skeleton → cursos - Empty message estilizado 🔍 SEO MEJORADO (MEGA): - metadataBase configurado - title template: "%s | MIND IA" - Description completa y keywords (13) - robots: index, follow - googleBot: max-video-preview, max-image-preview - OpenGraph completo (type, locale, url, siteName, images) - Twitter Card (summary_large_image) - viewport optimizado - authors, creator, publisher 📊 JSON-LD SCHEMA: - Schema.org tipo "Course" en /course/[slug] - Provider: Organization "MIND IA" - hasCourseInstance con courseMode online - aggregateRating condicional - offers category Education - educationalLevel, inLanguage, thumbnailUrl - Script tag optimizado para SEO 📝 ARCHIVOS CREADOS (6): - Frontend/src/app/favorites/page.tsx - Frontend/src/app/favorites/page.module.scss - Frontend/src/components/EmptyState/EmptyState.tsx - Frontend/src/components/EmptyState/EmptyState.module.scss - Frontend/src/components/ScrollToTop/ScrollToTop.tsx - Frontend/src/components/ScrollToTop/ScrollToTop.module.scss 📝 ARCHIVOS MODIFICADOS (6): - Frontend/src/app/layout.tsx - SEO + ScrollToTop - Frontend/src/app/page.tsx - Loading states - Frontend/src/app/page.module.scss - Empty styles - Frontend/src/app/course/[slug]/page.tsx - JSON-LD - Frontend/src/components/Navbar/Navbar.tsx - Link favoritos - Frontend/src/components/Navbar/Navbar.module.scss - Badge 🎭 ANIMACIONES: - pulse en badge contador - fadeIn en empty state - slideUp en empty state content - fadeInOut en scroll-to-top 💎 CARACTERÍSTICAS: - TypeScript estricto - Responsive design - Accesibilidad (aria-labels) - Performance optimizado - SEO friendly - Componentes reutilizables Stack: Next.js 15 + React 19 + TypeScript + SCSS
📱 PWA SUPPORT COMPLETO: - manifest.json con branding MIND IA - Theme color: #06B6D4 (accent) - Background: #0F172A (dark-bg) - Display: standalone - Shortcuts a Cursos y Favoritos - Icons 192x192, 512x512 - Apple touch icon support - Apple web app capable - Meta tags PWA completos 🎬 SCROLL REVEAL ANIMATIONS: - Hook useScrollReveal custom - Intersection Observer API - Threshold: 0.2, triggerOnce: true - Detecta viewport entry - Fallback para navegadores antiguos - Aplicado a CourseCards - Animación fadeInUp cuando visible - Transición suave cubic-bezier ⚡ PERFORMANCE OPTIMIZATIONS: - React.memo en Course component - useMemo para badge calculation - useCallback para getCourses - Previene re-renders innecesarios - Lazy loading automático - Code splitting óptimo 🔍 SEO DINÁMICO: - sitemap.ts con Next.js App Router - Páginas estáticas + dinámicas - Fetch de cursos para /course/[slug] - Priority y changeFrequency - Revalidación cada hora - robots.ts con reglas - Allow: /, Disallow: /api/, /private/ - Googlebot y Bingbot rules ⏳ LOADING UI: - loading.tsx para toda la página - Logo MIND IA animado - Triple spinner concéntrico - Glassmorphism background - Grid pattern - Animaciones: fadeIn, pulseGlow, spin - Responsive design 🚨 ERROR BOUNDARY: - error.tsx global - Diseño MIND IA - Mensaje amigable - Detalles técnicos en dev - Botones: "Reintentar" y "Inicio" - Glassmorphism card - Grid background - Icono animado 📝 ARCHIVOS CREADOS (9): - Frontend/public/manifest.json - Frontend/src/hooks/useScrollReveal.ts - Frontend/src/app/sitemap.ts - Frontend/src/app/robots.ts - Frontend/src/app/loading.tsx - Frontend/src/app/loading.module.scss - Frontend/src/app/error.tsx - Frontend/src/app/error.module.scss 📝 ARCHIVOS MODIFICADOS (5): - Frontend/src/app/layout.tsx - PWA meta tags - Frontend/src/app/page.tsx - Scroll reveal - Frontend/src/app/page.module.scss - Animations - Frontend/src/components/Course/Course.tsx - React.memo 🎭 ANIMACIONES NUEVAS: - fadeInUp en scroll reveal - pulseGlow en loading spinner - spin en loading rings - bounce en error icon 💎 CARACTERÍSTICAS: - TypeScript estricto - Progressive enhancement - Intersection Observer - React.memo optimizations - Dynamic sitemap - PWA installable - Error handling elegante - Loading states premium Stack: Next.js 15 + React 19 + TypeScript + SCSS
This commit adds 6 major feature implementations to enhance the user experience: 1. **Dark Mode Toggle** - Full theme system with light/dark modes - ThemeContext with localStorage persistence - CSS variables for seamless theme switching - Animated moon/sun toggle button in navbar 2. **Enhanced Card Animations** - Premium hover effects - 3D transforms with rotateX and perspective - Glow effects using pseudo-elements - Parallax thumbnail scaling - Smooth cubic-bezier transitions 3. **Ripple Effects** - Material Design click feedback - Reusable useRipple hook - Applied to all buttons (navbar, search, filters) - Smooth ripple animation with auto-cleanup 4. **Mobile Hamburger Menu** - Full mobile navigation - Animated hamburger button with X transformation - Slide-in menu from right with overlay - Responsive design (mobile/desktop adaptive) - Smooth open/close transitions 5. **Touch Gestures for Testimonials** - Swipe navigation - useSwipe custom hook for touch events - Left/right swipe to navigate testimonials - Navigation arrows for desktop - Touch-friendly carousel controls 6. **Social Share Buttons** - Course sharing functionality - ShareButtons component with dropdown - Twitter, Facebook, LinkedIn, WhatsApp integration - Copy-to-clipboard functionality - Integrated in CourseDetail page Technical improvements: - Created 3 new custom hooks (useRipple, useSwipe, useTheme) - Added ThemeContext for global theme state - Enhanced responsive design with mobile-first approach - Improved accessibility with ARIA labels - Added smooth animations and transitions throughout - Implemented proper CSS isolation with modules Files modified: 13 files New files: 7 files
The universal selector (*) in vars.scss was causing a CSS Modules parsing error because CSS Modules requires pure selectors (with at least one local class or id). Moved the smooth theme transition rule from vars.scss to reset.scss which is a global CSS file and doesn't use CSS Modules. Error fixed: 'Selector is not pure' lightningcss error
Fixed CSS Modules parsing error by separating global CSS from SCSS modules: - Created theme.css for :root and [data-theme='dark'] selectors - Removed global selectors from vars.scss (kept only SCSS variables) - Imported theme.css in reset.scss CSS Modules requires pure selectors (with local classes/ids), but :root and [data-theme] are global selectors that must be in plain CSS files. Error fixed: 'Selector is not pure' for [data-theme='dark']
…coded white colors This commit fixes the light mode appearance by replacing all hardcoded white text colors with CSS custom properties that adapt to the current theme (light/dark). Changes: - Hero: Updated title, subtitle, buttons, and stats to use theme variables - Navbar: Changed navbar scrolled state and menu items to use theme colors - Page: Fixed course card backgrounds, titles, and thumbnails to respect theme - All components: Replaced rgba(255,255,255,X) with var(--text-primary/secondary/tertiary) - Removed fixed dark backgrounds and glassmorphism that looked bad in light mode Now the light mode looks clean with proper contrast and the dark mode remains perfect. Users can toggle between themes seamlessly without visual issues. Files modified: 10 SCSS files across components
Removed: - Grid background with blue squares (.gridBg) - DELETED - Vertical text decorations (.verticalLeft, .verticalRight) - DELETED - Banner animations (.banner, .bannerPrimary, .bannerAccent) - DELETED - All unnecessary decorative elements that cluttered the page Now the page has: - Clean white background in light mode - Clean dark background in dark mode - No distracting grid patterns - Simple, professional Platzi-style layout The course cards with thumbnails are now the main focus.
BREAKING CHANGES: - Removed decorative grid background and vertical text elements - Changed light mode from pure white to Platzi-style gray (#F5F7FA) - Fixed Next.js image configuration for course thumbnails Light Mode Improvements: - Updated --bg-primary to #F5F7FA (better contrast than pure white) - Darkened --text-primary to #121212 for better readability - Darkened --text-secondary to #5A5A5A for improved visibility - Changed border colors to solid values for better definition - Replaced all hardcoded rgba(255,255,255) with theme variables Thumbnail Fix: - Added via.placeholder.com to Next.js remotePatterns - Backend seed uses via.placeholder.com for thumbnails - Now course images will display correctly Component Updates: - Hero: Buttons now white on gradient, adapt on transparent - Navbar: Buttons use theme variables appropriately - SearchBar: Input text adapts to theme, button stays white on gradient - Testimonials: All text uses theme variables - Filters, Footer: Text adapts to light/dark mode Cleanup: - Removed unused decorative elements from page.tsx - Removed 286 lines of grid background CSS (already deleted in previous commit) - All components now properly support light/dark theme switching Files changed: 11 - next.config.ts (added image domain) - theme.css (improved light mode colors) - page.tsx (removed decorative elements) - 8 component SCSS files (theme variable updates)
- Changed title color from hardcoded white to var(--text-primary) - Changed categoryName color to var(--text-primary) - Changed card background from rgba(255,255,255,0.03) to var(--bg-card) - Changed borders to use var(--border-color) with better visibility - Added box-shadow using theme variables - Cards now properly visible in both light and dark modes
…mages Backend Improvements: - Added 15 professional courses (JS, Python, React, Node, AI, UX/UI, DevOps, etc.) - Real course thumbnails from Unsplash (high quality images) - 6 professional teachers with realistic names - Multiple lessons per course with detailed descriptions - Course ratings with realistic distribution (1-5 stars) - Calculate average_rating and total_ratings automatically Frontend Configuration: - Added images.unsplash.com to Next.js remotePatterns - Now supports Unsplash thumbnails for course cards Seed Data Includes: - 15 courses with real descriptions - 6 teachers assigned to courses - 14+ lessons across multiple courses - 30+ user ratings (simulated users 1-11) - Realistic rating distribution showing popular courses Course Examples: - Curso Profesional de JavaScript ⭐ 4.6 (5 ratings) - Curso de Python desde Cero ⭐ 4.67 (3 ratings) - Curso de React.js Profesional ⭐ 4.67 (3 ratings) - Curso de Inteligencia Artificial ⭐ 4.67 (3 ratings) - And 11 more professional courses Next Steps: Run 'make seed-fresh' in Backend to populate database
- Added images.unsplash.com to remotePatterns - Enables loading high-quality course thumbnails from Unsplash - Required for new seed data with real course images
…ites system
BREAKING CHANGES - NEW FEATURES:
This commit adds a complete user management system with authentication,
course progress tracking, and favorites functionality.
🔐 Authentication & User Management:
- Created User model (email, password_hash, name, is_active, is_verified)
- JWT token-based authentication with bcrypt password hashing
- Auth endpoints: POST /auth/register, POST /auth/login, GET /auth/me
- Password strength validation (min 8 chars, uppercase, lowercase, digit)
- Secure password hashing with passlib[bcrypt]
- JWT middleware for protected endpoints
- Dependencies: get_current_user, get_current_active_user
📊 Progress Tracking System:
- Created UserCourseProgress model
- Track completed lessons and calculate percentage automatically
- Progress endpoints:
- POST /progress (create/update progress)
- GET /progress/course/{id} (get course progress)
- GET /progress (get all user progress)
- GET /progress/stats (overall statistics)
- POST /progress/lesson/{id} (mark lesson completed)
- Auto-calculation of completion percentage
- is_completed flag when reaching 100%
⭐ Favorites System:
- Created UserFavorite model with soft deletes
- Toggle favorite/unfavorite courses
- Sync favorites across devices
- Favorites endpoints:
- POST /favorites/toggle/{course_id}
- GET /favorites (get all favorites)
- GET /favorites/course-ids (sync with frontend)
- GET /favorites/check/{course_id}
📁 New Files Created:
Models:
- app/models/user.py
- app/models/user_favorite.py
- app/models/user_course_progress.py
Services:
- app/services/auth_service.py (registration, login, token creation)
- app/services/favorite_service.py (toggle, list, check)
- app/services/progress_service.py (update, stats, mark completed)
Routers:
- app/routers/auth.py (authentication endpoints)
- app/routers/favorites.py (favorites endpoints)
- app/routers/progress.py (progress endpoints)
Schemas:
- app/schemas/user.py (UserRegisterRequest, UserLoginRequest, TokenResponse)
- app/schemas/favorite.py (FavoriteCreateRequest, FavoriteToggleResponse)
- app/schemas/progress.py (ProgressCreateRequest, ProgressResponse, ProgressStatsResponse)
Core:
- app/core/security.py (password hashing, JWT creation/validation)
- app/core/dependencies.py (auth middleware)
🔧 Configuration Updates:
- Added JWT secret_key and config to app/core/config.py
- Updated pyproject.toml with new dependencies:
- passlib[bcrypt]>=1.7.0 (password hashing)
- python-jose[cryptography]>=3.3.0 (JWT tokens)
- Updated app/main.py to include new routers
- Updated API description with new features
📝 Database Models Summary:
- User: email (unique), password_hash, name, is_active, is_verified
- UserFavorite: user_id, course_id (unique together, soft deletes)
- UserCourseProgress: user_id, course_id, completed_lessons, total_lessons,
progress_percentage, is_completed
🚀 Next Steps (for user):
1. Run: cd Backend && make start
2. Run migrations for new tables: make create-migration
3. Apply migrations: make migrate
4. Populate data: make seed-fresh
5. Install new dependencies: uv sync
📖 API Documentation:
All new endpoints documented in FastAPI Swagger UI at:
http://localhost:8000/docs
Authentication Flow:
1. POST /auth/register → receive JWT token
2. Use token in Authorization header: Bearer <token>
3. Access protected endpoints (favorites, progress)
Files Changed: 17 files
- 3 new models
- 3 new services
- 3 new routers
- 3 new schema files
- 2 new core utilities
- 3 configuration updates
Remove claude/** from CI trigger branches to reduce test execution frequency and email notifications. Tests now only run on main and develop branches, plus pull requests.
Backend improvements: - Add test command to Makefile for running pytest inside Docker - Add pytest.ini configuration file - Add conftest.py for better test imports - Add pytest-cov to dev dependencies in pyproject.toml Frontend improvements: - Update Course component tests to match current implementation - Add proper mocks for Next.js Image and Context providers - Fix VideoPlayer test imports (add vitest imports) - Update test expectations to match actual component props These changes ensure all tests can run properly in CI/CD pipeline and locally, reducing false failures and email notifications.
README.md improvements: - Add professional structure with badges and emojis - Include complete table of contents - Add architecture diagram - Document all API endpoints (courses, ratings, auth, favorites, progress) - Add comprehensive testing section - Include deployment instructions - Add tech stack badges and visual elements - Document database schema and migrations - Add troubleshooting and contribution guidelines CLAUDE.md improvements: - Add complete API endpoints documentation - Include testing section (Backend + Frontend) - Add CI/CD documentation with GitHub Actions details - Include troubleshooting section - Add important notes about Docker, DB, and Frontend - Document all implemented features by category - Add DevOps section These changes make the project documentation much more professional and complete for GitHub presentation and team collaboration.
Update all documentation references to reflect new project name: - README.md: Update title and description - CLAUDE.md: Update title and final reference Database credentials remain unchanged (platziflix_user, etc.)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Add complete Claude Code setup with specialized agents, slash commands, automation hooks, and CI/CD workflows to optimize development workflow.
Changes:
Claude configuration:
Project configuration:
CI/CD workflows:
Benefits:
All configurations follow project conventions and are documented in .claude/README.md