Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kharbacheuski/to-do-web-manager
Web Application for managing your todos
https://github.com/kharbacheuski/to-do-web-manager
Last synced: about 1 month ago
JSON representation
Web Application for managing your todos
- Host: GitHub
- URL: https://github.com/kharbacheuski/to-do-web-manager
- Owner: kharbacheuski
- Created: 2023-09-12T06:48:38.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-10-25T18:23:07.000Z (about 1 year ago)
- Last Synced: 2024-04-23T19:07:38.477Z (9 months ago)
- Language: TypeScript
- Size: 2.1 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# To-do Web Manager
# Содержание
1. [Описание приложения](#intro)
2. [Составляющие проекта](#project_components)
2.1 [База данных](#bd)
2.2 [Backend](#backend)
2.3 [Frontend](#frontend)
3. [Основной функционал проекта](#main_functional)
4. [Схема взаимодействия компонентов проекта](#project_scheme)
5. [Графический материал](#graph_materials)
5.1 [Диаграммы](#graph_materials)
5.2 [Скриншоты](#graph_materials)
6. [Исходный код проекта](#source_code)
6.1 [Frontend](#source_code)
6.2 [Backend](#source_code)
6.3 [Data Base](#source_code)
7. [Тестирование](#testing)
7.1 [Основные аспекты тестирования](#testing_aspects)
7.1.1 [Цели](#testing_goals)
7.1.2 [Виды](#testing_vars)
7.1.3 [Инструменты](#testing_instruments)
7.1.4 [Риски](#testing_risks)
7.2 [Запуск тестов](#testing_start)
7.3 [Результат тестирования](#testing_results)
7.4 [Исходный код тестов](#testing_src)
8. [Нефункциональные требования](#non-functional_requirements)
8.1 [Атрибуты качества](#quality_attributes)
8.1.1 [Требования к удобству использования](#requirements_for_ease_of_use)
8.1.2 [Требования к безопасности](#security_requirements)
8.2 [Внешние интерфейсы](#external_interfaces)
8.3 [Ограничения](#restrictions)
9. [Запуск проекта](#starting)
# 1 Описание приложения
Web-приложение "Список дел" предназначено для уменьшение нагрузки на память человека путём оставления заметок.
Приложение создано для пользователей любой операционной системы так как работает в работает в браузере. Приложение позволит создавать, редактировать существующие и удалять неактуальные записи.
Приложение будет написано на новейших технологиях веб разработки, используя популярные подходы разработки ПО.
С технической точки зрения приложение представляет классическую трехслойную архитектуру: Клиент -> Сервер -> База Данных
# 2 Составляющие проекта
Благодаря тому, что разрабатываемое приложение является веб-приложение, доступ к нему можно получить сети.
Не нужно ничего устанавливать. Приложение работает как сайт и является кроссплатформенным и кроссбраузерным.
## 2.1 База данных
Хранение данных будет реализовано в SQL таблицах, где будет хранится информация о пользователях и их заметках.
В таблице задач у каждой записи есть ссылка на пользователя (id), который создал эту заметку. Все пароли пользователей хранятся в таблице в захешированном (посредством md5 хеша) виде.
## 2.2 Backend
Серверная часть будет реализовывать главную логику приложения, работать с базой данных через SQL запросы. Язык написания: NodeJS.
Backend предоставляет API-методы, вызывая которые, клиенсткая сторона будет взаимодейстовать с сервером и опосредованно с базой данных.
## 2.3 Frontend
Клиентская часть будет реализовывать функционал backend приложения посредством вызова API методов.
Язык написания: JavaScript фреймворк - React.
# 3 Основной функционал проекта
Приложение To Do Web Manager включает в себя несколько основный функций:
- Аутентификация пользователя.
- Вход в систему
- Регистрация
- Работа со своими заметками заметками
- Добавление новой заметки
- Удаление заметки
- Редактирование заметки
Информация о пользователях и их задачах хранится в отдельных таблицах базы данных.
# 4 Схема взаимодействия компонентов проекта
# 5 Графический материал
## 5.1 Диаграммы
По ссылке ниже представлены 5 типов диаграмм:
- Диаграмма классов
- Диаграмма активностей
- Диаграмма последовательностей
- Диаграмма состояний
- Диаграмма компонентов
[Диаграммы](https://github.com/kharbacheuski/to-do-web-manager/tree/main/documentation/diagrams/README.md)
## 5.2 Скриншоты
По ссылке ниже размещены скриншоты основных элементов приложения
[Скриншоты](https://github.com/kharbacheuski/to-do-web-manager/tree/main/documentation/screenshots/README.md)
# 6 Исходный код проекта
Исходных код проекты включает в себя программы двух главных составляющих проекта: фронтенд и бэкэнд, а также дампы таблиц для MySQL базы данных
## 6.1 Frontend
[Frontend](https://github.com/kharbacheuski/to-do-web-manager/tree/main/project-code/client)
## 6.2 Backend
[Backend](https://github.com/kharbacheuski/to-do-web-manager/tree/main/project-code/server)
## 6.3 Data Base
[Data Base](https://github.com/kharbacheuski/to-do-web-manager/tree/main/project-code/data-base)
# 7 Тестирование
## 7.1 Основные аспекты тестирования
### 7.1.1 Цели
Данное тестирование преследует цели правильности работы тестируемой функциональности, а также
защиты кода от стороннего изменения. При изменении кода без изменения сопуствующего изменения тестов будет обнаружена ошибка.
Одной из главной целью тестирование является предотвращение попадания неправильной функциональности к конкретным пользователям (в прод).
Тоесть выявления неисправностей, ошибок, уязвимостей на этапе разработке и альфа-тестирования.
Объекты тестирования:
1. API-метод удаления задачи
2. API-метод аутентификации пользователя
3. API-метод удаления пользователя
### 7.1.2 Виды
В рамках данного проекта была выбрана реализация интеграционных тестов.
Тесты, которые тестирует не конкретный модуль или функцию, а совокупность взаимодействующих модулей, методов, при определенных входных и ожидаемых выходных параметрах
### 7.1.3 Инструменты
Для реализации тестов, была выбрана библиотека Jest, направленная на тестирование приложений написанных на NodeJS и JavaScript.
### 7.1.4 Риски
При неправильной работе аутентификации в системе, пользователь может иметь доступ к задачам, назначенным другому пользователю. Изменять их, удалять и добавлять новые. Это риск для безопасности приложения, который при возникновении сводит на нет конфидентильность приложения.
При некорректной работе удаления пользователя, данные о человеке, которых захотел удалить свой аккаунт из системы, буду удалены не полностью или не удалены вообще. Это будет влияеть на стабильность и чистоту системы (базы данных), а также противоречит законодательству и политике конфидентиальности.
## 7.2 Запуск тестов
Для того чтобы запустить тесты нужно
- перейти в директорию ```project-code/server```
- запустить из консоли команду ```npm run test```
## 7.3 Результат тестирования
[Результат тестирования](https://github.com/kharbacheuski/to-do-web-manager/tree/main/documentation/testing/README.md)
## 7.4 Исходный код тестов
[Исходный код тестов](https://github.com/kharbacheuski/to-do-web-manager/tree/main/project-code/server/src/tests)
# 8 Нефункциональные требования
## 8.1 Атрибуты качества
### 8.1.1 Требования к удобству использования
1. Доступ к основным функциям веб-приложения не более чем за одну операцию;
2. Все функциональные элементы пользовательского интерфейса имеют названия, описывающие действие, которое произойдет при
выборе элемента;
3. Пошаговая инструкция использования основных функций приложения отображена в справке.
### 8.1.2 Требования к безопасности
Веб-приложение предоставляет возможность просмотра и редактирования задач только авторизированному пользователю.
После авторизации пльзователю назначается JWT-токен.
Для корректной работы приложени все последующие запросы должны содержать этот токен.
Пароли пользователей хранятся в таблице в зашифрованном виде
## 8.2 Внешние интерфейсы
Окна веб-приложения удобны для использования пользователями с плохим зрением:
* функциональные элементы контрастны фону окна.
* минималистичный и понятный дизайн.
* простота использования с соблюдением UI/UX.
## 8.3 Ограничения
1. Клиентское приложение реализовано с использованием React JS;
2. Все записи хранятся в базе данных MySQL (можно настроить любую базу данных).
3. Серверная часть - NodeJS;
# 9 Запуск проекта
Для того чтобы полностью развернуть проект понадобится привести в рабочее состояние три слоя проекта в следующей последовательности:
- База данных
- Серверная часть
- Клиентская часть
0) Для начала нужно установить зависимости: Node (например v14.18.0), MySQL Server, MySQL Workbench - UI для взаимодействия с базами данных (опционально)
1) Для запуска базы данных, создайте SQL схему (структурный дамп лежит в директории ```project-code/data-base```) и запустите MySQL Server
2) Для запуска серверной части, нужно перейти в директорию ```project-code/server```
- В файле db/connect.js должны быть валидные данные для подключения к базе данных
- Из консоли выполнить команду ```npm run server -- ```, где db_password - пароль к базе данных
3) Для запуска клиента, нужно перейти в директорию ```project-code/client``` из консоли выполнить команду
- ```npm run start``` для запуска в режиме разработки
- ```npm run build``` для запуска в режиме деплоя