Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/roman-pixel/mindbox-todo
Приложение для управления списком задач (TODO)
https://github.com/roman-pixel/mindbox-todo
react tailwindcss typescript
Last synced: about 1 month ago
JSON representation
Приложение для управления списком задач (TODO)
- Host: GitHub
- URL: https://github.com/roman-pixel/mindbox-todo
- Owner: roman-pixel
- License: mit
- Created: 2024-12-11T13:07:15.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2024-12-11T13:23:00.000Z (about 1 month ago)
- Last Synced: 2024-12-11T13:43:02.646Z (about 1 month ago)
- Topics: react, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://romans-pixel-mindbox-todo.vercel.app/
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# mindbox-todo
## Демо
Вы можете увидеть демо-версию приложения по следующей ссылке:
[Демо-приложение](https://romans-pixel-mindbox-todo.vercel.app)
## Описание
Приложение для управления списком задач (TODO). Оно позволяет пользователям добавлять, удалять задачи и отмечать их как выполненные. Интерфейс интуитивно понятен, с возможностью фильтрации задач по состоянию (все, выполнены или нет).
- Приложение создано с использованием TypeScript, React и React Hooks
- Ключевая функциональность покрыта тестами
- Проект доступен на Vercel
## Инструкция по использованию
- **Добавление задачи**:
- Для добавления новой задачи введите текст задачи в поле ввода, расположенное в верхней части экрана.
- Нажмите клавишу "Enter" или кнопку "+", чтобы сохранить задачу в списке.
- **Отметка задачи как выполненной**:
- Чтобы отметить задачу как выполненную, кликните по чекбоксу слева от текста задачи.
- Задача будет перечеркнута, а её стиль изменится, отображая завершённое состояние.
- **Удаление задачи**:
- Для удаления задачи кликните по кнопке (иконка Х), расположенной справа от задачи.
- Задача будет удалена из списка.
## Покрытие тестами
- Создание задачи с помощью клавиши Enter и кнопки "Сохранить"
- Изменение статуса задачи (выполнена/не выполнена)
- Фильтрация задач по состоянию (Все, Активные, Завершенные)
- Сворачивание и разворачивание списка задач
- Удаление одной задачи
- Очистка завершённых задач
## Установка и запуск приложения
1. Клонируйте репозиторий:
```bash
git clone https://github.com/roman-pixel/ton-test-task.git
```
2. Перейдите в каталог проекта
3. Установите зависимости с помощью yarn или npm:
```bash
npm install
```
4. Запустите приложение
```bash
npm run start
```
5. Запустите тесты
```bash
npm run test
```