01 · Проект
Интерактивное веб-приложение, которое собирает точки из личного travel-блога и превращает их в единую карту с маркерами, карточками и фильтрацией по годам.
Идея проекта появилась из личного travel-блога на Joomla. Заметки уже хранились в базе CMS, но хотелось получить отдельный интерфейс, где все поездки можно увидеть на карте и при необходимости отфильтровать.
Основная задача — не дублировать данные в новой системе, а использовать существующую базу Joomla как источник данных, а Laravel API сделать связующим слоем между базой и Vue-интерфейсом.
Проект разделён на несколько уровней. Joomla продолжает отвечать за хранение материалов, Laravel предоставляет API, а Vue.js отвечает за интерфейс карты. Для визуализации используется MapLibre GL.
Laravel обращается к таблице контента Joomla через отдельное подключение к базе. На API-уровне данные преобразуются в удобный для карты формат.
DB::connection('database_joomla')
->table('name_table_joomla')
->get();
Отдельный endpoint позволяет получать точки с фильтром по году, поэтому Vue не нужно загружать и обрабатывать весь набор данных при каждом переключении фильтра.
На клиентской стороне MapLibre используется для отображения карты. Для каждой записи создаётся маркер, а popup показывает дополнительную информацию о путешествии.
Отдельно прорабатывалась стилизация маркеров и popup, чтобы интерфейс карты визуально выглядел симпатично и современно.
Фильтр по годам отправляет запрос в Laravel API. Если год не выбран, загружается полный набор точек. При выборе года API возвращает только соответствующие записи.
/api/filter-data?year=2025
Такой подход позволяет оставить бизнес-логику фильтрации на сервере и не перегружать браузер лишними данными.
В результате получился отдельный картографический интерфейс, который использует реальные данные travel-блога и может развиваться независимо от Joomla. Архитектура также оставляет возможность добавлять новые фильтры, типы точек и дополнительные API-методы.