George Retail
Interview task recreating a George-style landing page using a data-driven modules-and-blocks architecture in React.
The Challenge
Rebuild a marketing landing page using a flexible modules-and-blocks system that can be driven entirely from structured JSON content.
The Solution
Structured the page as content-driven modules (navbar, hero, promo grid, offers, product grid) and reusable blocks, reading JSON from the DOM and mapping module types to React components for highly configurable layouts.
Key Features
- •Modules architecture (Navbar, Hero, PromoGrid, OfferBanner, ProductGrid)
- •Reusable UI blocks (NavItem, PromoCard, ProductCard)
- •JSON-driven content loaded from a script tag
- •Map-based module routing for flexible layouts
- •Easy content editing by updating JSON only
- •Hot-reload local development with Vite
Technologies
ReactTypeScriptViteSCSS ModulesJavaScriptHTMLCSS
