frontend-2.md

Отображение объектов на карте 🗺️

Тестовое задание на позицию angular разработчика.

Задача

Реализовать приложение, в котором отображается карта с нанесенными на нее маркерами объектов из представленного ниже списка. По нажатию на объект из списка он становится выбранным (появляется какой-то отличительный признак, например, подсветка его строки), вместе с этим карта изменяет масштаб до 10 уровня и центрируется на этом маркере.

Данные объектов доступны прямо в репозитории по ссылке.

Модель объекта следующая:

interface Object {
  id: number
  // Широта
  latitude: number
  // Долгота
  longitude: number
  // Имя
  name: string
}

Требования

• TypeScript

• Angular

• Библиотека Leaflet

• Покрытие юнит-тестами базовой функциональности

Дополнительно (будет преимуществом)

• Реализация строки поиска (фильтрация списка с помощью поисковой фразы)

• Адаптивная и мобильная верстка

• Использование менеджера состояния (NgRX, NGXS, другое)

• Реализация интеграционных и E2E тестов

Дизайн

Схематичный дизайн представлен ниже, делать точь-в-точь не обязательно! Важнее архитектура проекта и организация кода, чем внешний вид.

Ссылка на Figma

Решение

Решение должно быть представлено публичным репозиторием или zip-архивом. В проекте необходимо добавить readme с инструкцией по запуску приложения. Результат решения (ссылку на репозиторий или zip-архив) следует отправить на почту по адресу: muratov.i@firstmk.ru.

Удачи! <3