Skip to content

tryasko/testtask-2019-10-25

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 

Repository files navigation

Тестовое задание: «Список задач»

Необходимо реализовать на чистом React.js (без Redux.js и других библиотек менеджеров состояний, используйте React Hooks) список задач. Список должен содержать следующие столбцы: number, object icon, name, description, delete icon; Должна быть возможность удалять элементы из списка по клику по иконке

Скриншот подобного списка:

Для того чтоб создать новый элемент списка нужно кликнуть по иконке Должно открыться модальное окно в котором должны быть два поля ввода для name и description. Данные сохраняются и добавляются в список по клику по кнопке Save, затем окно закрывается. Кнопка Cancel и крестик просто закрывают модальное окно без сохранения.

Скриншот модального окна:

Данные для спика нужно хранить в localStorage чтоб при перезагрузке страницы они не терялись и была возможность продолжить работу с списком задач. Код тестового задания необходимо выложить у себя на https://github.com/ и дать ссылку. Важно соблюдать историю коммитов и давать им понятное описание. Мы не предъявляем никаких требований к стилизация списка, модального окна и т.д. Это остается на усмотрение разработчика. Иконки взять здесь: иконки

При реализации тестового задания будет плюсом:

  1. Использовать сборщик модулей Webpack
  2. Использовать Bootstrap в качестве css фреймворка (не использовать Bootstrap.js, только CSS)
  3. Добавить валидацию, если в модальном окне поля name или description пустые то нельзя нажать кнопку Save
  4. Добавить возможность редактировать существующие задачи из списка. Например по клику по name открывается модальное окно для редактирования.
  5. Сбилдить и выложить приложение на GitHub pages

Удачи!

About

Hiring Middle Front-end Developer to CloudBees

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published