https://github.com/a1unade/todo-list
Итоговый проект по модулю JS
https://github.com/a1unade/todo-list
asp-net ci cqrs entity-framework jwt mediatr microsoft-identity postgresql react redux
Last synced: 2 months ago
JSON representation
Итоговый проект по модулю JS
- Host: GitHub
- URL: https://github.com/a1unade/todo-list
- Owner: a1unade
- License: mit
- Created: 2025-03-17T14:42:29.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-04-26T13:13:42.000Z (about 1 year ago)
- Last Synced: 2025-06-03T23:49:46.983Z (about 1 year ago)
- Topics: asp-net, ci, cqrs, entity-framework, jwt, mediatr, microsoft-identity, postgresql, react, redux
- Language: C#
- Homepage:
- Size: 306 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## Техническое задание на разработку веб-приложения для управления задачами (Task Manager)
### 1. Общее описание проекта
Необходимо разработать веб-приложение для управления задачами (``Task Manager``), которое позволит пользователям создавать, редактировать, удалять и отслеживать выполнение задач.
Приложение должно быть интуитивно понятным, отзывчивым и поддерживать работу с данными в реальном времени.
### 2. Основные функциональные требования
Приложение должно включать следующие функции:
1) Управление задачами:
- Создание задачи с указанием названия, описания, приоритета, срока выполнения и статуса (например, "В процессе", "Завершено").
- Редактирование и удаление задач.
- Возможность отмечать задачи как выполненные.
- Фильтрация задач по статусу, приоритету и сроку выполнения.
2) Пользовательский интерфейс:
- Динамическое создание и удаление элементов DOM для отображения задач.
- Возможность редактирования задачи прямо в интерфейсе (inline editing).
- Использование событий для обработки действий пользователя (клики, наведение, отправка форм).
3) Работа с формами:
- Форма для добавления новой задачи с валидацией полей (название задачи обязательно, срок выполнения должен быть в будущем).
- Валидация данных на стороне клиента с использованием HTML5 атрибутов и JavaScript.
4) Асинхронная работа с данными:
- Использование ``Fetch API`` для отправки и получения данных с сервера.
- Реализация асинхронных операций для обновления задач без перезагрузки страницы.
- Использование ``Promises`` и *async/await* для обработки асинхронных запросов.
5) Хранение данных:
- Использование ``Local Storage`` для временного хранения задач на стороне клиента.
- Возможность синхронизации данных с сервером через API.
6) Обработка событий:
- Реализация делегирования событий для обработки кликов на задачах.
- Использование всплытия и погружения событий для оптимизации обработки.
7) Анимации и визуализация:
- Добавление анимаций при создании, удалении и изменении задач.
- Использование Canvas или CSS-анимаций для визуализации прогресса выполнения задач.
### 3. Технические требования
1) Языки и технологии:
- HTML5, CSS3, JavaScript (ES6+).
- Использование Fetch API для работы с сервером.
- Использование Local Storage для хранения данных на стороне клиента.
- Поддержка современных браузеров (Chrome, Firefox, Safari, Edge).
2) Архитектура:
- Приложение должно быть одностраничным (SPA) с динамическим обновлением контента.
- Использование модульного подхода для организации кода (например, разделение на модули для работы с DOM, API, событиями и т.д.).
3) API:
- Разработка REST API для работы с задачами (создание, чтение, обновление, удаление).
- Использование JSON для передачи данных между клиентом и сервером.
4) Асинхронность:
- Реализация асинхронных операций с использованием Promises и async/await.
- Обработка ошибок при работе с API (например, сетевые ошибки, ошибки сервера).
5) События:
- Реализация обработчиков событий для кликов, наведения, отправки форм.
- Использование делегирования событий для оптимизации производительности.
### 4. Дизайн и пользовательский опыт
1) Интерфейс:
- Чистый и минималистичный дизайн с акцентом на удобство использования.
- Адаптивный дизайн для поддержки мобильных устройств.
2) Анимации:
- Плавные анимации при добавлении, удалении и изменении задач.
- Индикаторы загрузки при выполнении асинхронных операций.
3) Доступность:
- Поддержка клавиатурной навигации.
- Соответствие стандартам доступности (WCAG).
### 5. Тестирование
1) Функциональное тестирование:
- Проверка всех функций приложения (создание, редактирование, удаление задач, фильтрация).
- Тестирование валидации форм.
2) Тестирование производительности:
- Проверка скорости загрузки и отзывчивости интерфейса.
- Оптимизация работы с DOM и асинхронными запросами.
3) Кросс-браузерное тестирование:
- Проверка работы приложения в различных браузерах и на разных устройствах.
### 6. Дополнительные требования
1) Документация:
- Написание документации по API.
- Создание руководства пользователя.
2) Логирование:
- Логирование ошибок и важных событий на стороне клиента и сервера.
3) Безопасность:
- Защита от XSS-атак и других уязвимостей.
- Валидация данных на стороне сервера.
### 7. Сроки и этапы разработки
1) Этап 1: Проектирование и дизайн (1 неделя)
- Создание макетов интерфейса.
- Проектирование API.
2) Этап 2: Разработка базового функционала (2 недели)
- Реализация управления задачами.
- Разработка API для работы с задачами.
3) Этап 3: Интеграция и тестирование (1 неделя)
- Интеграция фронтенда и бэкенда.
- Функциональное и кросс-браузерное тестирование.
4) Этап 4: Оптимизация и доработка (1 неделя)
- Оптимизация производительности.
- Доработка интерфейса и анимаций.
5) Этап 5: Сдача проекта (1 неделя)
- Написание документации.
- Подготовка к релизу.
### 8. Результат
В результате должен быть разработан полнофункциональный ``Task Manager``, который соответствует всем требованиям и предоставляет удобный интерфейс для управления задачами.
Приложение должно быть готово к использованию как на десктопных, так и на мобильных устройствах.