A responsive event browsing application built with Laravel, React (Inertia), and Tailwind CSS. It provides an interactive map and a searchable, filterable event list for exploring air race events across multiple locations.
This project was created as a demo assignment focused on frontend structure, UI interaction, and maintainable implementation.
Users can:
- explore events on a map
- browse events in a structured list
- search by title, address, or country
- filter events by category
- select an event from the list and focus it on the map
- 📍 Interactive map with custom markers
- 🎯 Select events from list or map
- 🔍 Search by location, title, or country
- 🧩 Filter by category (A / B)
- 🎨 Dynamic color system for events
- 🧱 Reusable layout with header and footer
- ⚙️ Clean architecture using service layer and API
- Events loaded from a local JSON file
- Events served through a Laravel API
- JSON file is now read by backend service
-
API endpoint:
GET /api/events -
Structure:
- EventServiceInterface
- EventService
- ApiResponse helper
- Service binding via AppServiceProvider
-
Components:
- MapView
- EventList
- EventCard
- FilterBar
- MainLayout
-
Data fetching:
fetch('/api/events')
app/
Services/
Contracts/
Support/
resources/js/
components/
pages/
lib/
data/
These screenshots demonstrate the main features of the application, including map interaction, event selection, and filtering.
Nafiseh Zeinali