Safe Path 🌿 — Breathe Easy, Move Smart

Safe Path is a web application for pedestrians and cyclists that helps find the cleanest air route between two points. By analyzing real-time PM2.5 concentrations, it routes you through parks and residential areas, avoiding high-pollution highways and busy roads. You can check it here - https://ambushhere.github.io/green-path/

Key Features

• Dual API Integration: Combines data from WAQI (aqicn.org) and OpenAQ.org for the most comprehensive air quality coverage.
• Intelligent Routing: Uses a custom steering algorithm to nudge routes toward low-pollution zones.
• Route Comparison: Visual side-by-side comparison of standard vs. clean routes, including an "AQI Exposure Score" and calculated savings.
• Travel Modes: Specialized routing profiles for both walking and cycling.
• Premium UI: Modern dark theme with a glassmorphism design for a professional and sleek look.

How to Run

Prerequisites

• Node.js (v18 or higher)
• npm or yarn

Step 1: Clone the Repository

git clone https://github.com/ambushhere/green-path.git
cd green-path

Step 2: Install Dependencies

npm install

Step 3: Start Development Server

npm run dev

The application will be available at http://localhost:5173

Step 4: Build for Production

npm run build

This creates an optimized production build in the dist folder.

Step 5: Preview Production Build

npm run preview

This lets you test the production build locally before deployment.

Available Scripts

• npm run dev - Start development server with hot reload
• npm run build - Build for production
• npm run preview - Preview production build locally
• npm run lint - Check code quality with ESLint
• npm run test - Run unit tests with Vitest
• npm run proxy - Run local API proxy server on port 8787

Environment Variables

Copy .env.example to .env and set values as needed.

Frontend variables

• VITE_API_PROXY_BASE_URL - Optional proxy base URL (example: http://localhost:8787)
• VITE_ROUTING_API_BASE_URL - Optional direct routing API override
• VITE_GEOCODING_API_BASE_URL - Optional direct geocoding API override
• VITE_AIR_QUALITY_API_BASE_URL - Optional direct air quality API override
• VITE_WAQI_API_BASE_URL - Optional WAQI base override
• VITE_WAQI_TOKEN - Optional WAQI token for direct browser calls
• VITE_GEOCODING_LANGUAGE - Preferred geocoding language (default en)

Proxy variables

See proxy/README.md for proxy-side environment variables like WAQI_TOKEN.

Local Proxy Quick Start

npm run proxy

Then set:

VITE_API_PROXY_BASE_URL=http://localhost:8787

Detailed proxy docs: proxy/README.md

Tech Stack

• Framework: React 19 + TypeScript + Vite
• Styling: Tailwind CSS
• UI Components: Radix UI
• Maps: Leaflet.js + React-Leaflet + OpenStreetMap
• Routing: OSRM (Open Source Routing Machine)
• Geocoding: Nominatim (OpenStreetMap)
• Air Quality APIs: WAQI API & OpenAQ API
• Forms: React Hook Form
• HTTP Client: Axios

---

Created with care for people with allergies, asthma, and parents with strollers.