Тестовое задание "Dynamic-Filter"

Задачи:

1. Сверстать по макету фильтр и список квартир.
   • Цвета и шрифты использовать те, что прописаны в файле tailwind.config.ts и globals.scss
   • Для кастомных стилей(если понадобится) создать и использовать custom.scss
   • Необходимо, чтобы верстка была адаптивной
   • При необходимости создавать отдельные компоненты только для мобильной версии
2. Написать логику работы фильтра, а так же получения и отрисовки квартир.
   • При переключении фильтра, остальные фильтра должны подстраиваться под заданное значение. Например выбирается проект "Тестовый", у этого проекта доступны только квартиры с комнатностью 2, соотвественно для дальнейшеного выбора доступно только выбор комнатностьи со значением "2".
   • Вся фильтрация для фильтра и квартир происходит на беке.
   • Фильтр не должен "схлапываться", то есть не должно быть такого, что в выдаче нет квартир и фильтр показывает не корректные значения. Например стоимость от 0 до 0.
   • Все выбранные значения фильтра должны записываться в query параметры. И при копировании url с query параметрами и вставки в новом окне браузера значения фильтров должны поставляться и должна просходить фильтрация квартир

Можно использовать любые инструменты

---

Технические требования:

1. Docker и docker-compose
2. Node.js >19.7.0

---

Необходимые материалы

1. Макет в фигме
2. Документация по api Будет доступна после установки проекта

---

Инструкция по установке проекта:

Из корня проекта вызываем команду:

make init

---

Инструкция по запуску проекта

1. Из корня проекта вызываем команду:

make up

Адрес бекенда http://localhost:8083/

Документация апи http://localhost:8083/api/documentation

2. Из папки frontend вызываем команды:

npm i && npm run dev

Проект откроется по адресу http://localhost:3000/

3. Для того чтобы остановить контейнеры Docker из папки проекта вызываем команду:

make stop

---

Ожидаемый результат:

1. из папки frontend выполняется команда:

npm run lint

Все проверки линтера проходят успешно

2. из папки frontend выполняются команды:

npm run build && npm run start

Билд успешно собирается и проект открывается по адресу http://localhost:3000/

3. Верстка сделана согласно макету, так же сделан адаптив этой страницы
4. При переключении фильтра квартиры фильтруются и фильтр подстраивается под уже отмеченные значения
5. При переключении фильтр в адресной строке добавляются query парметры
6. При копировании ссылки с query параметрами и вставки их в новом окне браузера происходит постановка значений в фильтр и фильтрация квартир

---

Готовый результат выложить в гитхаб и отправить ссылку на репозиторий

---

Маленькие изменения:

• Добавил возможность добавления в "избранное" квартир (использовал nanostore и компоненты shared/ui/card & shared/ui/like).