Техническое задание для кандидата на вакансию Frontend - разработчик (VUE)
Задание:
- В среде https://codesandbox.io/ или любой другой подобной, реализовать задачу
- Ниже описанная задача несет в себе абстрактный пример, для проверки навыков Стек: Frontend: Vue 3 Store: Pinia VUEX CSS: Tailwind Данные: https://jsonplaceholder.typicode.com/ Функционал:
- На странице выводится по 5 записей = post (https://jsonplaceholder.typicode.com/)
- На странице есть пагинация
- Ниже общего списка записей есть набор
- Записи, которые понравились
- Записи, которые не понравились
- У записи есть возможность выбрать варианты, нравится или нет. При выборе одного из вариантов запись попадает в соответсвующий список и исчезает из общего.
- Записи можно возвращать из списков "Понравилось" или "Не понравилось" в общий список
- Визуальные решения = дизайн на ваш выбор
Как я выполил это задание:
Посмотреть результат можно здесь
- Я использовал указанный стек технологий (Vue 3, Pinia Vuex, Tailwind) и дополнили его TypeScript для типизации данных.
- Для отслеживания статусов "Понравилось" и "Не понравилось" был создан дополнительный store и определены статусы для каждого поста.
- Компоненты для списка постов и пагинации были выделены в отдельные компоненты, что обеспечило модульность и повторное использование кода.
- Использование слотов для передачи кнопок в компонент списка постов и передача данных через props позволили сделать компонент более гибким.
- Внешний вид был оставлен простым, учитывая отсутствие требований к дизайну и адаптивности в техническом задании.