NEOM The Line Portal
An interactive mapping and exploration platform built with Next.js and React for visualizing developments, assets, and personas along NEOM's The Line megaproject, powered by Sanity CMS and Mapbox GL
An interactive mapping platform for visualizing developments, assets, and personas along NEOM's "The Line" megaproject. Built with Next.js, Sanity CMS, and Mapbox GL for interactive geospatial visualization.
View Live Application (Note: May not remain online indefinitely)
Status: Project cancelled before release due to issues with The Line development
NEOM's The Line is a planned 170-kilometer linear city in Saudi Arabia. This platform enabled users to navigate through regions, sub-regions, and individual assets along The Line, visualizing everything from restaurants and retail spaces to golf courses and saunas.
Interactive Mapping
Built with Mapbox GL JS and React Map GL for high-performance geospatial visualization. Features color-coded asset markers, intelligent clustering, interactive popups, and custom The Line polygon overlay. Users can filter by region, category, persona, and development stage with real-time search.
Content Management
Sanity CMS integration with structured content types for regions, sub-regions, assets, personas, and categories. Each asset includes comprehensive data: coordinates, categorization, development stage, image galleries, and modular information windows for technical specs, research, facilities, and guest journeys.
Technical Implementation
Next.js 14 with TypeScript, Zustand for filter state, and client-side filtering for performance. Complex nested routing structure (/regions/[region-name]/[sub-region-name]/[asset-name]) with breadcrumb navigation. Full TypeScript type generation from Sanity schemas.
The project was cancelled before release due to broader issues with The Line development, despite being fully functional and technically complete.
