How jacobo-g-m/cromoverso works
Cromoverso is a React web app for discovering six fantasy worlds and browsing a collectible-card catalog. The main flow runs from the home page or navigation into a selected world, where catalog data is fetched and cards are filtered, sorted, and shown; README documents URL-synchronized filters and responsive layouts. Shared localization and cookie preferences support the experience. The login and signup views exist, but the sampled evidence does not show authentication behavior. Some capabilities are documented but their implementation was not sampled, so only evidenced links are drawn.
Main entry points: App.jsx App routing · Navbar.jsx Navigation bar · Worlds.jsx World catalog · CookiePreferences.jsx Cookie preferences
Components 22
App and navigation
- App routing
src/App.jsx - Home page
src/views/Home.jsx - Login view
src/views/Login.jsx - Signup view
src/views/Signup.jsx - Navigation bar
src/components/layout/Navbar.jsx - Mobile menu
src/components/layout/MobileMenu.jsx - Footer
src/components/layout/Footer.jsx
Worlds and cards
- World catalog
src/views/Worlds.jsx - World data hook
src/hooks/useMundos.js - Cards grid
src/components/ui/CardsGrid/CardsGrid.jsx - Collectible card
src/components/ui/Card/Card.jsx
Localization and consent
- Text hook
src/hooks/useTexts.js - Cookie banner
src/components/layout/Cookies.jsx - Cookie preferences
src/components/layout/CookiePreferences.jsx - Cookie utilities
src/utils/cookies.js
Reusable interface
- Button
src/components/ui/Button/Button.jsx - Dropdown
src/components/ui/Dropdown/Dropdown.jsx - Pill switch
src/components/ui/PillSwitch/PillSwitch.jsx - Toggle switch
src/components/ui/Switch/Switch.jsx
Other components
- Visitor
- Browser cookies
- Cromoverso REST API
Connections 27
- Visitor → App routing: uses
- App routing → Navigation bar: renders
src/App.jsx - App routing → Home page: routes to
src/App.jsx - App routing → World catalog: routes to
src/App.jsx - App routing → Login view: routes to
src/App.jsx - App routing → Signup view: routes to
src/App.jsx - App routing → Footer: renders
src/App.jsx - App routing → Cookie banner: renders
src/App.jsx - App routing → Cookie preferences: renders
src/App.jsx - App routing → Text hook: loads texts
src/App.jsx - App routing → Cookie utilities: sets consent
src/App.jsx - Navigation bar → Mobile menu: renders
src/components/layout/Navbar.jsx - Navigation bar → Dropdown: uses
src/components/layout/Navbar.jsx - Navigation bar → Pill switch: uses
src/components/layout/Navbar.jsx - Home page → World data hook: loads worlds
src/views/Home.jsx - Home page → Button: uses
src/views/Home.jsx - World catalog → World data hook: loads catalog
src/views/Worlds.jsx - World catalog → Cards grid: renders cards
src/views/Worlds.jsx - World catalog → Dropdown: uses filters
src/views/Worlds.jsx - Cards grid → Collectible card: renders
src/components/ui/CardsGrid/CardsGrid.jsx - World data hook → Cromoverso REST API: fetches worlds
src/hooks/useMundos.js - Text hook → Cromoverso REST API: fetches translations
src/hooks/useTexts.js - Cookie preferences → Cookie utilities: reads and writes
src/components/layout/CookiePreferences.jsx - Cookie preferences → Toggle switch: uses
src/components/layout/CookiePreferences.jsx - Cookie preferences → Button: uses
src/components/layout/CookiePreferences.jsx - Cookie banner → Button: uses
src/components/layout/Cookies.jsx - Cookie utilities → Browser cookies: reads and writes
src/utils/cookies.js