+7 (495) 859-21-36
Предоставляемые услуги
  1. Сайты
  2. Порталы
  3. Интернет-магазины
  4. Мобильные приложения
  5. Лендинги
  6. Брендинг
  7. Нейминг
  8. Продвижение
  9. Дизайн сайта
  10. Личные кабинеты
  11. Аудит сайта
  12. Образовательные платформы
  13. Сайты на Тильде
  14. Комплексный интернет маркетинг
  15. Техническая поддержка
  16. Коммерческие фотосессии
Вакансия

Front-end верстальщик в веб-студии

Мы рады, что вы выбрали нашу команду чтобы развиваться в направлении Front-end. Перед собеседованием мы просим вас выполнить тестовое задание

Подробнее о вакансии
Тестовое задание:
Задание для вакансии Front-end верстальщик в веб-студии

По данной ссылке доступен макет: https://www.figma.com/design/HKYgWqoeN4VtSHdJKALMhO/%D0%A2%D0%B5%D1%81%D1%82%D0%BE%D0%B2%D0%BE%D0%B5?node-id=0-1&t=3Bnm0SvJxYhMtdIr-1

Пояснительная записка

Требуется написать деплой на гитхабе, используя html, css, js (бекенд и верстку для приложения, которую можно найти в макете, не нужно).


Баннер:

— при нажатии на один из элементов, он должен раскрыться, а другие уменьшиться, при этом изначально первый слайд раскрыт;
— при нажатии на купить нужно анимировать добавление в корзину.


Категории:

— при нажатии на стрелку, она должна менять свой свет и блок с товарами должен раскрываться;
— кнопка "загрузить еще" должна быть видна, только если элементов больше одной строчки;
— по нажатию на кнопку "загрузить еще" блок с товарами должен раскрываться полностью, чтобы поместились все товары;
— по нажатию на картинку товара, должно открываться модальное окно с детальным просмотром товаров (модальное окно под каждый товар не нужно - наполнять модальное окно соответствующей информацией - работа бека);
— при нажатии на "купить" нужно анимировать добавление в корзину;
— нажатие на "сердце" меняет его состояние.

Блог:

— только слайдер.


Авторизация и регистрация:

— валидация почты на соответствие формату и заполненности;
— валидация остальных полей только на заполненность.


Избранное:

— при нажатии на "сердце" элемент должен исчезать.

Корзина:

— управление количеством не требуется, т.к. бек будет получать количество от БД и актуализировать (при таком подходе исчезает проблема управления количеством с разных вкладок браузера);
— при нажатии на "удаление" элемент должен исчезать.

Поиск:

— только верстка, функционал не требуется.

Контакты:

— модальное окно;
— карта должна быть не картинкой, а через АПИ Яндекс карт.


Как и в самой пояснительной записке, напомним, что в наших проектах предполагается работа бека с версткой, а, значит, у него должен быть прямой доступ к тегам для наполнения информацией с БД. Никакая информация не должна приходить из js (исключение ymaps).

Форма обратной связи