Skip to content
BranchesTags

Latest commit

 

History

37 Commits

Folders and files

NameName
Last commit message
Last commit date
frontend
frontend
 
 
src/main
src/main
 
 
.dockerignore
.dockerignore
 
 
.gitignore
.gitignore
 
 
Dockerfile
Dockerfile
 
 
LICENSE
LICENSE
 
 
README.md
README.md
 
 
netlify.toml
netlify.toml
 
 
pom.xml
pom.xml
 
 
render.yaml
render.yaml
 
 

Repository files navigation

TraffixAI

Real-Time Traffic Analytics & Intelligent Route Optimization Platform

A production-grade full-stack platform for live congestion monitoring, incident intelligence, AI-powered route planning, and per-user session management. Built to demonstrate engineering depth across the full stack — from real-time data pipelines and WebSocket broadcast to secure multi-user auth and persistent cloud storage.

Live Demo Backend License

Tech Stack

Frontend

React Vite TailwindCSS React Router Recharts Axios Lucide Google OAuth

Backend

Java Spring Boot Spring Security Spring WebSocket Maven Lombok

Database & Auth

MongoDB JWT Google

APIs & Services

TomTom Gemini OpenStreetMap

Features

  • Real-time traffic dashboard — live charts, congestion zones, peak hour analysis, priority alerts
  • AI-powered route analysis with delay estimates and Gemini AI synopsis
  • TomTom incident feed with severity classification and live map overlay
  • Google Sign-In with per-user data isolation in MongoDB
  • Default city preference saved per account, loaded on every session
  • Recent city search history per user, surfaced as autocomplete suggestions
  • AOP-based per-IP rate limiting — 60 req/min global, 20 req/min on auth
  • MongoDB TTL index — traffic data auto-expires after 24 hours
  • WebSocket real-time push via STOMP over SockJS
  • Skeleton loading screens for every page
  • Fully responsive UI — mobile, tablet, and desktop

Folder Structure

TraffixAI/
|
|- frontend/
|   |- public/
|   |   |- logo1.png
|   |   `- favicon.svg
|   |- src/
|   |   |- App.jsx
|   |   |- main.jsx
|   |   |- index.css
|   |   |- api.js
|   |   |
|   |   |- components/
|   |   |   |- common/
|   |   |   |   |- Loader.jsx
|   |   |   |   `- Skeleton.jsx
|   |   |   |- layout/
|   |   |   |   |- Header.jsx
|   |   |   |   |- Sidebar.jsx
|   |   |   |   `- UserMenu.jsx
|   |   |   |- map/
|   |   |   |   |- TomTomMap.jsx
|   |   |   |   `- RouteMap.jsx
|   |   |   |- modals/
|   |   |   |   |- LoginModal.jsx
|   |   |   |   `- DefaultLocationModal.jsx
|   |   |   `- route/
|   |   |       |- RouteSearch.jsx
|   |   |       `- RouteDetails.jsx
|   |   |
|   |   |- context/
|   |   |   |- AuthContext.jsx
|   |   |   `- CityContext.jsx
|   |   |
|   |   `- pages/
|   |       |- Dashboard/
|   |       |   |- index.jsx
|   |       |   `- DashboardSkeleton.jsx
|   |       |- IncidentCenter/
|   |       |   |- index.jsx
|   |       |   `- IncidentCenterSkeleton.jsx
|   |       |- RouteAnalyzer/
|   |       |   |- index.jsx
|   |       |   `- RouteAnalyzerSkeleton.jsx
|   |       |- Settings/
|   |       |   |- index.jsx
|   |       |   `- SettingsSkeleton.jsx
|   |       `- Help/
|   |           `- index.jsx
|   |
|   |- index.html
|   |- package.json
|   |- vite.config.js
|   `- .env                       (git-ignored, see .env.example)
|
|- src/
|   `- main/
|       |- java/com/traffic/analytics/
|       |   |- TrafficAnalyticsApplication.java
|       |   |
|       |   |- config/
|       |   |   |- CorsConfig.java
|       |   |   |- RestTemplateConfig.java
|       |   |   |- SecurityConfig.java
|       |   |   `- WebSocketConfig.java
|       |   |
|       |   |- controller/
|       |   |   |- AuthController.java
|       |   |   |- LiveTrafficController.java
|       |   |   |- RouteController.java
|       |   |   |- TrafficDataController.java
|       |   |   `- UserController.java
|       |   |
|       |   |- dto/
|       |   |   |- RoadTrafficSummaryDto.java
|       |   |   |- RouteAnalysisDto.java
|       |   |   |- RouteRequestDto.java
|       |   |   |- RouteResponseDto.java
|       |   |   |- TrafficAlertDto.java
|       |   |   `- TrafficDataDto.java
|       |   |
|       |   |- mapper/
|       |   |   `- TrafficMapper.java
|       |   |
|       |   |- model/
|       |   |   |- TrafficData.java
|       |   |   `- User.java
|       |   |
|       |   |- ratelimit/
|       |   |   |- RateLimit.java
|       |   |   `- RateLimitAspect.java
|       |   |
|       |   |- repository/
|       |   |   |- TrafficDataRepository.java
|       |   |   `- UserRepository.java
|       |   |
|       |   |- security/
|       |   |   |- GoogleTokenVerifier.java
|       |   |   |- JwtAuthFilter.java
|       |   |   `- JwtUtil.java
|       |   |
|       |   `- service/
|       |       |- GeminiAiService.java
|       |       |- RealTimeTrafficMonitorService.java
|       |       |- RouteService.java
|       |       |- TrafficAlertService.java
|       |       |- TrafficAnalysisService.java
|       |       |- TrafficClassificationService.java
|       |       |- TrafficDataService.java
|       |       |- TrafficSortingService.java
|       |       `- UserService.java
|       |
|       `- resources/
|           |- application.properties
|           `- application-local.properties   (git-ignored)
|
|- pom.xml
|- Dockerfile
|- render.yaml
|- LICENSE
`- .gitignore

