Skip to content

About

Web app for finding EV charging stations on an interactive map. Built with React, Spring Boot & PostgreSQL. Data sourced from Open Charge Map API. 🔌⚡

Resources

Stars

1 star

Watchers

0 watching

Forks

Latest commit

 

History

52 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Aplikacja webowa do wyszukiwania stacji ładowania samochodów elektrycznych. Umożliwia przeglądanie stacji na interaktywnej mapie, sprawdzanie ich parametrów i statusu oraz wybór najlepszego punktu ładowania w pobliżu wybranej lokalizacji.


Funkcje

  • 🗺️ Mapa interaktywna – stacje Ĺ‚adowania wyĹ›wietlane jako markery na mapie OpenStreetMap (Leaflet), z ikonami zaleĹĽnymi od statusu stacji
  • 🔍 Wyszukiwanie lokalizacji – wpisz adres lub miasto, mapa przesuwa siÄ™ do wybranego miejsca i pobiera pobliskie stacje w zadanym promieniu
  • 📍 Szczegóły stacji – po klikniÄ™ciu markera wyĹ›wietlajÄ… siÄ™: adres, operator, godziny otwarcia, typy i moc złączy, status gniazd oraz odlegĹ‚ość od wyszukiwanej lokalizacji
  • 🔄 Dane z OCM API – stacje pobierane sÄ… z Open Charge Map i zapisywane lokalnie, dziÄ™ki czemu aplikacja dziaĹ‚a teĹĽ przy chwilowej niedostÄ™pnoĹ›ci zewnÄ™trznego API
  • 👤 Konta uĹĽytkownikĂłw – rejestracja, logowanie, role (USER / OWNER / ADMIN)
  • đź’¬ Opinie o stacjach – zalogowani uĹĽytkownicy mogÄ… zgĹ‚aszać status stacji i dodawać komentarze

Stack technologiczny

Warstwa Technologia
Frontend React 19, Leaflet, Vite
Backend Spring Boot 4, Java 25
Baza danych PostgreSQL 18
Migracje Flyway
Konteneryzacja Docker, Docker Compose
Mapy OpenStreetMap + Leaflet
Geokodowanie Nominatim API
Dane o stacjach Open Charge Map API

Uruchomienie przez Docker

Najszybszy sposób na uruchomienie całej aplikacji.

Wymagania: Docker Desktop

git clone https://github.com/TWOJ_LOGIN/IO-Volt-Spot.git
cd IO-Volt-Spot
docker compose up --build

Aplikacja będzie dostępna pod adresem http://localhost:3000

Plik .env w głównym katalogu zawiera domyślną konfigurację bazy danych:

DB_USER=admin
DB_PASS=admin123
DB_NAME=volt_spot_db

Uruchomienie lokalne (bez Dockera)

Wymagania: Java 25, Node.js 20+, PostgreSQL

Backend

cd backend
./gradlew bootRun

Backend startuje na http://localhost:8080.

Frontend

cd frontend
npm install
npm run dev

Frontend startuje na http://localhost:5173. Requesty do /api/* sÄ… proxowane automatycznie do backendu przez konfiguracjÄ™ Vite.


Architektura

IO-Volt-Spot/
├── backend/                  # Spring Boot REST API
│   └── src/main/java/pl/voltspot/backend/
│       ├── controller/       # Endpointy REST
│       ├── service/          # Logika biznesowa
│       ├── repository/       # Warstwa dostępu do danych (JPA)
│       ├── entity/           # Encje bazy danych
│       ├── dto/              # Obiekty transferu danych
│       ├── mapper/           # Mapowanie encji ↔ DTO
│       ├── client/           # Klient OCM API
│       └── auth/             # Autentykacja i autoryzacja
├── frontend/                 # React SPA
│   └── src/
│       ├── components/       # MapView, SearchBar
│       └── App.jsx           # Główny komponent
└── docker-compose.yml

W środowisku Docker nginx w kontenerze frontendu działa jako reverse proxy – przeglądarka komunikuje się tylko z jednym hostem, co eliminuje problemy z CORS.


Ciekawostki techniczne

  • WzĂłr Haversine'a – odlegĹ‚ość od wybranej lokalizacji do stacji obliczana jest z uwzglÄ™dnieniem kulistoĹ›ci Ziemi, nie zwykłą odlegĹ‚oĹ›ciÄ… euklidesowÄ…
  • Bounding-box + upsert – filtrowanie stacji po promieniu wykonuje zapytanie SQL po prostokÄ…cie geograficznym, a dane z OCM sÄ… upsertowane do lokalnej bazy przy kaĹĽdym wyszukiwaniu
  • Snapshoty statusĂłw – kaĹĽde wyszukiwanie zapisuje aktualny status stacji, dziÄ™ki czemu marker na mapie zawsze odzwierciedla najĹ›wieĹĽszy znany stan

Domyślne konta testowe

Po pierwszym uruchomieniu Flyway załaduje dane testowe:

Email Hasło Rola
user@voltspot.pl admin123 USER
owner@voltspot.pl admin123 OWNER
admin@voltspot.pl admin123 ADMIN

API – wybrane endpointy

Metoda ĹšcieĹĽka Opis
GET /api/stations Lista wszystkich stacji
GET /api/stations?lat=&lon=&radiusKm= Stacje w promieniu od lokalizacji
GET /api/stations/{id} Szczegóły stacji
GET /api/geocoding/search?query= Geokodowanie adresu
POST /api/auth/register Rejestracja
POST /api/auth/login Logowanie
POST /api/stations/{id}/feedback Dodanie opinii (wymaga logowania)

About

Web app for finding EV charging stations on an interactive map. Built with React, Spring Boot & PostgreSQL. Data sourced from Open Charge Map API. 🔌⚡

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages