Back to Projects
Business
Completed

EVChargePro — EV Charging Network Platform

A full-featured, frontend-only EV charging management platform with role-based dashboards for drivers, station operators, and administrators, plus station discovery, live charging sessions, and a built-in wallet.

Date

May 3, 2026

Duration

2-4 months

Client

Personal Project

Category

Business

Technologies Used

React
TypeScript
Vite
Context API
React Router
React Hook Form
Zod
Framer Motion
Tailwind CSS
Shadcn UI
Radix UI
Lucide Icons
Recharts
Sonner
LocalStorage
Vitest
EVChargePro — EV Charging Network Platform
Click to expand

Project Overview

EVChargePro is a modern, responsive electric-vehicle charging network web app built with React 18, Vite, and TypeScript that powers a public marketing site, a station discovery experience, and three role-specific dashboards — driver, operator, and admin — all without a backend. The landing page features a sticky glassmorphism navbar, Framer Motion hero with live network stats, an animated features grid, an EV charging showcase with scroll-linked parallax, an admin dashboard preview section, a 'trusted by' partners logo strip, an FAQ accordion, a newsletter signup, and a footer CTA. Public visitors can browse stations on an interactive StationMap with filters for connector type, power level, availability, and pricing, and drill into station detail pages showing chargers, amenities, reviews, and live status. Mock authentication via AuthContext + LocalStorage supports three seeded roles (driver, operator, admin) with role-aware redirects, a reusable ProtectedRoute guard, and a split-screen Login/Register flow with Google and phone-OTP options. The Driver dashboard ships with nearby stations, charging history, payments, a digital wallet with top-up and transactions, and a notifications center. Operators get a station portfolio, charger fleet management, live session monitoring, revenue analytics with charts, and operator settings. Admins receive a global command center with full CRUD modules for users, operators, stations, payments, commission rules, sessions, reports, and platform settings — every data table includes sortable headers, pagination, and CSV/PDF export. The UI is built on Shadcn + Radix with a fully tokenized HSL design system using a green/dark EV palette, a distinctive display heading font, and Framer Motion micro-interactions. Routing uses React Router, charts use Recharts, and feedback is delivered through Sonner toasts.

Key Features

Responsive Design
Modern UI/UX
Performance Optimized
Cross-browser Compatible
Mobile-first Approach
SEO Friendly
Accessibility Standards
Clean Code Architecture

Challenges & Solutions

Technical Implementation

Challenge:

Building a scalable and maintainable solution with modern technologies.

Solution:

Leveraged React and TypeScript to create a robust architecture.

User Experience

Challenge:

Creating an intuitive and engaging user interface.

Solution:

Implemented responsive design patterns and smooth interactions.

Performance Metrics

Performance Score
95/100
Code Quality
A+
Responsiveness
100%
Browser Support
All Modern

Project Gallery

EVChargePro — EV Charging Network Platform screenshot 1
View
EVChargePro — EV Charging Network Platform screenshot 2
View
EVChargePro — EV Charging Network Platform screenshot 3
+15
View

Related Projects

HappyPaws — Pet Care Hub
Business

HappyPaws — Pet Care Hub

EstateHub — Real Estate Marketplace Platform
Business

EstateHub — Real Estate Marketplace Platform

EduCloud — Enterprise Learning Management System
Business

EduCloud — Enterprise Learning Management System