Architecture

Browser
  |
  |-- React (Netlify)
  |     |-- Google OAuth popup  -->  Google
  |     |-- REST calls          -->  Spring Boot (Render)
  |     `-- WebSocket (STOMP)   -->  Spring Boot (Render)
  |
Spring Boot (Render)
  |-- Spring Security + JWT filter
  |-- AOP Rate Limiter (per IP, sliding window)
  |-- MongoDB Atlas
  |     |-- users         (accounts, default city, search history)
  |     `-- traffic_data  (TTL 24h, per-user tagged)
  |-- TomTom API          (traffic flow + incidents)
  |-- Gemini AI           (route synopsis)
  `-- OpenStreetMap       (road discovery via Overpass API)

Environment Variables

Render (Backend)

Variable Description
MONGODB_URI MongoDB Atlas connection string
GOOGLE_CLIENT_ID Google OAuth2 client ID
JWT_SECRET Long random string for signing JWTs
TOMTOM_API_KEY TomTom developer API key
GEMINI_API_KEY Google Gemini API key
ALLOWED_ORIGINS Comma-separated allowed frontend origins
PORT Server port (Render injects this automatically)

Netlify (Frontend)

Variable Description
VITE_TOMTOM_API_KEY TomTom API key
VITE_API_BASE_URL Backend base URL
VITE_WS_BASE_URL Backend WebSocket base URL

Local Development

Create src/main/resources/application-local.properties (git-ignored):

tomtom.api.key=YOUR_TOMTOM_KEY
spring.data.mongodb.uri=mongodb+srv://user:pass@cluster.mongodb.net/traffixai?appName=TraffixAi
spring.data.mongodb.auto-index-creation=true
google.client.id=YOUR_GOOGLE_CLIENT_ID
jwt.secret=any-local-secret-string
rate.limit.requests-per-minute=60

Create frontend/.env (git-ignored):

VITE_TOMTOM_API_KEY=YOUR_TOMTOM_KEY

Running Locally

Backend

.\apache-maven-3.9.6\bin\mvn.cmd spring-boot:run

Runs at http://localhost:8080. The Vite dev proxy forwards /api and /ws-traffic automatically.

Frontend

cd frontend
npm install
npm run dev

Opens at http://localhost:5173.

Kill port 8080 if occupied

Get-NetTCPConnection -LocalPort 8080 -State Listen -ErrorAction SilentlyContinue |
  Select-Object -ExpandProperty OwningProcess |
  ForEach-Object { Stop-Process -Id $_ -Force }

Google Cloud Console Setup

Go to APIs & Services > Credentials > OAuth 2.0 Client ID and configure:

Authorized JavaScript origins

http://localhost:5173
http://localhost:5174
https://traffix-aiv1.netlify.app

Authorized redirect URIs

http://localhost:5173
http://localhost:5174
https://traffix-aiv1.netlify.app

Production Build

Frontend

cd frontend
npm run build

Backend

.\apache-maven-3.9.6\bin\mvn.cmd clean package

API Reference

Auth

Method Endpoint Auth Description
POST /api/auth/google Public Verify Google token, return JWT

User

Method Endpoint Auth Description
GET /api/user/profile JWT Get user profile
PUT /api/user/default-location JWT Save or update default city
GET /api/user/searches JWT Get recent city searches
POST /api/user/searches JWT Save a city search

Traffic

Method Endpoint Auth Description
GET /api/traffic/all Optional All traffic data (user-scoped)
GET /api/traffic/top-roads Optional Top 5 busiest roads
GET /api/traffic/least-roads Optional Top 5 free-flow roads
GET /api/traffic/peak-hours Optional Peak congestion hour
GET /api/traffic/alerts Optional High-load alerts
POST /api/traffic/add Optional Add a traffic data point

Live Monitor

Method Endpoint Auth Description
POST /api/live/start Optional Start TomTom data polling
POST /api/live/stop Optional Stop polling
POST /api/live/location Optional Change monitored city

Route

Method Endpoint Auth Description
POST /api/route/analyze Optional AI route analysis

Contributing

TraffixAI is open for contributions. Whether you want to fix a bug, improve the UI, add a feature, or improve the engineering quality — all pull requests are welcome.

How to Contribute

  1. Fork the repository
  2. Create a feature branch: git checkout -b feature/your-feature-name
  3. Commit your changes with clear messages
  4. Push to your fork and open a pull request against main
  5. Describe what you changed and why in the PR description

Ideas for Contribution

  • Traffic heatmap overlay using TomTom flow tiles
  • Predictive congestion alerts using trend detection
  • Historical traffic comparison (today vs. yesterday)
  • Export traffic report as CSV or PDF
  • Shareable city dashboard via URL (/dashboard/bangalore)
  • Push notifications for critical alerts
  • Unit and integration test coverage
  • Docker Compose setup for local full-stack development
  • Performance improvements (code splitting, lazy loading)

Code Style

  • Backend: follow standard Spring Boot layered architecture — controllers call services, services call repositories. No business logic in controllers.
  • Frontend: component per file, co-locate skeleton with its page, use context only for global shared state.
  • Commits: use plain English imperative style — "Add skeleton for Dashboard", not "added skeletons"

License

This project is licensed under the GNU General Public License v3.0 (GPL-3.0).See LICENSE for the full text.

You are welcome to use, study, modify, and contribute to this project under the terms of the GPL-3.0 license. Any distributed modified versions must also remain licensed under GPL-3.0 and retain the original copyright notices.

Author

Naren SJ

Built as a showcase of full-stack engineering across real-time systems, cloud deployment, multi-user auth, and production-quality UI patterns. Contributions and feedback are genuinely welcome.

About

Real-Time Traffic Analytics & Intelligent Route Optimization Platform

traffix-aiv1.netlify.app

Topics

javamavenmongodbreactspringboottomtom-api

Resources

Readme
GPL-3.0 license
Activity

Stars

2 stars

Watchers

0 watching

Forks

0 forks
Report repository

Used by

Contributors

Languages