How juan-josegs/proyecto-sintonia-next works
Sintonia is a music-discovery website: visitors explore featured albums and genres on the home page, then browse the catalog and open a genre’s artists, albums, and tracks. Shared language and consent state supports the public experience. Album and genre data, genre details, and translated text are fetched from an external API. The map reflects the README’s limited product description and the supplied source excerpts and index; unsampled interactions are omitted or shown as unverified.
Main entry points: page.tsx Home page · VistaCatalogo.tsx Catalog view · SeccionAlbumes.tsx Album section · SeccionGeneros.tsx Genre section
Components 19
Public pages
- Home page
src/app/page.tsx - Catalog route
src/app/catalogo/page.tsx
Music discovery
- Catalog view
src/components/VistaCatalogo/VistaCatalogo.tsx - Home hero
src/components/HeroSintonia/HeroSintonia.tsx - Album section
src/components/SeccionAlbumes/SeccionAlbumes.tsx - Genre section
src/components/SeccionGeneros/SeccionGeneros.tsx - Genre detail
src/components/DetalleGenero/DetalleGenero.tsx - Cover renderer
src/components/PortadaSVG/PortadaSVG.tsx - Call to action
src/components/BannerCTA/BannerCTA.tsx
Shared experience
- Language state
src/context/LanguageContext.tsx - Navigation
src/components/Navbar/Navbar.tsx - Brand mark
src/components/Marca/Marca.tsx - Accessibility panel
src/components/PanelAccesibilidad/PanelAccesibilidad.tsx - Cookie manager
src/components/Cookies/GestorCookies.tsx - Cookie banner
src/components/Cookies/BannerCookies.tsx - Footer
src/components/Footer/Footer.tsx
Content and data
- Text loader
src/hooks/useTextos.ts
Other components
- Visitor
- Sintonia API
Connections 26
- Visitor → Home page: opens
- Visitor → Catalog route: opens
- Home page → Language state: reads text
src/app/page.tsx - Home page → Home hero: renders
src/app/page.tsx - Home page → Album section: renders
src/app/page.tsx - Home page → Genre section: renders
src/app/page.tsx - Home page → Call to action: renders
src/app/page.tsx - Catalog route → Catalog view: renders
src/app/catalogo/page.tsx - Catalog view → Language state: reads text
src/components/VistaCatalogo/VistaCatalogo.tsx - Catalog view → Genre section: renders
src/components/VistaCatalogo/VistaCatalogo.tsx - Catalog view → Album section: renders
src/components/VistaCatalogo/VistaCatalogo.tsx - Catalog view → Genre detail: renders
src/components/VistaCatalogo/VistaCatalogo.tsx - Home hero → Sintonia API: fetches genres
- Album section → Sintonia API: fetches albums
src/components/SeccionAlbumes/SeccionAlbumes.tsx - Genre section → Sintonia API: fetches genres
src/components/SeccionGeneros/SeccionGeneros.tsx - Genre detail → Sintonia API: fetches details
src/components/DetalleGenero/DetalleGenero.tsx - Album section → Cover renderer: renders
src/components/SeccionAlbumes/SeccionAlbumes.tsx - Genre section → Cover renderer: renders
src/components/SeccionGeneros/SeccionGeneros.tsx - Genre detail → Cover renderer: renders
src/components/DetalleGenero/DetalleGenero.tsx - Language state → Text loader: loads text
src/context/LanguageContext.tsx - Text loader → Sintonia API: fetches translations
src/hooks/useTextos.ts - Navigation → Brand mark: renders
src/components/Navbar/Navbar.tsx - Navigation → Accessibility panel: opens
src/components/Navbar/Navbar.tsx - Cookie manager → Language state: reads consent
src/components/Cookies/GestorCookies.tsx - Cookie manager → Cookie banner: renders
src/components/Cookies/GestorCookies.tsx - Cookie banner → Text loader: loads labels
src/components/Cookies/BannerCookies.tsx