MOAI-GIGA/frontend

Frontend for school connectivity visualization and optimal tower network planning in Mozambique # GIGA Project Connect — Mozambique > Frontend for school connectivity visualization and optimal tower network planning in Mozambique. > Client: **GIGA (UNICEF–ITU)** · Developer: **MOAI Analytics** · License: **MIT** --- ## Quick Start ```bash git clone cd giga-maps npm install npm run dev # → localhost ``` Default login: `admin` / `giga2026` --- ## Table of Contents - Tech Stack - Project Structure - Architecture - Data Layer - Development Workflow - Scripts Reference - Testing - Adding a New Layer - Build & Deployment - Docker - Code Conventions - License --- ## Overview MOAI | GIGA - Mozambique enables decision-makers to visualize and prioritize school connectivity investments by rendering multi-dimensional geospatial indices — climate risk, social vulnerability, infrastructure access — on an interactive WebGL map. The platform calculates optimal tower placement using configurable priority weights and K-values (50 / 200 / 400 total towers to install). --- ## Features | Category | Detail | |---|---| | **Interactive Map** | WebGL rendering via MapLibre GL with dark/light/streets base styles | | **Priority Index System** | Configurable weights across Climate, Social, and Access axes (levels Low / Medium / High) | | **Tower Network Optimization** | K=50, K=200, and K=400 total towers to install with Haversine distance calculations | | **Multi-filter Panel** | Filter schools by connectivity status, electricity availability, and education level | | **Index Selector** | Threshold slider (0–100) with color gradient visualization | | **Layer Management** | Toggle individual layers or groups with parent-child hierarchy | | **Rich Tooltips** | School detail cards with all index values and color-coded indicators | | **Responsive Design** | Optimized breakpoints for desktop (1920px), laptop (1366px), tablet (1024px), and mobile (768px–360px) | | **Authentication** | Simple login gate with localStorage persistence | --- ## Tech Stack | La …