Готов проверить свои силы?
Выполни тестовое задание и пришли на нашу почту!
Часть 1. Todo List.
Реализовать to-do list. В идеале сделать задание на Vue.js/ Vue CLI. Можно на VanillaJS или React.js.
Ссылка на макет.
1) адаптивная вёрстка;
2) на одной странице создать не более 10 записей:
  • обратная сортировка (от последней записи к первой);
  • переключение страниц с помощью пагинации;
3) возможность ввода новой задачи в начале списка на каждой странице (не как на фото, а в начале =));
4) каждую запись можно удалить (есть крестик);
5) вывод записей:
5.1. Если на Vue.js или React.js:
a) Вывод записей из Vuex/Redux (в Vuex/Redux попадают первично через action загрузки и мутацию из json, далее добавляются/удаляются и т.д.).
b) Хранение и вывод данных из Vuex/Redux.
5.2. Иначе:
a) Вывод записей из localStorage (в который попадают первично из JSON файла, далее добавляются/удаляются).
Дополнительно
  1. В качестве хранилища, для хранения и вывода данных использовать облачную БД https://firebase.google.com/products/ "Cloud Firestore"
  2. Возможность редактирования записи на отдельной странице
  3. Возможность пометить запись как выполненную
  4. При добавлении новой записи и нахождении не на первой странице переключать пагинацию на первую страницу
  5. Добавление лоадеров при загрузке следующих страниц
  6. Пагинация реализована через url
Часть 2. Dev task execution.
Дан пример задачи, сценарии приемки, входные данные. На основании которых необходимо ответить на вопросы, список которых перечислен ниже (под задачей).

Сценарии приёмки задачи:

  1. Как пользователь, находясь на главной странице поиска, вижу ее в соответствии с дизайном.
  2. Как пользователь могу воспользоваться клавиатурой и ее возможностями (возможностями только клавиатуры из макетов, представим что клавиатуры нет), в том числе переключением наборов символов для набирания поискового текста.
  3. Как пользователь, набирая текст в поисковой строке, вижу поисковые подсказки (логика и ранжирования которых описана дизайн макетами) и могу ими воспользоваться для более удобного поиска магазинов.
  4. Как пользователь имею возможность перейти на страницу полноценного поиска, для того чтобы иметь возможности использовать полноценный функционал поиска.
Ссылка на макет

Пример структуры данных объекта поиска:
{
"active": true,
"name": "O'STIK",
"description": "Отличный, большой магазин с большим выбором",
"hybris": "одежда ostik,одежда остик,одежда остиу",
"alias": "ostik,ostk,остиу,остик,остиг"
}

Задание:
По вводным данным задачи, необходимо описать, что конкретно будет сделано в рамках данной задачи:
  1. Описать шаблонную логику компонентов, которые будут реализовываться.
  2. Поисковую логику, описать приоритеты ранжирования подсказок, основываясь на макетах.
  3. Что будет видеть пользователь при нажатии кнопки "поиск".
  4. На какие компоненты (элементы) будет разбит макет и почему (со скринами).
  5. Какой компонент будет отвечать за логику поиска и почему.
Отправить на email
Отправь ссылку на репозиторий на GitHub с указанием количества затраченных часов и пунктов из списка «Дополнительно» на email hr@kt-team.de.
Мы отвечаем каждому кандидату независимо от результата.
Ждём твоего письма!
Готов проверить свои силы?
Выполни тестовое задание и пришли на нашу почту!
Часть 1. Todo List.
Реализовать to-do list. В идеале сделать задание на Vue.js/ Vue CLI. Можно на VanillaJS или React.js.
Ссылка на макет.
1) адаптивная вёрстка;
2) на одной странице создать не более 10 записей:
  • обратная сортировка (от последней записи к первой);
  • переключение страниц с помощью пагинации;
3) возможность ввода новой задачи в начале списка на каждой странице (не как на фото, а в начале =));
4) каждую запись можно удалить (есть крестик);
5) вывод записей:
5.1. Если на Vue.js или React.js:
a) Вывод записей из Vuex/Redux (в Vuex/Redux попадают первично через action загрузки и мутацию из json, далее добавляются/удаляются и т.д.).
b) Хранение и вывод данных из Vuex/Redux.
5.2. Иначе:
a) Вывод записей из localStorage (в который попадают первично из JSON файла, далее добавляются/удаляются).
Дополнительно
1. В качестве хранилища, для хранения и вывода данных использовать облачную БД:
1.1. https://firebase.google.com/products/ "Cloud Firestore"
1.2. https://tproger.ru/translations/simple-web-app-with-vue-and-firebase/
Интеграция по добавлению/изменению/удалению записей;
2. Возможность редактирования записи на отдельной странице;
3. Возможность пометить запись как выполненную;
4. При добавлении новой записи и нахождении не на первой странице переключать пагинацию на первую страницу;
5. Добавление лоадеров при загрузке следующих страниц;
6. Пагинация реализована через url.
Часть 2. Dev task execution.
Дан пример задачи, сценарии приемки, входные данные. На основании которых необходимо ответить на вопросы, список которых перечислен ниже (под задачей).

Сценарии приёмки задачи:

  1. Как пользователь, находясь на главной странице поиска, вижу ее в соответствии с дизайном.
  2. Как пользователь могу воспользоваться клавиатурой и ее возможностями (возможностями только клавиатуры из макетов, представим что клавиатуры нет), в том числе переключением наборов символов для набирания поискового текста.
  3. Как пользователь, набирая текст в поисковой строке, вижу поисковые подсказки (логика и ранжирования которых описана дизайн макетами) и могу ими воспользоваться для более удобного поиска магазинов.
  4. Как пользователь имею возможность перейти на страницу полноценного поиска, для того чтобы иметь возможности использовать полноценный функционал поиска.
Ссылка на макет

Пример структуры данных объекта поиска:
{
"active": true,
"name": "O'STIK",
"description": "Отличный, большой магазин с большим выбором",
"hybris": "одежда ostik,одежда остик,одежда остиу",
"alias": "ostik,ostk,остиу,остик,остиг"
}

Задание:
По вводным данным задачи, необходимо описать, что конкретно будет сделано в рамках данной задачи:
  1. Описать шаблонную логику компонентов, которые будут реализовываться.
  2. Поисковую логику, описать приоритеты ранжирования подсказок, основываясь на макетах.
  3. Что будет видеть пользователь при нажатии кнопки "поиск".
  4. На какие компоненты (элементы) будет разбит макет и почему (со скринами).
  5. Какой компонент будет отвечать за логику поиска и почему.
Отправить на email
Отправь ссылку на репозиторий на GitHub с указанием количества затраченных часов и пунктов из списка «Дополнительно» на email hr@kt-team.de.
Мы отвечаем каждому кандидату независимо от результата.
Ждём твоего письма!
Познакомимся?
Приходи в офис или пиши!
+7 (495) 369-2029
hr@kt-team.de
kt.team

Москва, Ильинка 4, п. 5 (Гостиный двор)
Тольятти, ул. Офицерская, 12А, к1 (ТЦ «Рим»)
Краснодар, ул. ул. Северная, д. 490 (БЦ «Кутузовский»)