https://github.com/mor-ald/task-tracker
Task tracker app
https://github.com/mor-ald/task-tracker
drag-and-drop jest json-server react react-testing-library redux redux-toolkit rtk-query task-tracker typescript
Last synced: 9 months ago
JSON representation
Task tracker app
- Host: GitHub
- URL: https://github.com/mor-ald/task-tracker
- Owner: Mor-ald
- Created: 2025-01-31T15:28:18.000Z (11 months ago)
- Default Branch: master
- Last Pushed: 2025-02-10T16:03:46.000Z (11 months ago)
- Last Synced: 2025-02-10T16:23:46.504Z (11 months ago)
- Topics: drag-and-drop, jest, json-server, react, react-testing-library, redux, redux-toolkit, rtk-query, task-tracker, typescript
- Language: TypeScript
- Homepage:
- Size: 227 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Трекер задач
## О проекте
Трекер задач, созданный на React с использованием стейт-менеджера Redux (redux toolkit, rtk query) с фичей Drag and Drop (библиотека pragmatic-drag-and-drop) и синхронизацией с локальным сервером через json-server (db.json файл).
## Зачем
Опробовать возможности библиотек управления состоянием приложения redux, redux toollit, rtk query. _Дополнительно:_
- Все компоненты и хранилища покрыты тестами с помощью `Jest + React Testing Library`
- Опробована библиотека `pragmatic-drag-and-drop` для создания зон `drag and drop` и `draggable` элементов для осуществления обновления статуса задач.
## Демо
## Используемые технологии и библиотеки
- Создание пользовательского интерфейса: `React`
- Состояние: Redux, `Redux Toolkit`
- Работа с API: `RTK Query`
- Типизация: `TypeScript`
- Стилизация: `SCSS`
- Тестирование: `Jest`, `React testing library`
- Линтинг и форматирование: `Eslint`, `Stylelint`, `Prettier`
- Сборка: `Vite`
- Стандартизация коммитов: `Commitlint`, `Commitizen`
- Локальный сервер: `json-server`
- Drag and drop: `pragmatic-drag-and-drop`
## Структура проекта
```
.
└── /src
├── /assets
| ├──/images
| └──/styles
├── /components
| ├── /layout
| └── /ui
├── /hooks
├── /services
├── /store
├── /types
├── /utils
├── App.tsx
├── index.scss
├── main.tsx
└── vite-end.d.ts
```
## Запустить локально
Установка зависимостей
```
npm install
```
Запуск приложения и локального сервера с данными
```
npm run dev
```
Запуск тестов
```
npm run test
```