Тема данного веб-приложения: "Учет личных расходов". Стек технологий: MongoDB, Express.js, React, Node.js.
Здесь приведено краткое руководство пользователя, подробности см. в файле "Пояснительная записка.docx".
Для перехода к сайт необходимо ввести http://localhost:3000/ в строке ввода пути в браузере. Вы попадете на главную страницу:
На этой странице можно авторизоваться либо зарегистрироваться как новый пользователь:
Чтобы завершить регистрацию, требуется заполнить поля данных и нажать на кнопку «Зарегистрироваться». После Вы автоматически перейдете на страницу авторизации, где Вам снова будет необходимо ввести ваши данные. Нажимаем на кнопку «Авторизоваться». Вы перенаправитесь на страницу транзакций. На странице транзакций пользователь может просмотреть все свои транзакции:
На этой странице Вы можете отсортировать все свои транзакции, нажав на кнопку фильтра, который находиться под именем пользователя. Здесь вы можете отсортировать ваши транзакции по датам, по типу транзакции (зарплата, еда и т.д.), по сумме транзакции:
Если нажать на имя пользователя, всплывает боковое окно с основной информацией пользователя. Здесь же можно осуществить выход из аккаунта и перейти на страницу авторизации:
При нажатии на логотип сайта, слева всплывает другая панель, где Вы можете осуществлять переход между страницами «Транзакции» и «Анализ транзакций». Помимо этого здесь же Вы можете открыть модальное окно добавления дохода/расхода:
Давайте рассмотрим модальное окно добавления транзакции. Для этого нужно нажать на текст «Добавить расход/доход». Затем вам необходимо заполнить все поля: доход это или расход, тип транзакции, сумма транзакции, дата транзакции:
Перейдем на страницу «Анализ транзакций». Здесь Вы можете наглядно увидеть, как Ваши деньги приходят и уходят. Также в цифрах отображаются: баланс, общий оборот за период, общий расход за период, общий доход за период. При начальном переходе на эту страницу диаграммы будут описывать все транзакции. Однако той же кнопкой фильтра вы можете настроить диапазон интересующих Вас дат:
Чтобы авторизоваться в качестве администратора, требуется также нажать кнопку «Войти». Вы перейдете на страницу пользователей:
Для поиска определенного пользователя можете начать ввести его фамилию, имя либо почту в поле для ввода текста с надписью «Поиск пользователей», как это сделано на рисунке:
Для удаления пользователя Вам необходимо нажать на кнопку «Удалить». Перед Вами всплывет модально окно с надписью о том, уверены ли Вы в вашем действии:
Для изменения данных о пользователе Вам необходимо нажать на кнопку «Изменить». Перед Вами всплывет модально окно с полями, заполненными данными пользователя. Здесь Вы можете изменить эти данные:
