Simple Todo list

Тестовое задание Frontend junior в Mindbox

Ссылка

Задание:

Сделайте ToDo-приложение, позволяющее управлять текущим списком дел

Что должно быть в интерфейсе:

• Поле для ввода новой задачи
• Списки всех задач, невыполненных и выполненных задач (по отдельности)

Требования к коду:

• Приложение создано с использованием TypeScript, React и React Hooks
• Библиотеки компонент – на ваше усмотрение
• Ключевая на ваш взгляд функциональность покрыта тестами
• Проект должен запускаться командой npm i && npm run start

Функциональность:

responsive SPA, где можно:

• добавлять новые задачи (title, description и color)
• изменять задачи
• удалять задачи
• фильтровать:
  • все (all)
  • выполненные (done)
  • невыполненные (active)
• Также можно фильтровать задачи по цветам карточек задач
• Выполненные задачи удаляются все сразу.
• При попытке добавить "пустую" задачу, кнопка дизэйблится.

Stack:

• React
• React Hooks
• RTK
• MUI + tss-react
• testing-library

Также испльзовались: React-router-dom | classnames | mui material-icons

Инструкция по установке:

Описание	Команда
1. Клонируем репозиторий	git clone
2. Устанавливаем зависимости	npm install or npm i
3. Запускаем	npm run start