Székesfehérvár 360°

Székesfehérvár város interaktív virtuális túra webalkalmazása. 34 helyszín, 109 panoráma, sötét/világos téma, többnyelvű felület.

Státusz: fejlesztés alatt (MVP)

Képernyőképek

(hamarosan)

Tech stack

Réteg	Technológia
Frontend	React 19, TypeScript, Vite 7, Tailwind CSS 4
Panoráma	Photo Sphere Viewer v5 (cubemap adapter)
Térkép	React Leaflet + CARTO tiles
Backend	Laravel 12 (PHP 8.4+)
Adatbázis	MySQL 8.0
Hosting	cPanel shared hosting

Funkciók

• 360° panoráma nézet cubemap formátumban
• Interaktív térkép CARTO Dark/Light tile-okkal
• Városhatár GeoJSON overlay
• Kategória szűrés (Templomok, Múzeum, Terek, Épületek, Szabadidő)
• Sötét/világos téma váltás (localStorage perzisztencia)
• Utcanév réteg (be/kikapcsolható)
• Többnyelvű felület (HU, EN, DE, PL, IT)
• Reszponzív mobil layout
• Admin felület (React Admin 5.x) — tervben

Fejlesztés indítása

Előfeltételek

• Node.js 22+
• PHP 8.4+ és Composer
• MySQL 8.0
• vagy Docker + Docker Compose

Docker-rel (ajánlott)

cp .env.example .env
docker compose -f docker-compose.dev.yml up

Szolgáltatás	URL
Frontend (Vite HMR)	http://localhost:5173
Backend (Laravel API)	http://localhost:8080
phpMyAdmin	http://localhost:8081

Docker nélkül

# Frontend
cd frontend
npm install
npm run dev

# Backend
cd backend
composer install
cp .env.example .env
php artisan key:generate
php artisan migrate
php artisan serve --port=8080

Projekt struktúra

├── frontend/           React 19 + Vite alkalmazás
│   ├── public/assets/  Panoráma képek, GeoJSON, logók
│   └── src/
│       ├── components/ UI komponensek (map, panorama, ui, layout)
│       ├── lib/        Üzleti logika (i18n, locations, panorama-map)
│       ├── pages/      MapPage, PanoramaPage, NotFoundPage
│       ├── admin/      React Admin 5.x (tervben)
│       └── styles/     Design system (index.css)
├── backend/            Laravel 12 API
│   ├── app/Http/       Controllerek, middleware
│   ├── database/       Migrációk (checkpoints, panorama_nodes, stb.)
│   └── routes/api.php  API végpontok
├── docker/             Dockerfile-ok
├── docs/               Technikai dokumentáció
└── scripts/            Segéd scriptek (panoráma letöltő)

Környezeti változók

Lásd: .env.example

Dokumentáció

• docs/tech-stack.md — Stack döntés és architektúra
• docs/frontend-react.md — Frontend döntés indoklása
• docs/photo-sphere-viewer.md — PSV integráció
• docs/terkep-opcio-elemzes.md — Térkép opciók elemzése
• docs/hosting-vps-vs-cpanel.md — Hosting döntés

Licensz

MIT — lásd LICENSE