Добавить меню по дизайн макету на сайт

5 000 руб. за проект
30 ноября 2024, 15:09 • 7 откликов • 160 просмотров
Ссылка на макет: https://www.figma.com/design/y0s0iwMazod6iP7wqzx12...

Наш сайт: https://h2h.ee/


Дизайн

- Чистый и современны дизайн прим. Youla.ru с единой цветовой схемой с текущим сайтом.

- Иконка меню вверху слева
- Всплывающее окно
- Категории с раскрывающимися подкатегориями
- Ссылки на разделы (Профиль Избранное Сообщения)
- Заметная кнопка “Разместить обьявление”
- Изображение профиля и имя пользователя, если авторизован
- Кнопка “Войти” если неавторизован.
- Выделение раздела в меню, где находится пользователь сейчас.


Разработка

- Динамическая загрузка категорий и подкатегорий из базы данных с помощью моделей Lavarel.
- Подержка многоуровневых категорий с рекурсивным рендерингом.
- Плавная анимация открытия и закрытия с помощью CSS / JavaScript
- Отсутствие задержек в работе, особенно на мобильных.


Тех. требования

Backend

- Использования мршрутов и контроллеров Lavarel для получения данных в меню.
- Предоставте конечную точку API для динамической загрузки категорий при использовании подхода на основе AJAX.

Frontend

- Используйте Vue.js или аналогичный фреймворк (если он уже является частью проекта) для динамической интерактивности.
- Если Vue.js не используется, реализуйте фукциональностью с помощью стандартного JavaScript или jQuery.

CSS

- Созавайте модульные и повторно используемые стили, используя CSS/SCSS.
- Следуйте методологии BEM для имен классов (если применимио).


Обработка ошибок

- Отображение удобного для пользователя сообщения или резервного меню в случая ошибок получения данных.
- Убедитесь, что функциональность доступна даже в случае сбоя JavaScript.


Тестирование

- Выполните коссбраузерное тестирование (Chrome, Firefox, Safari, Edge)
- Проверить адаптивность (Десктоп Планшет Мобильные)
- Проверка плавной работы на слабых и старых устройствах.


Результаты

- Полнофукциональное меню, интегрированное в сайт Lavarel.
- Модульный код (Фронт и Бекенд) с комментами и документацией.
- Адаптивный дизайн протестированный и оптимизированный для всех устройств.
- Готовые к развертыванию файлы передаются в систему контроля версий (Например Git)
- Краткое руководство о том, как управлять содержимым меню.
(Например добавлять / удалять категории)