Mapboxes

A modern Next.js boilerplate for building powerful interactive maps, powered by Mapbox, with clustering, custom markers, theming support, and scalable user interfaces: entirely built with Next.js, React Map GL, Tailwind CSS, and Supercluster.

✨ Features

• 🧭 Mapbox GL JS integration using react-map-gl
• 📍 Marker clustering with supercluster
• 🌗 Theme-aware styling (dark/light mode via next-themes)
• ⚛️ React + Next.js App Router support
• 🎯 Clickable, animated markers with custom popups
• 💨 Tailwind CSS for styling
• ⚒️ Easy customization and component structure
• 🧪 Typescript-first development

🚀 Installation

1. Clone the repository:

   git clone https://github.com/ayukumar34/mapboxes.git
   cd mapboxes
   

2. Install dependencies:

   pnpm install
   

3. Add your Mapbox token to an .env file

   echo "NEXT_PUBLIC_MAPBOX_TOKEN=your_token_here" > .env
   

4. Run the development server

   pnpm run dev