Задача: Разработка веб-приложения для управления списком задач (To-Do List)
Создайте одностраничное приложение для управления списком задач. Приложение должно использовать современные технологии из списка требований и поддерживать базовый функционал взаимодействия через REST API и WebSocket.
Требования к реализации:
- Технологический стек
- Использовать React или Angular для разработки фронтенда.
- Визуализация интерфейса с использованием Material UI и/или Tailwind CSS.
- Возможность интерактивного редактирования задач с использованием Fabric.js (например, визуализация задач в виде диаграммы или на канвасе).
- Интеграция с бэкендом через REST API для базовых операций.
- Поддержка WebSocket для получения уведомлений в реальном времени о добавлении, изменении или удалении задач.
- Функциональные требования
- CRUD операции для задач:
- Создание задачи с указанием названия, описания и срока выполнения.
- Редактирование существующих задач.
- Удаление задачи.
- Отметка задачи как выполненной.
- Реализация фильтров:
- Фильтрация задач по статусу: “Все”, “Выполненные”, “Невыполненные”.
- Сортировка задач по сроку выполнения.
- Визуализация задач:
- Внедрение канваса с помощью Fabric.js, где каждая задача представлена в виде элемента (например, прямоугольника), который можно перетаскивать.
- Реальное время:
- Использование WebSocket для отображения обновлений списка задач при изменении на сервере (например, если другой пользователь добавляет задачу).
- Технические детали
- Приложение должно обращаться к фейковому REST API, например, с использованием json-server или MockAPI.
- Для WebSocket можно использовать библиотеку, например, socket.io.
- Верстка должна быть адаптивной, корректно отображаться на мобильных устройствах.
- Дополнительно
- Желательно, но не обязательно: реализовать возможность работы в оффлайн-режиме (с использованием IndexedDB или LocalStorage).
- Если у вас есть опыт с Flutter: подготовить аналогичный интерфейс в качестве мини-прототипа мобильного приложения.
Ожидаемый результат:
- Исходный код приложения в репозитории на GitHub или другом удобном ресурсе.
- Инструкция по запуску проекта (включая зависимости).
- Краткое описание технического решения и использованных технологий.
Критерии оценки:
- Соответствие требованиям задания.
- Чистота и структура кода.
- Использование современных подходов и возможностей выбранного фреймворка.
- Удобство и эстетичность интерфейса.
- Корректность работы WebSocket и REST API.
- Качество визуализации с использованием Fabric.js.
Удачи в выполнении! Мы ждем ваши решения!