Skip to content
Back to projects

at BonoboStudio

Dolcevita

Dolcevita

A location-based bike tour platform for discovering and navigating guided cycling routes across Sardinia, featuring Leaflet maps with GPX route visualization, proximity push notifications, and a Workbox-powered offline-first PWA — built with React 19, Fastify 5, and PostgreSQL in an Nx monorepo.

Role

Frontend Developer

Company

BonoboStudio

Tech Stack

React 19 TypeScript Leaflet Fastify 5 PostgreSQL PWA Workbox Nx Docker DigitalOcean

Overview

Dolcevita is a location-based bike tour platform built at Bonobo for discovering and navigating guided cycling routes across Sardinia. Users select a tour, explore points of interest on an interactive map, and receive proximity notifications as they ride. Designed as a PWA with offline-first architecture and installable on any device.

Key Features

  • Interactive Maps — Leaflet-powered maps with OpenStreetMap tiles, custom POI markers, GPX route visualization, and user location tracking
  • Guided Tours — Browse and select tours by type (leisure, road, MTB, hiking) with day-by-day breakdowns, elevation data, and color-coded routes
  • Real-time Geolocation — Continuous position tracking with accuracy circles, auto-centering, and configurable update intervals
  • Proximity Notifications — Push notifications triggered when approaching a POI, with Haversine distance calculation and duplicate prevention
  • PWA & Offline Support — Workbox-powered service worker precaching static assets, installable standalone app with persistent map state
  • POI Discovery — Filterable and searchable points of interest with detail dialogs, photos, contact info, and website links

Technical Highlights

  • Nx monorepo with feature libraries (frontend-map, frontend-homepage, frontend-landing) and shared UI/type packages
  • Leaflet integration with GPX support (inline XML or URL with CORS proxy fallback), custom icon caching, and sessionStorage-persisted map state
  • Custom service worker (sw-custom.js) handling notification clicks, POI navigation, and aggressive skip-waiting updates
  • Fastify 5 backend with PostgreSQL via Slonik, node-pg-migrate for schema versioning, and connection pooling
  • Access-code-gated entry with localStorage persistence
  • Reactive user preferences (notification sound, update interval, radius threshold) via subscriber pattern
  • Dockerized deployment with multi-stage builds (Vite builder + Nginx runtime) and GitHub Actions CI/CD to DigitalOcean