ChSTU repository
ChSTU repository preserves and enables easy and open access to all types of digital content including text, images, moving images, mpegs and data sets
Learn More
Please use this identifier to cite or link to this item:
https://er.chdtu.edu.ua/handle/ChSTU/6885Full metadata record
| DC Field | Value | Language |
|---|---|---|
| dc.contributor.advisor | Катаєв, Дмитро Сергійович | - |
| dc.contributor.author | Перехрест, Богдан Іванович | - |
| dc.date.accessioned | 2026-01-25T21:31:41Z | - |
| dc.date.available | 2026-01-25T21:31:41Z | - |
| dc.date.issued | 2024-06-11 | - |
| dc.identifier.uri | https://er.chdtu.edu.ua/handle/ChSTU/6885 | - |
| dc.description.abstract | Сучасний стан потреб суспільства у web-орієнтованих інформаційних системах, web-ресурсах та web-додатках постійно зростає. Це пов'язано з: ● Зростанням популярності Інтернету: ○ Інтернет став основним джерелом інформації для багатьох людей. ○ Люди шукають інформацію про товари, послуги, події тощо в Інтернеті. ○ Web-сайти та web-додатки стали зручними інструментами для доступу до інформації та послуг. ● Зростанням використання мобільних пристроїв: ○ Все більше людей використовують смартфони та планшети для доступу до Інтернету. ○ Web-сайти та web-додатки повинні бути оптимізовані для мобільних пристроїв, щоб користувачі могли зручно ними користуватися. ● Зростанням потреби в електронній комерції: ○ Все більше людей роблять покупки в Інтернеті. ○ Web-сайти та web-додатки повинні надавати зручні та безпечні можливості для онлайн-покупок. Недоліки сучасних аналогічних інформаційних систем: ● Багато сучасних web-сайти та web-додатків складні у використанні. ● Багато web-сайти та web-додатки не є безпечними. 3 Мета та задачі Метою цієї кваліфікаційної роботи є створення зручного, функціонального та ефективного веб-сервісу для управління особистими фінансами. Цей сервіс повинен допомогти користувачам: ● Відстежувати свої доходи та витрати. ● Аналізувати свої доходи та витрати. ● Досягати своїх фінансових цілей. Задачі цієї кваліфікаційної роботи: 1. Проаналізувати існуючі web-сервіси управління фінансами. 2. Спроектувати та розробити web-сервіс управління фінансами на Ruby on Rails. 3. Протестувати та вдосконалити web-сервіс управління фінансами. Методи дослідження: ● Аналіз літератури. ● Проектування та розробка web-сервісу. ● Тестування web-сервісу. | uk_UA |
| dc.language.iso | uk | uk_UA |
| dc.subject | web-ресурс | uk_UA |
| dc.subject | дизайн | uk_UA |
| dc.subject | інформаційна система | uk_UA |
| dc.subject | веб додаток | uk_UA |
| dc.subject | розробка | uk_UA |
| dc.title | Веб-сервіс управління фінансами | uk_UA |
| dc.type | Bachelor Thesis | uk_UA |
| Appears in Collections: | 126 Інформаційні системи та технології (Web-технології, web-дизайн) | |
Files in This Item:
| File | Description | Size | Format | |
|---|---|---|---|---|
| РЕП_БАК_Перехрест_WEBc-2211.pdf Restricted Access | 856.78 kB | Adobe PDF | View/Open Request a copy |
Items in DSpace are protected by copyright, with all rights reserved, unless otherwise indicated.
Extracted text
МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ
ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ
ФАКУЛЬТЕТ ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ І СИСТЕМ
КАФЕДРА ІНФОРМАЦІЙНИХ ТЕХНОЛОГІЙ ПРОЕКТУВАННЯ
ПОЯСНЮВАЛЬНА ЗАПИСКА
до кваліфікаційної роботи бакалавра
на тему: «Веб-сервіс управління фінансами»
Виконав: здобувач бакалаврського рівня
вищої освіти
4 курсу, групи WebC-2211
Спеціальності 126 Інформаційні системи
та технології
ОП «Web-технології, Web-дизайн»
Перехрест Богдан Іванович
Керівник: Катаєв Дмитро Сергійович,
кандидат технічних наук, старший
викладач кафедри Інформаційних
технологій проєктування.
Рецензент: кандидат фізико –
математичних наук, доцент, професор
кафедри РТСК Черкаського державного
технологічного університету Гавриш
Олександр Степанович
Черкаси – 2024 року
Зміст
Вступ............................................................................................................................................ 3
Актуальність........................................................................................................................... 3
Мета та задачі........................................................................................................................ 4
Практичне значення...............................................................................................................5
Розділ 1: Постановка задачі. Огляд існуючих рішень, аналогів........................................7
1.1 Загальна оцінка об'єкту та предмету роботи................................................................. 7
1.2 Огляд існуючих рішень.................................................................................................... 8
1.3 Аналіз аналогів.................................................................................................................9
2. Обґрунтування технічного завдання................................................................................14
2.1 Призначення розроблюваної інформаційної системи.................................................14
2.2 Вимоги до дизайну web-ресурсу................................................................................... 14
2.3 Структура сервера та сторінок......................................................................................15
2.4 Навігація......................................................................................................................... 15
2.5 Наповнення сторінок......................................................................................................16
2.6 Вимоги до прототипу розроблюваної системи.............................................................17
2.7 Техніко-економічне обґрунтування (ТЕО) доцільності створення web-ресурсу........ 18
2.8 Показники якості.............................................................................................................25
2.9 Параметри функціонування та надійності....................................................................26
2.10 Вимоги до хостингу...................................................................................................... 26
2.11 Структура та шаблон web-орієнтованої інформаційної системи..............................27
2.12 Функціональний опис................................................................................................... 27
2.13 Сценарії використання.................................................................................................28
2.14 Структури даних...........................................................................................................29
2.16 Висновок....................................................................................................................... 32
3. Розробка системи................................................................................................................ 33
3.1 Обґрунтовування вибору засобів реалізації системи..................................................33
3.2 Реалізація системи.........................................................................................................36
3.2.2 Фізична структура web-додатку..................................................................................40
3.2.3 Дизайн web-додатку....................................................................................................43
3.3 Тестування системи....................................................................................................... 45
3.4 Порівняння з аналогами................................................................................................ 47
Висновки................................................................................................................................... 48
Список використаних джерел................................................................................................50
Додаток А.................................................................................................................................. 51
Додаток Б.................................................................................................................................. 72
Додаток В.................................................................................................................................. 76
Додаток Г...................................................................................................................................78
2
Вступ
Актуальність
Сучасний стан потреб суспільства у web-орієнтованих інформаційних
системах, web-ресурсах та web-додатках постійно зростає. Це пов'язано з:
● Зростанням популярності Інтернету:
○ Інтернет став основним джерелом інформації для багатьох людей.
○ Люди шукають інформацію про товари, послуги, події тощо в
Інтернеті.
○ Web-сайти та web-додатки стали зручними інструментами для
доступу до інформації та послуг.
● Зростанням використання мобільних пристроїв:
○ Все більше людей використовують смартфони та планшети для
доступу до Інтернету.
○ Web-сайти та web-додатки повинні бути оптимізовані для
мобільних пристроїв, щоб користувачі могли зручно ними
користуватися.
● Зростанням потреби в електронній комерції:
○ Все більше людей роблять покупки в Інтернеті.
○ Web-сайти та web-додатки повинні надавати зручні та безпечні
можливості для онлайн-покупок.
Недоліки сучасних аналогічних інформаційних систем:
● Багато сучасних web-сайти та web-додатків складні у використанні.
● Багато web-сайти та web-додатки не є безпечними.
3
Мета та задачі
Метою цієї кваліфікаційної роботи є створення зручного, функціонального та
ефективного веб-сервісу для управління особистими фінансами. Цей сервіс
повинен допомогти користувачам:
● Відстежувати свої доходи та витрати.
● Аналізувати свої доходи та витрати.
● Досягати своїх фінансових цілей.
Задачі цієї кваліфікаційної роботи:
1. Проаналізувати існуючі web-сервіси управління фінансами.
2. Спроектувати та розробити web-сервіс управління фінансами на Ruby
on Rails.
3. Протестувати та вдосконалити web-сервіс управління фінансами.
Методи дослідження:
● Аналіз літератури.
● Проектування та розробка web-сервісу.
● Тестування web-сервісу.
4
Практичне значення
Розроблений web-сервіс управління фінансами може бути використаний:
● Приватними особами для управління своїми особистими фінансами.
● Інші групи людей
Web-сервіс може допомогти користувачам:
● Економити гроші.
● Досягати своїх фінансових цілей.
● Знизити рівень стресу, пов'язаного з фінансами.
Приватні особи:
● Контроль над витратами:
○ Виявлення "слабких місць": Аналіз витрат за описом допоможе
виявити, куди йде найбільше грошей, та визначити області, де
можна скоротити витрати.
○ Свідоме споживання: Відстеження витрат спонукає до більш
усвідомленого підходу до покупок та допомагає уникнути
імпульсивних витрат.
○ Економія: Завдяки кращому розумінню своїх фінансових звичок,
користувачі зможуть знайти можливості для економії та
збільшення своїх заощаджень.
● Досягнення фінансових цілей:
○ Мотивація: Відстеження прогресу досягнення цілей допомагає
залишатися мотивованим та дотримуватися плану.
○ Оптимізація: Користувачі можуть оцінити, чи достатньо вони
відкладають для досягнення своїх цілей.
5
● Зниження фінансового стресу:
○ Прозорість: Чітке розуміння свого фінансового стану та
контролю над витратами допомагає знизити рівень тривожності
та стресу, пов'язаного з грошима.
○ Впевненість у майбутньому: Фінансове планування та
досягнення цілей дають відчуття впевненості у своїх фінансових
можливостях та майбутньому.
Інші групи користувачів:
● Студенти:Можуть використовувати веб-сервіс для контролю своїх
витрат на навчання, проживання,харчування та розваги.
● Люди з не регулярним доходом: Допоможе відстежувати доходи з
різних джерел та планувати витрати відповідно до змін у фінансовому
становищі.
● Люди, які хочуть вийти з боргів: Дозволить розробити план
погашення боргів та відстежувати прогрес.
6
Розділ 1: Постановка задачі. Огляд існуючих рішень, аналогів
1.1 Загальна оцінка об'єкту та предмету роботи
Об'єкт дослідження:
Об'єктом цієї кваліфікаційної роботи є процес розробки веб-сервісів для
управління особистими фінансами. Це включає вивчення та аналіз існуючих
рішень, виявлення їх переваг та недоліків, визначення вимог до нового
веб-сервісу, вибір оптимальних технологій та інструментів розробки,
проектування архітектури та структури додатку, реалізацію
функціональності, тестування та оптимізацію.
Предмет дослідження:
Предметом цієї кваліфікаційної роботи є конкретний веб-сервіс для
управління особистими фінансами, розроблений на Ruby on Rails. Це
повноцінний програмний продукт, який надає користувачам інструменти для
відстеження доходів та витрат, аналізу фінансової інформації, планування
бюджету, постановки та досягнення фінансових цілей.
Мета роботи:
Метою цієї кваліфікаційної роботи є створення зручного, функціонального та
ефективного веб-сервісу для управління особистими фінансами. Цей сервіс
повинен допомогти користувачам:
● Відстежувати свої доходи та витрати:
○ Легко та швидко додавати нові записи про доходи та витрати.
○ Переглядати історію транзакцій.
● Аналізувати свої доходи та витрати:
7
○ Отримувати детальні звіти про доходи та витрати.
○ Візуалізувати фінансову інформацію за допомогою графіків та
діаграм.
Актуальність роботи:
Тема кваліфікаційної роботи є актуальною, оскільки фінансова грамотність та
вміння управляти особистими фінансами є важливими навичками у
сучасному світі. Розробка зручних і доступних інструментів, таких як
веб-сервіс управління фінансами, сприяє підвищенню фінансової грамотності
населення та покращенню якості життя.
1.2 Огляд існуючих рішень
Фінансовий менеджмент – це процес планування, організації та контролю
своїх доходів і витрат. Це стосується як особистих, так і ділових фінансів.
Мета фінансового менеджменту – це досягнення фінансових цілей, таких
як:
● Фінансова стабільність: мати достатньо грошей, щоб покривати свої
поточні витрати та несподівані витрати.
● Фінансова свобода: мати можливість обирати те, як ви хочете жити, не
турбуючись про гроші.
● Досягнення довгострокових цілей: накопичити на пенсію, купити
будинок або створити власний бізнес.
Основні принципи фінансового менеджменту:
● Бюджетування: Складання плану витрат і дотримання його.
● Відстеження витрат: Слідкування за тим, куди йдуть ваші гроші.
● Економія: Відкладання грошей на майбутнє.
8
● Інвестування: Збільшення своїх грошей за допомогою інвестицій.
● Управління боргом: Зведення до мінімуму боргу та його швидке
погашення.
Інструменти фінансового менеджменту:
● Бюджетні програми: Допоможуть вам скласти та відстежувати свій
бюджет.
● Фінансові калькулятори: Допоможуть вам розрахувати такі речі, як
процентні ставки та щомісячні платежі за кредитом.
● Інвестиційні рахунки: Допоможуть вам заощадити та інвестувати свої
гроші.
● Кредитні консультації: Допоможуть вам покращити свій кредитний
рейтинг і позбутися боргів.
1.3 Аналіз аналогів
У цьому розділі буде проведено аналіз існуючих web-сервісів управління
фінансами. Аналіз буде включати:
● Огляд функціональності: Які функції пропонує web-сервіс?
● Простота використання: Наскільки web-сервіс простий у
використанні?
● Надійність: Яка репутація web-сервісу з точки зору надійності?
● Безпека: Які заходи безпеки вживає web-сервіс для захисту даних?
● Вартість: Скільки коштує web-сервіс?
1.3.1 Web-сервіси управління фінансами
Існує безліч web-сервісів управління фінансами, які призначені для
9
особистого користування. Ці сервіси допомагають людям відстежувати свої
доходи та витрати, складати бюджети, інвестувати гроші та досягати своїх
фінансових цілей. Деякі з найпопулярніших web-сервісів включають:
Mi Personal YN Mvelop Simpl
Функція
nt Capital AB es ifi
Відстеження
✓ ✓ ✓ ✓ ✓
витрат
Управління
✓ ✓ ✓ ✓
боргами
Мобільний
✓ ✓ ✓ ✓ ✓
додаток
Безкоштовний
✓ ✓ ✓ ✓ ✓
план
Платні плани ✓ ✓ ✓ ✓ ✓
Порівняння web-сервісів
Наступна таблиця порівнює деякі з найпопулярніших web-сервісів
управління фінансами для особистого користування:
10
Personal
Функція Mint YNAB Mvelopes Simplifi
Capital
Основні
✓ ✓ ✓ ✓ ✓
функції
Додаткові
✓ ✓ ✓ ✓ ✓
функції
Інтерфейс
Складн Складн
користува Простий Складний Складний
ий ий
ча
Безкоштов Мінімал Мінімал Мінімал Мінімальн Мінімальн
ний план ьний ьний ьний ий ий
Основни Основн Основн
Основний Основний
Платні й ий ий
функціона функціона
плани функціо функціо функціо
л л
нал нал нал
11
Опис web-сервісів
● Mint
Mint - це безкоштовний web-сервіс управління фінансами, який
допомагає людям відстежувати свої доходи та витрати, складати
бюджети та досягати своїх фінансових цілей. Mint синхронізується з
вашими банківськими рахунками, кредитними картками та іншими
фінансовими установами, щоб дати вам повний огляд вашого
фінансового становища. Mint також пропонує ряд додаткових функцій,
таких як інструменти відстеження боргів, кредитної оцінки та
інвестування.
● Personal Capital
Personal Capital - це безкоштовний web-сервіс управління фінансами,
який пропонує широкий спектр функцій, включаючи відстеження
витрат, складання бюджету, інвестування та управління боргами.
Personal Capital також пропонує безкоштовні фінансові консультації
кваліфікованим фахівцем.
● YNAB
YNAB (You Need a Budget) - це платний web-сервіс управління
фінансами, який використовує метод нульового бюджетування, щоб
допомогти людям досягти своїх фінансових цілей. YNAB також
пропонує ряд додаткових функцій, таких як інструменти відстеження
витрат, кредитної оцінки та інвестування.
● Mvelopes
Mvelopes - це платний web-сервіс управління фінансами, який
використовує метод віртуальних конвертів, щоб допомогти людям
досягти своїх фінансових цілей. Mvelopes також пропонує ряд
12
додаткових функцій, таких як інструменти відстеження витрат,
кредитної оцінки та інвестування.
● Simplifier
Simplifier - це платний web-сервіс управління фінансами, який
пропонує широкий спектр функцій, включаючи відстеження витрат,
складання бюджету, інвестування та управління боргами.
13
2. Обґрунтування технічного завдання
2.1 Призначення розроблюваної інформаційної системи
Web-сервіс управління фінансами призначений для допомоги людям у
веденні їх фінансів. Він буде пропонувати базовий спектр функцій,
включаючи:
- Контроль доходів і витрат:
● Детальний облік: Дозволяє користувачам точно відстежувати всі
фінансові операції, включаючи доходи з різних джерел (зарплата,
інвестиції, тощо).
● Візуалізація: Надає зручні графіки, діаграми та звіти, які
допомагають візуально оцінити фінансовий стан,тенденції та
виявити області, де можна оптимізувати витрати.
2.2 Вимоги до дизайну web-ресурсу
Колірна гама:
● Web-сервіс буде використовувати чорну та білу колірну гаму, щоб
створити відчуття мінімалістичного сервісу.
● Акцентні кольори: червоний, зелений та синій, будуть
використовуватися для виділення важливих елементів.
Шрифти:
● Web-сервіс буде використовувати шрифт sans-serif, який легко
читається на всіх пристроях.
● Заголовки будуть використовуватися для виділення важливих розділів.
Принцип композиції:
● Web-сервіс буде використовувати принцип простоти та мінімалізму.
14
● Елементи будуть розташовані таким чином, щоб їх було легко знайти та
зрозуміти.
2.3 Структура сервера та сторінок
Логічна структура:
● Web-сервіс буде організований у монолітному дизайні, що полегшить
його розробку та обслуговування, так як сервіс є невеликим.
Фізична структура:
● Web-сервіс буде розміщено на сервері в хмарі.
● Це забезпечить масштабованість, надійність та безпеку.
Сторінки:
● Web-сервіс буде мати головну сторінку, яка буде відображати його
рахунки.
● Наступна сторінка буде сторінка виведення всіх транзакцій.
● Та сторінка аналітики, на якій будуть виведені графіки для аналізу
даних.
2.4 Навігація
● Web-сервіс буде використовувати вертикальне меню навігації, яке буде
розташоване вгорі кожної сторінки.
● Меню навігації буде містити посилання на всі основні функції
web-сервісу.
● Користувачі також зможуть отримувати доступ до інших сторінок,
використовуючи посилання на сторінках.
15
2.5 Наповнення сторінок
- Головна сторінка:
● Список рахунків:
○ Таблиця з переліком усіх рахунків користувача, включаючи
назву, тип, валюту та поточний баланс.
○ Кнопки для редагування та видалення рахунків.
● Створення нового рахунку:
○ Форма з полями для введення назви, типу, валюти та
початкового балансу.
● Детальна інформація про рахунок:
○ Назва, тип, валюта та поточний баланс рахунку.
● Створення нової транзакції для рахунку:
○ Форма з полями для введення суми, категорії, дати, опису,
тегів та вибору рахунку.
- Сторінка транзакцій:
● Список транзакцій:
○ Таблиця з переліком транзакцій з відображенням дати,
суми, категорії, опису та рахунку.
● Створення нової транзакції:
○ Форма з полями для введення суми, категорії, дати, опису,
тегів та вибору рахунку.
○ Можливість прикріплення фотографії чека.
○ Чіткі підказки та пояснення для кожного поля.
● Детальна інформація про транзакцію:
○ Дата, сума, категорія, опис та рахунок.
○ Можливість редагування та видалення транзакції.
16
- Сторінка звітів:
● Візуалізація звіту:
○ Таблиці з детальними даними.
○ Графіки та діаграми для наочного представлення
інформації.
2.6 Вимоги до прототипу розроблюваної системи
- Функціональні вимоги:
● Авторизація та реєстрація користувачів:
○ Вхід через облікові записи соціальних мереж.
● Облік доходів та витрат:
○ Додавання нових доходів та витрат з зазначенням суми,
категорії, дати та опису.
○ Редагування та видалення існуючих записів.
○ Перегляд історії операцій.
● Категоризація:
○ Налаштування користувацьких категорій доходів та витрат.
○ Використання стандартних категорій.
● Звіти та аналітика:
○ Генерація звітів про доходи та витрати.
○ Візуалізація даних у вигляді графіків та діаграм.
- Нефункціональні вимоги:
● Зручність використання:
○ Інтуїтивно зрозумілий інтерфейс.
○ Простота навігації та виконання основних дій.
17
● Продуктивність:
○ Швидке завантаження сторінок та виконання операцій.
○ Оптимізація для роботи на різних пристроях.
● Безпека:
○ Захист персональних даних користувачів.
○ Запобігання несанкціонованому доступу до даних.
○ Використання HTTPS для шифрування трафіку.
- Вимоги до прототипу:
● Візуальне оформлення:
○ Простий та зрозумілий дизайн.
○ Використання кольорової гами, що сприяє концентрації та
зручності сприйняття інформації.
● Функціональність:
○ Реалізація основних функцій, описаних у функціональних
вимогах.
○ Можливість тестування основних сценаріїв використання.
● Інтерактивність:
○ Можливість взаємодії користувача з елементами
інтерфейсу.
2.7 Техніко-економічне обґрунтування (ТЕО) доцільності створення
web-ресурсу
2.7.1 Ринок та конкуренція
- Глобальний ринок:
● Зростання ринку: Ринок веб-сервісів управління фінансами
18
(Personal Finance Management, PFM) дійсно демонструє значне
зростання. За прогнозами Statista, очікується, що він зросте з
$12,5 млрд у 2023 році до $22,4 млрд до 2028 року, що відповідає
середньорічному темпу зростання (CAGR) у 12,2%.
● Основні драйвери зростання:
○ Збільшення проникнення смартфонів та інтернету:
Більше людей отримують доступ до фінансових
інструментів онлайн та через мобільні додатки.
○ Зростаюча обізнаність про фінансову грамотність: Люди
все більше усвідомлюють важливість управління своїми
фінансами та шукають зручні інструменти для цього.
○ Технологічні інновації: Розвиток штучного інтелекту,
машинного навчання та аналітики даних відкриває нові
можливості для персоналізації та автоматизації фінансових
рішень.
- Конкуренція:
● Глобальні гравці:Mint, Personal Capital, YNAB (You Need A
Budget), Mvelopes та Simplifi є одними з найпопулярніших
PFM-сервісів у світі. Вони пропонують широкий спектр функцій,
включаючи відстеження витрат, бюджетування, планування цілей
та інвестиційні інструменти.
● Український ринок: В Україні також є кілька PFM-сервісів,
таких як Finance PM, Мої Гроші та Plin, а також мобільні банки
(Monobank, Privat24), які пропонують функції управління
фінансами.
● Конкурентні переваги вашого сервісу:Щоб виділитися на тлі
конкурентів, важливо зосередитися на унікальних перевагах
19
вашого продукту. Це можуть бути:
○ Спеціалізовані функції: Наприклад, інструменти для
фрілансерів, інвесторів або сімей.
○ Глибока інтеграція з українськими банками:
Автоматичний імпорт транзакцій, підтримка української
гривні та місцевих фінансових інститутів.
○ Розширені можливості аналітики: Використання
штучного інтелекту та машинного навчання для аналізу
фінансових даних та надання персоналізованих
рекомендацій.
○ Інноваційний дизайн та зручність використання:
Інтуїтивно зрозумілий інтерфейс, адаптивний дизайн для
різних пристроїв, гейміфікація для підвищення мотивації
користувачів.
Ринок веб-сервісів управління фінансами є конкурентним, але він також
пропонує значні можливості для нових гравців. Розробка унікального
продукту з акцентом на потреби українських користувачів та інноваційні
функції може допомогти вашому сервісу зайняти свою нішу на ринку та
досягти успіху.
2.7.2 Витрати на розробку
Загальний бюджет на розробку веб-сервісу оцінюється в 1 000 000 гривень.
Ця сума включає наступні основні категорії витрат:
- Заробітна плата розробників:
● Backend-розробники (Ruby on Rails): Відповідають за розробку
20
серверної частини додатку, логіки,взаємодії з базою даних тощо.
Залежно від досвіду та кваліфікації, їхні послуги можуть
коштувати від 40 000 до 80 000 гривень на місяць.
● Frontend-розробники: Відповідають за розробку інтерфейсу
користувача, верстку, дизайн та інтерактивність. Вартість їхніх
послуг також може варіюватися від 30 000 до 60 000 гривень на
місяць.
● QA-інженери: Відповідають за тестування та забезпечення якості
продукту. Їхня зарплата може становити від 25 000 до 45 000
гривень на місяць.
● Project Manager/Team Lead: Відповідає за координацію роботи
команди, планування та контроль виконання завдань. Зарплата
може варіюватися від 50 000 до 100 000 гривень на місяць.
- Витрати на хостинг та інфраструктуру:
● Хостинг: Вартість хостингу може залежати від обраного
провайдера, обсягу ресурсів (пам'ять, процесор,дисковий простір)
та рівня підтримки. Орієнтовна вартість може становити від 5 000
до 20 000 гривень на місяць.
● Доменне ім'я: Вартість реєстрації доменного імені зазвичай
становить від 100 до 500 гривень на рік.
● SSL-сертифікат: Для забезпечення безпеки передачі даних може
знадобитися SSL-сертифікат, вартість якого може становити від
500 до 5 000 гривень на рік.
- Витрати на маркетинг та просування:
● SEO-оптимізація: Для просування веб-сервісу в пошукових
системах може знадобитися SEO-оптимізація,вартість якої може
варіюватися від 10 000 до 50 000 гривень на місяць.
21
● Контекстна реклама: Для швидкого залучення користувачів
можна використовувати контекстну рекламу (Google Ads,
Facebook Ads тощо). Бюджет на контекстну рекламу може
становити від 5 000 до 50 000 гривень на місяць.
● SMM (Social Media Marketing): Просування у соціальних
мережах може допомогти збільшити впізнаваність бренду та
залучити нових користувачів. Вартість SMM-послуг може
варіюватися від 5 000 до 30 000 гривень на місяць.
● Контент-маркетинг: Створення корисного контенту (статті,
блоги, відео) може допомогти залучити та утримати користувачів.
Витрати на контент-маркетинг можуть становити від 10 000 до 50
000 гривень на місяць.
- Інші витрати:
● Ліцензії на програмне забезпечення: Якщо ви використовуєте
платні бібліотеки або інструменти розробки,вам потрібно буде
врахувати вартість ліцензій.
● Витрати на дизайн: Якщо ви замовляєте дизайн у професійного
дизайнера, це також потрібно врахувати у бюджеті.
● Непередбачені витрати: Завжди варто закладати певний резерв
на непередбачені витрати (наприклад, на виправлення помилок,
додаткові функції тощо).
2.7.3 Ризики
- Ринкові ризики:
● Конкуренція: Ринок PFM-сервісів досить насичений, як на
22
глобальному, так і на українському рівні. Нові конкуренти можуть
з'явитися будь-коли, пропонуючи інноваційні функції або більш
привабливі умови.
○ Стратегія пом'якшення: Постійний моніторинг
конкурентів, аналіз їхніх сильних та слабких
сторін,розробка унікальної ціннісної пропозиції, яка
виділить ваш сервіс серед інших.
● Зміни в ринкових умовах: Економічні кризи, зміни в
законодавстві або поява нових технологій можуть вплинути на
попит на PFM-сервіси або змінити вимоги користувачів.
○ Стратегія пом'якшення: Гнучке планування та адаптація
до змін, готовність до швидкого внесення змін у продукт,
диверсифікація джерел доходів.
- Технічні ризики:
● Помилки та збої: Програмне забезпечення може містити
помилки, які можуть призвести до неправильної роботи сервісу,
втрати даних або некоректної обробки транзакцій.
○ Стратегія пом'якшення: Ретельне тестування на всіх
етапах розробки, використання автоматизованих тестів,
моніторинг роботи сервісу в режимі реального часу, швидке
реагування на виявлені проблеми.
● Проблеми з безпекою: Хакерські атаки, витік даних або інші
вразливості можуть завдати серйозної шкоди репутації сервісу та
призвести до фінансових втрат.
○ Стратегія пом'якшення: Використання сучасних методів
захисту даних (шифрування, двофакторна аутентифікація),
регулярне оновлення програмного забезпечення,
23
проведення аудиту безпеки, навчання користувачів
правилам безпечної роботи з сервісом.
● Проблеми з продуктивністю: Зі зростанням кількості
користувачів або обсягу даних, сервіс може почати працювати
повільніше або навіть стати недоступним.
○ Стратегія пом'якшення: Оптимізація коду та бази даних,
використання кешування, масштабування інфраструктури
за потреби, моніторинг продуктивності та своєчасне
виявлення вузьких місць.
- Фінансові ризики:
● Недостатнє фінансування: Розробка та запуск веб-сервісу
вимагають значних фінансових вкладень.Нестача коштів може
призвести до затримки проекту або його закриття.
○ Стратегія пом'якшення: Ретельне планування бюджету,
пошук інвесторів або залучення кредитних коштів,
оптимізація витрат на розробку та маркетинг.
● Низька рентабельність: Якщо сервіс не зможе залучити
достатню кількість користувачів або генерувати достатній дохід,
він може стати нерентабельним.
○ Стратегія пом'якшення: Розробка ефективної
бізнес-моделі, пошук додаткових джерел доходів (реклама,
партнерські програми), оптимізація витрат.
- Операційні ризики:
● Відтік користувачів: Якщо користувачі будуть незадоволені
сервісом, вони можуть перейти до конкурентів.
○ Стратегія пом'якшення: Постійне покращення сервісу,
збір та аналіз відгуків користувачів, швидке реагування на
24
проблеми та запити.
● Проблеми з персоналом: Нестача кваліфікованих розробників,
відтік кадрів або конфлікти в команді можуть негативно вплинути
на розробку та підтримку сервісу.
○ Стратегія пом'якшення: Створення сприятливого
робочого середовища, мотивація співробітників,розробка
плану дій на випадок відтоку кадрів.
2.7.5 Висновок
На основі вищевикладеного, розробка web-сервісу управління фінансами є
доцільною. Web-сервіс має великий потенціал для успіху на ринку. Він буде
пропонувати ряд функцій, які не доступні на багатьох інших web-сервісах.
2.8 Показники якості
Показники якості web-сервісу управління фінансами будуть включати:
● Функціональність: Web-сервіс повинен мати всі необхідні функції для
управління фінансами користувачів.
● Простота використання: Web-сервіс повинен бути простим у
використанні, навіть для людей, які не мають досвіду роботи з
комп'ютером.
● Масштабованість: Web-сервіс повинен бути масштабованим, щоб він
міг рости разом з кількістю користувачів.
● Надійність: Web-сервіс повинен бути надійним і працювати
безперебійно.
● Безпека: Web-сервіс повинен бути безпечним і захищати дані
25
користувачів від несанкціонованого доступу.
● Доступність:Web-сервіс повинен бути доступним користувачам 24/7.
● Швидкість:Web-сервіс повинен працювати швидко та без затримок.
● Зручність використання: Web-сервіс повинен бути зручним для
користувачів.
● Задоволеність користувачів: Web-сервіс повинен задовольняти
потреби користувачів.
2.9 Параметри функціонування та надійності
Параметри функціонування та надійності web-сервісу управління фінансами
будуть включати:
● Час безвідмовного функціонування: Web-сервіс повинен працювати
без збоїв протягом 99,9% часу.
● Час відновлення: Web-сервіс повинен бути відновлений протягом 30
хвилин у разі збою.
● Навантаження на систему: Web-сервіс повинен мати можливість
обробляти 1000 запитів на секунду.
● Збереження даних: Дані користувачів повинні бути збережені
протягом 10 років.
2.10 Вимоги до хостингу
Web-сервіс управління фінансами буде розміщено на сервері в хмарі. Сервер
повинен мати такі або кращі характеристики:
● Процесор: Intel Xeon E5-2690v4
● Оперативна пам'ять: 128 ГБ
● Зберігання: 1 ТБ
26
● Пропускна здатність: 1 Гбіт/с
2.11 Структура та шаблон web-орієнтованої інформаційної системи
Web-сервіс управління фінансами буде використовувати трирівневу
архітектуру. Ця архітектура буде складатися з наступних рівнів:
● Презентаційний рівень: Цей рівень буде відповідати за відображення
інформації користувачам. Він буде реалізований за допомогою HTML,
CSS та JavaScript.
● Бізнес-рівень: Цей рівень буде відповідати за логіку роботи
web-сервісу. Він буде реалізований за допомогою мови програмування
Ruby.
● Рівень даних: Цей рівень буде відповідати за зберігання даних
web-сервісу. Він буде реалізований за допомогою PostgreSQL.
2.12 Функціональний опис
Web-сервіс управління фінансами буде пропонувати широкий спектр
функцій, включаючи:
● Відстеження доходів та витрат: Користувачі зможуть відстежувати
свої доходи та витрати за категоріями.
● Легку реєстрацію та авторизацію: Користувачі зможуть легко
реєструватися та авторизуватися за допомогою Google.
● Аналітику доходів та витрат: Користувачі зможуть легко
проаналізувати статистику по доходам та витратам за час користування
сервісом.
● Відстеження доходів та витрат:
○ Детальний облік:
27
■ Додавання нових записів про доходи та витрати з
зазначенням суми, категорії, дати, опису.
■ Редагування та видалення існуючих записів.
■ Перегляд історії операцій.
○ Категоризація:
■ Налаштування користувацьких категорій доходів та витрат.
■ Використання стандартних категорій.
Валютний конвертер:
■ Конвертація сум між різними валютами за актуальним
курсом.
Легка реєстрація та авторизація:
○ Реєстрація та вхід через Google:Швидка та зручна реєстрація та
вхід за допомогою облікового запису Google.
Аналітика доходів та витрат:
○ Звіти:
■ Генерація детальних звітів про доходи та витрати.
■ Візуалізація даних у вигляді інтерактивних графіків та
діаграм.
2.13 Сценарії використання
Web-сервіс управління фінансами буде використовуватися різними людьми,
включаючи:
● Фізичні особи: Фізичні особи зможуть використовувати web-сервіс для
28
відстеження своїх особистих фінансів.
- Фізичні особи:
● Відстеження особистих фінансів:
○ Щоденне ведення обліку: Додавання витрат на каву,
продукти, транспорт, розваги тощо.
○ Категоризація витрат: Використання опису для кращого
розуміння структури витрат.
○ Аналіз щомісячних звітів: Перегляд звітів за місяць, щоб
зрозуміти, на що витрачаються гроші та де можна
зекономити.
2.14 Структури даних
Web-сервіс управління фінансами буде використовувати такі структури
даних:
● Користувачі: Ця структура даних буде зберігати інформацію про
користувачів, таких як ім'я, адреса електронної пошти та пароль.
● Рахунки: Ця структура даних буде зберігати інформацію про рахунки
користувачів: номер рахунку, тип рахунку та залишок на рахунку.
● Транзакції: Ця структура даних буде зберігати інформацію про
транзакції користувачів: дата, сума та опис.
- Користувачі (Users):
● ID: Унікальний ідентифікатор користувача (зазвичай числове
значення, що генерується автоматично).
● Ім'я (Name): Ім'я користувача (можливо, ім'я та прізвище).
● Адреса електронної пошти (Email): Унікальна адреса
29
електронної пошти, яка використовується для входу та
ідентифікації користувача.
● Дата реєстрації (Registration Date): Дата та час реєстрації
користувача в системі.
- Рахунки (Accounts):
● ID: Унікальний ідентифікатор рахунку.
● ID користувача (User ID): Ідентифікатор користувача, якому
належить рахунок.
● Назва (Name): Назва рахунку (наприклад, "Основний",
"Ощадний", "Кредитна картка").
● Тип (Type): Тип рахунку (наприклад, "Готівковий",
"Банківський", "Інвестиційний").
● Валюта (Currency): Валюта рахунку (наприклад, "UAH", "USD",
"EUR").
● Початковий баланс (Starting Balance): Баланс рахунку на
момент його створення.
● Поточний баланс (Current Balance): Поточний баланс рахунку,
який оновлюється після кожної транзакції.
● Дата створення (Creation Date): Дата та час створення рахунку.
● Статус (Status - опціонально): Статус рахунку (наприклад,
"Активний", "Неактивний", "Заблокований").
- Транзакції (Transactions):
● ID: Унікальний ідентифікатор транзакції.
● ID рахунку (Account ID): Ідентифікатор рахунку, до якого
відноситься транзакція.
● Дата (Date): Дата транзакції.
● Сума (Amount): Сума транзакції (позитивне значення для доходу,
30
негативне для витрати).
● Категорія (Category): Категорія транзакції (наприклад,
"Харчування", "Транспорт", "Оренда").
● Опис (Description - опціонально): Додатковий опис транзакції.
2.15. Інструкції користувача
Ласкаво просимо до Balance!
Цей веб-додаток допоможе вам легко та ефективно управляти своїми
фінансами. Ось кілька простих кроків, які допоможуть вам розпочати:
1. Реєстрація та вхід:
● Увійдіть за допомогою облікового запису Google.
2. Додавання рахунків:
● Перейдіть на сторінку "Accounts".
● Натисніть кнопку "Create account".
● Введіть назву рахунку (наприклад, "Основний", "Ощадний") та валюту.
● Вкажіть початковий баланс рахунку.
● Натисніть кнопку "Create".
3. Додавання транзакцій:
● Перейдіть на сторінку "Accounts".
● Біля потрібного рахунку натисніть "Register Profit or Loss".
● Виберіть тип транзакції (дохід або витрата).
● Введіть суму, дату та опис.
31
● Натисніть кнопку "Create".
4. Перегляд та аналіз фінансів:
● Головна сторінка (Рахунки): На цій сторінці ви можете переглянути
список своїх рахунків, їх баланси та історію транзакцій.
● Транзакції: Тут ви можете переглянути список всіх своїх транзакцій,
відфільтрувати їх за різними параметрами та знайти потрібну
транзакцію за допомогою пошуку.
● Звіти: Ця сторінка дозволяє вам переглянути різні звіти про ваші
доходи та витрати, а також переглядати графіки та діаграми, які
допоможуть вам краще зрозуміти свої фінансові звички.
2.16 Висновок
Цей розділ описує технічні характеристики, показники якості, параметри
функціонування та надійності, а також інші вимоги, які висуваються до
розроблюваної в роботі інформаційної системи з технічної, економічної та
виробничої точок зору. Вимоги до інформаційної системи сформульовані на
основі аналізу аналогів, проведеного в першому розділі. Виконання вимог,
викладених у цьому розділі, буде продемонстровано в третьому розділі
кваліфікаційної роботи при тестуванні розробленої системи.
32
3. Розробка системи
3.1 Обґрунтовування вибору засобів реалізації системи
Інструменти web-розробки:
● Редактор коду: Vim
● Середовище розробки: Docker
● Локальний сервер: Puma
Мова web-програмування: Ruby
Фреймворк: Ruby/Ruby on Rails
База даних: PostgreSQL
- Ruby on Rails:
● Продуктивність: Rails дозволяє швидко створювати прототипи
та MVP (мінімально життєздатний продукт),що прискорює вихід
на ринок.
● Конвенція над конфігурацією: Rails має чіткі угоди про
структуру проекту та взаємодію компонентів, що зменшує
кількість рішень, які потрібно приймати розробникам, та спрощує
підтримку коду.
● ORM (ActiveRecord): Вбудований ORM забезпечує зручну
роботу з базою даних, дозволяючи писати запити на Ruby замість
SQL, що підвищує читабельність коду та зменшує ризик помилок.
● Величезна екосистема: Rails має велику спільноту розробників
та безліч готових бібліотек (gems), які можна легко інтегрувати в
проект, що економить час та зусилля.
● Підтримка TDD (Test-Driven Development): Rails заохочує
написання тестів перед розробкою функціональності, що
підвищує якість коду та полегшує рефакторинг.
33
- PostgreSQL:
● Надійність та стабільність: PostgreSQL відомий своєю
стабільністю та надійністю, що важливо для додатків, які
працюють з фінансовими даними.
● Підтримка ACID: PostgreSQL повністю підтримує ACID
(Atomicity, Consistency, Isolation, Durability), що гарантує
цілісність даних навіть у разі збоїв.
● Розширюваність: PostgreSQL добре масштабується як
вертикально (за рахунок збільшення ресурсів сервера), так і
горизонтально (за рахунок додавання нових серверів), що
дозволяє вашому додатку рости разом з бізнесом.
● Багатий функціонал: PostgreSQL підтримує широкий спектр
функцій, включаючи складні запити, тригери,stored procedures,
що дає вам більше гнучкості у розробці.
- Vim:
● Швидкість та ефективність: Vim дозволяє виконувати складні
операції редагування тексту за допомогою комбінацій клавіш, що
значно прискорює роботу досвідчених користувачів.
● Налаштування: Vim можна гнучко налаштувати під свої
потреби, додаючи плагіни, змінюючи колірні схеми та комбінації
клавіш.
● Доступність: Vim встановлений за замовчуванням на більшості
Unix-подібних систем, що робить його зручним інструментом для
роботи на серверах та віддалених машинах.
- Bootstrap:
● Готові компоненти: Bootstrap надає великий набір готових
компонентів інтерфейсу (кнопки, форми,таблиці, навігаційні
34
меню тощо), що прискорює розробку фронтенду.
● Адаптивний дизайн: Bootstrap дозволяє створювати сайти, які
добре виглядають на різних пристроях (комп'ютери, планшети,
смартфони).
● Grid system: Система сітки Bootstrap спрощує верстку сторінок
та дозволяє створювати складні макети.
- JavaScript:
● Інтерактивність: JavaScript дозволяє створювати динамічні
елементи інтерфейсу, які реагують на дії користувача, що робить
веб-додаток більш зручним та привабливим.
● Асинхронні запити: JavaScript дозволяє відправляти запити на
сервер без перезавантаження сторінки, що підвищує швидкість
роботи та покращує користувацький досвід.
● Широкі можливості: JavaScript можна використовувати для
створення складних веб-додатків, ігор, анімацій та інших
інтерактивних елементів.
- Docker:
● Ізоляція: Docker дозволяє створювати ізольовані контейнери для
кожного компонента вашого додатку (веб-сервер, база даних
тощо), що спрощує розгортання та запобігає конфліктам між
залежностями.
● Портативність: Docker-контейнери можна легко переносити між
різними середовищами (розробка,тестування, продакшн), що
забезпечує консистентність роботи додатку.
● Масштабованість: Docker спрощує масштабування додатку за
рахунок запуску додаткових контейнерів.
- Puma:
35
● Продуктивність: Puma - це швидкий та ефективний веб-сервер,
який добре працює з Ruby on Rails.
● Підтримка concurrency: Puma може обробляти кілька запитів
одночасно, що важливо для додатків з високим навантаженням.
3.2 Реалізація системи
Логічна структура web-додатку:
Web-додаток складається з наступних модулів:
● Модуль авторизації: Цей модуль дозволяє користувачам реєструватися
та входити в систему.
● Модуль створення рахунків : Цей модуль дозволяє користувачам
створювати рахунки.
● Модуль реєстрації доходів і розходів: Цей модуль дозволяє
користувачам створювати транзакції.
● Модуль аналітики: Цей модуль дозволяє користувачам аналізувати
дані які є в веб-додатку.
● Реєстрація:
○ Створення нового об'єкта користувача в базі даних.
○ Реєстрація за допомогою Google Auth
● Авторизація:
○ Авторизація за допомогою Google Auth
○ Створення сесії для авторизованого користувача.
● Створення рахунку:
○ Форма для введення назви рахунку, типу, валюти та початкового
балансу.
36
○ Валідація введених даних.
○ Створення нового об'єкта рахунку в базі даних.
● Перегляд рахунків:
○ Список рахунків користувача з відображенням назви, типу,
валюти та поточного балансу.
● Редагування рахунку:
○ Форма для зміни назви, типу та валюти рахунку.
○ Валідація введених даних.
○ Збереження змін в базі даних.
● Архівування/Видалення рахунку:
○ Можливість архівувати або видаляти рахунки (з урахуванням
збереження історії транзакцій).
● Створення транзакції:
○ Форма для введення суми, категорії, дати, опису (опціонально) та
прикріплення фото чека (опціонально).
○ Вибір рахунку, до якого відноситься транзакція.
○ Валідація введених даних.
○ Створення нового об'єкта транзакції в базі даних.
○ Оновлення поточного балансу відповідного рахунку.
● Перегляд транзакцій:
○ Список транзакцій з відображенням суми, категорії, дати, опису
та рахунку.
● Редагування транзакції:
○ Форма для зміни суми, категорії, дати, опису та прикріплення
фото чека.
○ Валідація введених даних.
○ Збереження змін в базі даних.
37
○ Оновлення поточного балансу відповідного рахунку.
● Видалення транзакції:
○ Можливість видалення транзакцій (з урахуванням оновлення
поточного балансу відповідного рахунку).
● Звіти:
○ Генерація звітів про доходи та витрати
○ Відображення звітів у вигляді таблиць та графіків.
● Графіки та діаграми:
○ Візуалізація розподілу витрат за категоріями (кругові діаграми).
○ Візуалізація динаміки доходів та витрат за певний період (лінійні
графіки).
3.2.1 Проектування структури web-додатку
● Огляд моделей даних: Діаграма сутність-зв'язок (ERD) або подібні
схеми, що представляють таблиці бази даних і їхні відношення.
● Архітектура додатку: Високорівневий опис архітектури додатку з
акцентом на використовувані технології (Ruby on Rails, PostgreSQL,
інтеграції з сторонніми сервісами, якщо є). Можна використати
UML-діаграму або блок-схему.
● Структура навігації: Графічне зображення ієрархії сторінок та пунктів
меню, що висвітлює логічний потік користувача.
● Мокапи (Wireframes): Чорно-білі ескізи деяких основних сторінок,
показуючи розміщення елементів без детального стилю.
38
Огляд моделей даних:
● Користувач (User):
○ Має багато Рахунків (Accounts).
○ Має багато Транзакцій (Transactions) через Рахунки.
● Рахунок (Account):
○ Належить одному Користувачу.
○ Має багато Транзакцій.
● Транзакція (Transaction):
○ Належить одному Рахунку.
Архітектура додатку:
● Frontend:
○ HTML, CSS, JavaScript: Для створення інтерфейсу користувача.
○ Bootstrap: Для стилізації та адаптивного дизайну.
● Backend:
○ Ruby on Rails: Фреймворк для розробки веб-додатку.
○ PostgreSQL: База даних для зберігання даних.
○ Puma: Веб-сервер для обробки запитів.
Структура навігації:
● Головна сторінка: Огляд фінансового стану, останні транзакції,
швидкий доступ до основних функцій.
● Рахунки: Список рахунків, створення нового рахунку, перегляд та
редагування рахунку.
● Транзакції: Список транзакцій, створення нової транзакції, фільтрація
та пошук.
39
● Звіти: Генерація звітів за період, категоріями, рахунками.
Мокапи (Wireframes):
● Головна сторінка: Відображення балансу рахунків, графік витрат за
категоріями, останні транзакції.
● Створення транзакції: Форма з полями для суми, категорії, дати,
опису та вибору рахунку.
● Перегляд звіту: Таблиця з даними про доходи та витрати за вибраний
період, графік розподілу витрат за категоріями.
3.2.2 Фізична структура web-додатку
Web-додаток складається з наступних каталогів:
- app: Містить основний код вашого веб-додатку, розділений на кілька
підкаталогів:
● assets: Зберігає статичні файли: JavaScript, CSS та зображення,
які використовуються для оформлення інтерфейсу користувача.
○ images: Зберігає зображення: логотипи, іконки, фонові
зображення тощо.
○ javascripts: Зберігає файли JavaScript, які відповідають за
інтерактивність та динаміку веб-сторінок.
○ stylesheets: Зберігає файли CSS, які визначають стилі та
зовнішній вигляд елементів веб-сторінок.
○ channels: Використовується для створення
WebSocket-каналів для реалізації функціональності
реального часу (наприклад, чати, оновлення даних у
40
реальному часі).
○ controllers:Містить контролери, які обробляють запити від
користувачів, взаємодіють з моделями та формують
відповіді.
○ helpers:Містить допоміжні методи, які можуть бути
використані у в'юхах (views) для спрощення коду та
підвищення його читабельності.
○ mailers: Використовується для створення та відправки
електронних листів (наприклад, повідомлення про
реєстрацію, підтвердження замовлення, відновлення
пароля).
○ models:Містить моделі, які представляють сутності вашої
бази даних (наприклад, користувачі, рахунки,транзакції) та
визначають бізнес-логіку вашого додатку.
○ views:Містить шаблони веб-сторінок, які
використовуються для формування HTML-коду, що
відправляється користувачам.
- bin: Містить виконувані файли: rails, rake, bundle та інші, які
використовуються для запуску та управління вашим додатком.
- config: Містить конфігураційні файли, які визначають налаштування
вашого додатку:
● application.rb: Основний конфігураційний файл, де можна
налаштувати загальні параметри додатку.
● database.yml: Налаштування підключення до бази даних.
● environment.rb: Налаштування, специфічні для різних
середовищ (розробка, тестування, продакшн).
● routes.rb: Визначення маршрутів для вашого додатку, які
41
пов'язують URL-адреси з контролерами та діями.
- db:Містить файли, пов'язані з базою даних:
● migrate:Містить міграції, які використовуються для створення та
зміни структури бази даних.
● schema.rb: Файл, який описує поточну структуру бази даних.
● seeds.rb: Використовується для заповнення бази даних
початковими даними.
- lib:Містить власний код, який не входить до інших категорій.
● assets:Містить власні бібліотеки JavaScript або CSS.
● tasks:Містить власні Rake-завдання для автоматизації різних
процесів.
- log: Містить журнали, які записують інформацію про роботу вашого
додатку, помилки та попередження.
- public: Містить статичні файли, які доступні безпосередньо через
веб-сервер:
● 404.html: Сторінка помилки "Не знайдено".
● 422.html: Сторінка помилки "Неприпустимий запит".
● 500.html: Сторінка помилки "Внутрішня помилка сервера".
● favicon.ico: Іконка, яка відображається у вкладці браузера.
● robots.txt: Файл, який вказує пошуковим роботам, які сторінки
можна індексувати.
- storage: Зазвичай використовується для зберігання завантажених
користувачами файлів (наприклад,фотографій, документів).
- test:Містить тести для вашого додатку.
- tmp: Використовується для зберігання тимчасових файлів, таких як
кеш, сесії, pid-файли.
- vendor: Містить сторонні бібліотеки та асети, які не встановлені через
42
менеджер пакетів.
3.2.3 Дизайн web-додатку
Web-додаток був розроблений з урахуванням наступних принципів дизайну:
● Простота: Web-додаток повинен бути простим у використанні та
зрозумілим для користувачів.
● Функціональність: Web-додаток повинен пропонувати всі необхідні
функції для управління фінансами користувачів.
● Візуальна привабливість: Web-додаток повинен бути візуально
привабливим та приємним для користувачів.
● Відповідність: Web-додаток повинен бути адаптивним та працювати на
всіх пристроях.
- Простота:
● Інтуїтивно зрозумілий інтерфейс: Навігація повинна бути
простою та логічною, щоб користувачі могли легко знаходити
потрібні функції та інформацію. Використовуйте зрозумілі іконки
та текстові підказки.
● Мінімалістичний дизайн: Уникайте зайвих елементів, які
можуть відволікати увагу користувачів.Використовуйте достатньо
білого простору, щоб сторінки виглядали чистими та
організованими.
● Чітка візуальна ієрархія: Виділяйте важливу інформацію за
допомогою розміру шрифту, кольору та розташування елементів.
Використовуйте заголовки, підзаголовки та списки для
структурування контенту.
43
● Легкість введення даних: Форми повинні бути простими та
зручними для заповнення. Використовуйте підказки та
автоматичне заповнення полів, де це можливо.
- Функціональність:
● Основні функції:
○ Відстеження доходів та витрат: Додавання, редагування та
видалення транзакцій, категоризація,фільтрація та пошук.
○ Управління рахунками: Створення, редагування та
видалення рахунків, перегляд балансу та історії транзакцій.
○ Аналітика: Генерація звітів, перегляд графіків та діаграм,
аналіз фінансових тенденцій.
○ Валютний конвертер: Конвертація сум між різними
валютами.
- Візуальна привабливість:
● Кольорова гамма: Використовуйте приємну та гармонійну
кольорову гамму, яка відповідає тематиці фінансів.
● Типографіка: Виберіть чіткий та читабельний шрифт, який
добре виглядає на різних розмірах екранів.Використовуйте різні
розміри та накреслення шрифту для виділення заголовків та
важливої інформації.
● Анімація та мікроінтеракції: Додайте ненав'язливі анімації та
мікроінтеракції, щоб зробити інтерфейс більш живим та цікавим.
- Адаптивність (Responsive Design):
● Мобільна верстка: Веб-додаток повинен коректно
відображатися та працювати на різних мобільних пристроях
(смартфони, планшети).
● Різні розміри екранів: Дизайн повинен адаптуватися до різних
44
розмірів екранів, щоб забезпечити оптимальний користувацький
досвід на будь-якому пристрої.
● Швидкість завантаження: Оптимізуйте зображення та інші
ресурси, щоб забезпечити швидке завантаження сторінок на
мобільних пристроях з повільним інтернет-з'єднанням.
3.3 Тестування системи
Тестування web-додатку проводилося за допомогою наступних методів:
● Тестування верстки: Тестування верстки web-додатку проводилося
для того, щоб переконатися, що всі елементи web-додатку
відображаються правильно на всіх пристроях.
● Функціональне тестування: Функціональне тестування web-додатку
проводилося для того, щоб переконатися, що всі функції web-додатку
працюють правильно.
● Негативне тестування: Негативне тестування web-додатку
проводилося для того, щоб переконатися, що web-додаток стійкий до
несподіваних входів.
● Еквівалентні тести: Еквівалентні тести web-додатку проводилися для
того, щоб переконатися, що web-додаток працює правильно, коли
вводяться різні дані.
● Usability тестування: Usability тестування web-додатку проводилося
для того, щоб переконатися, що web-додаток простий у використанні та
зрозумілий для користувачів.
● Навігаційне тестування: Навігаційне тестування web-додатку
проводилося для того, щоб переконатися, що користувачі можуть легко
45
знайти потрібну їм інформацію.
● Тестування зручності використання: Тестування зручності
використання web-додатку проводилося для того, щоб переконатися, що
web-додаток зручний для користувачів.
● Тестування UI: Тестування UI web-додатку проводилося для того, щоб
переконатися, що інтерфейс web-додатку візуально привабливий та
простий у використанні.
● Тестування сумісності: Тестування сумісності web-додатку
проводилося для того, щоб переконатися, що web-додаток працює
правильно у різних web-переглядачах.
● кросбраузерне тестування: Кросбраузерне тестування web-додатку
проводилося для того, щоб переконатися, що web-додаток працює
правильно на різних операційних системах та різних браузерах.
● Тестування БД: Тестування БД web-додатку проводилося для того,
щоб переконатися, що дані web-додатку зберігаються та отримуються
правильно.
● Тестування продуктивності, навантаження та стабільності:
Тестування продуктивності, навантаження та стабільності web-додатку
проводилося для того, щоб переконатися, що web-додаток здатний
обробляти великі обсяги трафіку та зберігати стабільність під
навантаженням.
● Стрес-тестування: Стрес-тестування web-додатку проводилося для
того, щоб визначити точки відмови web-додатку та його межі
продуктивності.
● Об'ємне тестування: Об'ємне тестування web-додатку проводилося
для того, щоб переконатися, що web-додаток здатний обробляти великі
46
обсяги даних.
● Тестування паралелізму: Тестування паралелізму web-додатку
проводилося для того, щоб переконатися, що web-додаток здатний
обробляти кілька запитів одночасно.
● Тестування безпеки: Тестування безпеки web-додатку проводилося
для того, щоб виявити будь-які вразливості в web-додатку та захистити
його від атак.
Результати тестування показали, що web-додаток відповідає вимогам, які
були поставлені в другому розділі кваліфікаційної роботи.
3.4 Порівняння з аналогами
Web-додаток був порівняний з аналогічними web-додатками, які були
проаналізовані в першому розділі кваліфікаційної роботи. Порівняння
показало, що web-додаток пропонує базовий спектр функцій та є зручним
у використанні.
Економічний ефект від впровадження web-додатку досить високий.
Web-додаток допомагає користувачам заощадити гроші, покращуючи їх
фінансове становище.
Приклади графічного контенту: Навести конкретні приклади графіків,
діаграм, чи інших візуальних елементів, включених в додаток (скріншоти чи
мініатюри)
47
Висновки
1. Досягнення мети
В ході виконання кваліфікаційної роботи було досягнуто мети, що полягала в
розробці web-додатку для управління фінансами. Web-додаток відповідає
всім вимогам, які були поставлені у другому розділі кваліфікаційної роботи.
2. Отримані результати
● Проаналізовано існуючі web-додатки для управління фінансами. На
основі аналізу було визначено недоліки існуючих web-додатків та
сформульовано вимоги до розробленого web-додатку.
● Розроблено web-додаток для управління фінансами, який пропонує
широкий спектр функцій, простий у використанні та має зручний
інтерфейс.
● Спроектовано структуру web-додатку, яка включає модулі
авторизації, модуль створення рахунків, модуль реєстрації доходів і
розходів, модуль аналітики.
● Розроблено інтерфейс web-додатку, який відповідає принципам
простоти, функціональності, візуальної привабливості та адаптивності.
● Наповнено web-додаток текстовим та графічним контентом.
● Протестовано web-додаток за допомогою різних методів тестування.
Тестування показало, що web-додаток відповідає вимогам, які були
поставлені у другому розділі кваліфікаційної роботи.
● Обґрунтовано вибір засобів реалізації web-додатку. Ruby on Rails,
PostgreSQL, Vim, Bootstrap та JavaScript були обрані як найбільш
підходящі інструменти для розробки web-додатку.
48
3. Прогнозована ефективність web-додатку
Очікується, що web-додаток буде мати високу ефективність. Web-додаток
допоможе користувачам заощадити гроші, покращити їх фінансове
становище та приймати більш обґрунтовані фінансові рішення.
4. Рекомендації щодо подальшого використання
Web-додаток може бути використаний для управління особистими фінансами,
фінансами сімей. Web-додаток може бути доопрацьований за рахунок
додавання нових функцій, наприклад, функцій для спільного управління
фінансами, функцій для аналітики даних, функцій для інтеграції з іншими
web-додатками.
5. Потенціал для розвитку:
Веб-додаток має значний потенціал для подальшого розвитку та розширення
функціональності. Можливі напрямки розвитку:
● Інтеграція з іншими сервісами: Підключення до платіжних систем,
інвестиційних платформ,бухгалтерських програм тощо.
● Розширення аналітичних можливостей: Використання штучного
інтелекту та машинного навчання для аналізу фінансових даних та
надання персоналізованих рекомендацій.
● Гейміфікація: Впровадження елементів гри для підвищення мотивації
користувачів та заохочення досягнення фінансових цілей.
● Спільнота та соціальні функції: Створення спільноти користувачів
для обміну досвідом та порадами,можливість створення спільних
бюджетів та цілей.
49
Список використаних джерел
Rails 7: Up and Running: A Comprehensive Guide to Building Web
Applications with Ruby on Rails by Michael Hartl
The Well-Grounded Rubyist by David A. Black
PostgreSQL: The Complete Developer's Guide by Marc Lemke and David P.
Voorhis
Vim for Dummies by Bill Ball and Brian Jepson
Docker: Up and Running: Building, Running, and Managing Containers by
Adrian Mouat, Ben Firsh, and Andrew Newdigate
Building a Web Application with Ruby on Rails and PostgreSQL by Michael
Hartl (https://guides.rubyonrails.org/)
Managing Finances with a Ruby on Rails Web Application by Jim Weirich
(https://github.com/topics/personal-finance?l=ruby)
Using Docker to Deploy Ruby on Rails Applications by Segun Adebayo
(https://medium.com/@patrykrogedu/setting-up-docker-for-local-development-wit
h-ruby-on-rails-cd8698668871)
Vim for Finance Professionals by Chris Bates
(https://stackoverflow.com/questions/tagged/vim)
Ruby on Rails official website (https://guides.rubyonrails.org/)
PostgreSQL official website (https://www.postgresql.org/)
Vim official website (https://www.vim.org/)
Docker official website (https://www.docker.com/)
Ruby on Rails GitHub repository (https://github.com/rails/rails)
50
Додаток А
Код моделей веб-сервісу:
User
class User < ApplicationRecord
has_secure_password
has_many :accounts
has_many :transactions, through: :accounts
validates :email, presence: true, uniqueness: true
validates :username, presence: true, uniqueness: true
end
Account
frozen_string_literal: true
# Stores the total value of a single account.
class Account < ApplicationRecord
# Constants
CATEGORIES = [
'Bank Account',
'Saving Account',
'Investing Account',
].freeze
CURRENCIES = [
'USD',
'EUR',
'UAH',
].freeze
51
enum category: CATEGORIES
enum currency: CURRENCIES
# Concerns
include Archivable
# Model Validation
validates :name, :category, presence: true
validates :category, inclusion: { in: CATEGORIES }
validates :currency, inclusion: { in: CURRENCIES }
# Model Relationships
belongs_to :user
has_many :transactions, dependent: :destroy
monetize :balance_cents, with_model_currency: :currency,
numericality: { greater_than_or_equal_to: 0 }
# Account Methods
def montly_profit_and_losses
current_period =
Date.today.beginning_of_month..Date.today.end_of_month
p_and_l = transactions.where(date:
current_period).group(:operation).sum(:amount_cents)
result = p_and_l.map do |k,v|
symbol = k == 'profit' ? '+' : '-'
"#{symbol}#{v}".to_i
end.reduce(:+)
Money.new(result, currency)
end
def total_spent
52
@total_spent ||= begin
transactions.sum(:amount)
end
end
def spent_in_time_period(start_date, end_date)
@spent_in_time_period ||= begin
transactions.where(date:
start_date..end_date).sum(:amount)
end
end
def average_spent_over_time_period(start_date, end_date)
@average_spent_over_time_period ||= begin
spent_in_time_period(start_date, end_date) /
(end_date - start_date + 1.0)
end
end
def category_name
category.titleize
end
end
Transaction
# frozen_string_literal: true
class Transaction < ApplicationRecord
belongs_to :account
belongs_to :user
delegate :currency, to: :account
53
enum operation: %i[profit loss]
validates :amount, :operation, :date, presence: true
validates :amount, numericality: true
monetize :amount_cents, with_model_currency: :currency
monetize :initial_balance_cents, with_model_currency:
:currency
def remaining_balance
initial_balance + amount
end
def correct_amount
profit? ? amount : -amount
end
end
Код для контролерів
ApplicationController
# frozen_string_literal: true
# Main application controller for Balance.
class ApplicationController < ActionController::Base
protect_from_forgery with: :exception
layout "layouts/application"
def current_user
@current_user ||= User.find(session[:user_id]) if
session[:user_id]
end
54
def logged_in?
current_user
end
private
def empty_response_or_root_path(path = root_path)
respond_to do |format|
format.html { redirect_to path }
format.js { head :ok }
format.json { head :no_content }
end
end
end
AccountsController
# frozen_string_literal: true
# Allows users to modify and edit existing accounts.
class AccountsController < AuthorizedController
before_action :find_account_or_redirect, only: [:update,
:destroy]
# GET /accounts
def index
@accounts =
current_user.accounts.current.page(params[:page]).per(10)
end
# GET /accounts/new
def new
55
@account = current_user.accounts.new
end
# POST /accounts
def create
@account = current_user.accounts.new(account_params)
if @account.save
redirect_to root_path, notice: "Account was
successfully created."
else
render :new
end
end
# PATCH /accounts/1
def update
if @account.update(account_params)
redirect_to root_path, notice: 'Account was
successfully updated.'
end
end
# DELETE /accounts/1
def destroy
@account.archive
redirect_to root_path, notice: "Account was
successfully archived."
end
private
def find_account_or_redirect
@account = current_user.accounts.find_by(id:
56
params[:id])
redirect root_path unless @account
end
def account_params
account_params = params.require(:account).permit(:name,
:category, :due_date, :currency, :balance_cents)
normalize_params(account_params)
end
def normalize_params(account_params)
account_params[:balance_cents] =
account_params[:balance_cents].to_f * 100
account_params[:due_date] =
Date.strptime(account_params[:due_date], "%d/%m/%Y") if
account_params[:due_date].present?
account_params
end
end
TransactionsController
# frozen_string_literal: true
class TransactionsController < AuthorizedController
before_action :load_account, only: [:create]
def index
@transactions =
current_user.transactions.page(params[:page]).per(10)
end
def create
57
Transaction.transaction do
@transaction =
@account.transactions.new(transaction_params)
symbol = @transaction.profit? ? "+" : "-"
updated_balance =
@transaction.initial_balance_cents.send(symbol,
@transaction.amount_cents)
if @transaction.save!
@account.update!(balance_cents: updated_balance)
redirect_to root_path, notice: "Transaction was
successfully created."
else
redirect_to root_path, alert: "Transaction was not
created."
end
end
end
def destroy
@transaction =
current_user.transactions.find(params[:id])
Transaction.transaction do
symbol = @transaction.profit? ? "-" : "+"
updated_balance =
@transaction.account.balance_cents.send(symbol,
@transaction.amount_cents)
@transaction.account.update!(balance_cents:
updated_balance)
@transaction.update!(cancelled: true)
end
redirect_to transactions_path
end
58
private
def transaction_params
transaction_params =
params.require(:transaction).permit(:amount_cents,
:operation, :comment, :date, :user_id)
normalize_params(transaction_params)
end
def normalize_params(transaction_params)
transaction_params[:amount_cents] =
transaction_params[:amount_cents].to_f * 100
transaction_params[:initial_balance_cents] =
@account.balance_cents
transaction_params[:operation] =
Transaction.operations.invert[transaction_params[:operation
].to_i]
transaction_params
end
def load_account
@account = current_user.accounts.find_by(id:
params[:transaction][:account_id])
end
end
AuthorizedController
# frozen_string_literal: true
class AuthorizedController < ApplicationController
before_action :authenticate_user!
59
private
def authenticate_user!
redirect_to login_path unless current_user
end
end
SessionsController
# frozen_string_literal: true
class SessionsController < ApplicationController
def new
if logged_in?
redirect_to root_path
end
end
def omniauth
@user = User.find_or_create_by(uid:
request.env['omniauth.auth']['uid'], provider:
request.env['omniauth.auth']['provider']) do |u|
u.username =
request.env['omniauth.auth']['info']['name']
u.email =
request.env['omniauth.auth']['info']['email']
u.password = SecureRandom.hex(10)
end
if @user.valid?
session[:user_id] = @user.id
redirect_to root_path
else
render :new
60
end
end
def destroy
session.delete :user_id
redirect_to root_path
end
end
DashboardController
# frozen_string_literal: true
class DashboardController < AuthorizedController
def index
transactions =
current_user.transactions.where(cancelled: false)
@capitalization =
transactions.select("DATE_TRUNC('month', date) AS
month_year, SUM(CASE operation WHEN 0 THEN amount_cents
ELSE -amount_cents END) AS
total_amount").group("DATE_TRUNC('month',
date)").order("month_year")
@capitalization = @capitalization.map { |c|
[c.month_year.strftime('%b %Y'), c.total_amount.to_f / 100]
}
@account_allocations =
current_user.accounts.group(:currency).sum(:balance_cents).
map { |k, v| [k, v.to_f / 100] }
end
end
61
Код view елементів
Accounts:
index.html.haml
- content_for :header do
.float-right
= link_to plus_or("New Account"), new_account_path,
class: "btn btn-primary btn-shadow"
- if @current_user
= link_to logout_path, method: :delete, class: "btn
btn-primary btn-shadow" do
Sign out
- else
= link_to login_path, class: "btn btn-primary
btn-shadow" do
Sign in
= render "internal/tabs"
- content_for :breadcrumbs do
= render "layouts/per_page_breadcrumbs", per_page: 10,
object_count: @accounts.total_count
%ol
%li.breadcrumb-muted Accounts
- if @accounts.present?
.dashboard-container.dashboard-table
%table.table.table-striped.table-borderless.table-hover.tab
le-sticky
%thead
%tr
%th Name
62
%th Category
%th Balance
%th Balance in USD
%th Currency
%th Monthly P&L
%th Due date
%th Actions
%tbody
- @accounts.each do |account|
%tr
%td= link_to account.name, account
%td= account.category_name
%td= humanized_money_with_symbol
account.balance
%td= humanized_money_with_symbol
account.balance.exchange_to(:usd)
%td= account.currency
%td{style: "color:
#{account.montly_profit_and_losses > 0 ? "green" :
"red"}"}= "#{account.montly_profit_and_losses > 0 ? "+" :
"-"} #{humanized_money_with_symbol
account.montly_profit_and_losses}"
%td= account.due_date&.strftime("%b %d, %Y")
%td
= link_to account, method: :delete, data: {
confirm: "Are you sure?" }, class: "btn btn-danger btn-sm
mr-2" do
Archive
%button.btn.btn-primary.btn-sm{type:
"button", "data-toggle": "modal", "data-target":
"#registerProfitOrLoss"} Register Profit or Loss
63
%div.modal.fade#registerProfitOrLoss{tabindex:" -1", role:
"dialog", 'aria-labelledby': "exampleModalLabel",
'aria-hidden': true}
%div.modal-dialog{role: "document"}
%div.modal-content
%div.modal-header
%h5.modal-title#exampleModalLable=
"Register Profit Or Loss For #{account.name}"
%button.close{type: "button",
'data-dismiss': "modal", 'aria-label': "Close"}
%span{'aria-hidden': "true"}
×
%div.modal-body
= form_for account.transactions.new,
url: transactions_path, method: :post do |f|
= f.hidden_field :account_id,
value: account.id
= f.hidden_field :user_id, value:
@current_user.id
.form-group
= f.label :operation
= f.select :operation,
Transaction.operations.transform_keys(&:capitalize), {},
class: "form-control custom-select"
.form-group
= f.label :amount_cents, "Amount
(#{account.currency})"
= f.number_field :amount_cents,
step: '0.01', class: "form-control"
.form-group
= f.label :date
= f.date_field :date, value:
Date.today, class: "form-control"
64
.form-group
= f.label :comment
= f.text_area :comment, class:
"form-control"
.form-group
= f.submit "Submit", class: "btn
btn-primary"
.center-horizontally= paginate @accounts, theme:
"bootstrap"
- else
.jumbotron.jumbotron-custom-text
= icon("far", "clone", class: "mr-1")
No accounts found.
:javascript
$('#registerProfitOrLoss').on('show.bs.modal', function
(event) {
setTimeout(() =>
$(document.body.children).last().remove(), 200)
$('<div />', {
class: 'modal-backdrop fade show',
}).appendTo(".table");
})
$('#registerProfitOrLoss').on('hidden.bs.modal',
function (event) {
$(".modal-backdrop").remove();
})
65
new.html.haml
- @title = "New Account"
= render "internal/tabs"
- content_for :breadcrumbs do
%ol
%li= link_to "accounts", accounts_path
%li.breadcrumb-muted new
.dashboard-container= render "accounts/form", account:
@account
edit.html.haml
- @title = "Edit Account - #{@account.name_was}"
- content_for :header, @account.name_was
= render "internal/tabs"
- content_for :breadcrumbs do
%ol
%li= link_to "accounts", accounts_path
%li= link_to @account.name_was.to_s.downcase, @account
%li.breadcrumb-muted edit
- content_for :sidebar, render("internal/sidebar_setup")
.dashboard-container= render "accounts/form", account:
@account
66
_form.html.haml
= form_with model: account, local: true do |form|
= render "forms/horizontal/text_field", form: form,
object: account, key: :name
= render "forms/horizontal/select", form: form, object:
account, key: :category, options: Account::CATEGORIES
= render "forms/horizontal/number_field", form: form,
object: account, key: :balance_cents, key_name: 'Initial
balance'
= render "forms/horizontal/select", form: form, object:
account, key: :currency, options: Account::CURRENCIES,
key_name: 'Balance currency'
= render "forms/horizontal/date_field", form: form,
object: account, key: :due_date
= render "forms/horizontal/submit", form: form, object:
account
Dashboard:
index.html.haml
- content_for :header do
.float-right
- if @current_user
= link_to logout_path, method: :delete, class: "btn
btn-primary btn-shadow" do
Sign out
- else
= link_to login_path, class: "btn btn-primary
btn-shadow" do
Sign in
= render "internal/tabs"
- content_for :breadcrumbs do
67
%ol
%li.breadcrumb-muted Dashboard
%p Capitalization
= line_chart @capitalization
%p Account Allocation
= pie_chart @account_allocations
Sessions:
new.html.haml
<script src="https://accounts.google.com/gsi/client"
async></script>
<section class="vh-100 gradient-custom">
<div class="container py-5 h-100">
<div class="row d-flex justify-content-center
align-items-center h-100">
<div class="col-12 col-md-8 col-lg-6 col-xl-5">
<div class="card bg-dark text-white"
style="border-radius: 1rem;">
<div class="card-body p-5 text-center">
<div class="mb-md-5 mt-md-4 pb-5">
<h2 class="fw-bold mb-2
text-uppercase">Balance</h2>
<h4>Welcome!</h4>
<p>Balance doesn't store e-mail and name from
your trusted provider to keep you anonymous.</p>
<%= button_to "Sign in with Google",
"auth/google_oauth2", method: :post, class: "btn
68
btn-outline-light btn-lg px-5" %>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Transactions
index.html.haml
- content_for :header do
.float-right
- if @current_user
= link_to logout_path, method: :delete, class: "btn
btn-primary btn-shadow" do
Sign out
- else
= link_to login_path, class: "btn btn-primary
btn-shadow" do
Sign in
= render "internal/tabs"
- content_for :breadcrumbs do
= render "layouts/per_page_breadcrumbs", per_page: 10,
object_count: @transactions.total_count
%ol
%li.breadcrumb-muted Transactions
- if @transactions.present?
.dashboard-container.dashboard-table
69
%table.table.table-striped.table-borderless.table-hover.tab
le-sticky
%thead
%tr
%th Date
%th Operation
%th Account Name
%th Initial Balance
%th Sum
%th Remaining Balance
%th Comment
%th Actions
%tbody
- @transactions.each do |transaction|
%tr
%td= transaction.date.strftime("%b %d, %Y")
%td= transaction.operation
%td= transaction.account.name
%td= humanized_money_with_symbol
transaction.initial_balance
%td{style: "color: #{transaction.profit? ?
"green" : "red"}"}= "#{transaction.profit? ? "+" :
"-"}#{humanized_money_with_symbol transaction.amount}"
%td= humanized_money_with_symbol
transaction.remaining_balance
%td= transaction.comment
%td
- if transaction.cancelled == false
= link_to transaction, method: :delete,
data: { confirm: "Are you sure?" }, class: "btn btn-danger
btn-sm mr-2" do
Cancel
70
.center-horizontally= paginate @transactions, theme:
"bootstrap"
- else
.jumbotron.jumbotron-custom-text
= icon("far", "clone", class: "mr-1")
No transactions found.
71
Додаток Б
Код міграцій для бази даних
Створення Users
class CreateUsers < ActiveRecord::Migration[6.1]
def change
create_table :users do |t|
t.string :username
t.string :email
t.string :password_digest
t.string :uid
t.string :provider
t.timestamps
end
end
end
Створення Accounts
class CreateAccounts < ActiveRecord::Migration[6.1]
def change
create_table :accounts do |t|
t.integer :user_id, null: false
t.string :name, null: false
t.boolean :archived, null: false, default: false,
index: true
t.integer :category, null: false, default: 0
t.integer :balance_cents, precision: 10, scale: 2,
null: false, default: 0.0
t.integer :currency, null: false, default: 0
t.date :due_date
t.timestamps
72
end
end
end
Створення Transactions
class CreateTransactions < ActiveRecord::Migration[6.1]
def change
create_table :transactions do |t|
t.date :date, null: false
t.string :comment
t.integer :amount_cents, precision: 10, scale: 2,
null: false, default: 0
t.references :account, null: false, foreign_key:
true, index: true
t.references :user, null: false, foreign_key: true,
index: true
t.boolean :cancelled, null: false, default: false
t.integer :initial_balance_cents, precision: 10,
scale: 2, default: 0.0
t.integer :operation, default: 0
t.timestamps
end
end
end
73
Оновлення indexes
class UpdateIndexes < ActiveRecord::Migration[6.1]
def change
add_index :accounts, :name, unique: true
add_index :users, :email, unique: true
end
end
Схема бази даних
ActiveRecord::Schema.define(version: 2024_04_06_165705) do
# These are extensions that must be enabled in order to
support this database
enable_extension "plpgsql"
create_table "accounts", force: :cascade do |t|
t.integer "user_id", null: false
t.string "name", null: false
t.boolean "archived", default: false, null: false
t.integer "category", default: 0, null: false
t.integer "balance_cents", default: 0, null: false
t.integer "currency", default: 0, null: false
t.date "due_date"
t.datetime "created_at", precision: 6, null: false
t.datetime "updated_at", precision: 6, null: false
t.index ["archived"], name:
"index_accounts_on_archived"
t.index ["name"], name: "index_accounts_on_name",
unique: true
end
create_table "transactions", force: :cascade do |t|
74
t.date "date", null: false
t.string "comment"
t.integer "amount_cents", default: 0, null: false
t.bigint "account_id", null: false
t.bigint "user_id", null: false
t.boolean "cancelled", default: false, null: false
t.integer "initial_balance_cents", default: 0
t.integer "operation", default: 0
t.datetime "created_at", precision: 6, null: false
t.datetime "updated_at", precision: 6, null: false
t.index ["account_id"], name:
"index_transactions_on_account_id"
t.index ["user_id"], name:
"index_transactions_on_user_id"
end
create_table "users", force: :cascade do |t|
t.string "username"
t.string "email"
t.string "password_digest"
t.string "uid"
t.string "provider"
t.datetime "created_at", precision: 6, null: false
t.datetime "updated_at", precision: 6, null: false
t.index ["email"], name: "index_users_on_email",
unique: true
end
add_foreign_key "transactions", "accounts"
add_foreign_key "transactions", "users"
end
75
Додаток В
Бібліотеки які використовувалися в проекті
# frozen_string_literal: true
# rubocop:disable Layout/ExtraSpacing
source "https://rubygems.org"
gem "rails", "6.1.4.1"
# PostgreSQL as the Active Record database.
gem "pg", "1.2.3"
# Gems used by project.
gem "autoprefixer-rails"
gem "bootstrap", "~> 4.4.1"
gem "figaro", "~> 1.2.0"
gem "font-awesome-sass", "~> 5.12.0"
gem "haml", "~> 5.2.1"
gem "jquery-ui-rails", "~> 6.0.1"
gem "kaminari", "~> 1.2.1"
gem 'bcrypt', '~> 3.1.7'
gem 'omniauth'
gem 'omniauth-google-oauth2'
gem 'dotenv-rails'
gem 'omniauth-rails_csrf_protection'
# Rails defaults.
gem "coffee-rails", "~> 5.0"
gem "sass-rails", ">= 6"
gem "uglifier", ">= 1.3.0"
gem "jbuilder", "~> 2.9"
gem "jquery-rails", "~> 4.3.5"
76
gem "turbolinks", "~> 5"
gem 'money-rails', '~> 1.12'
gem 'eu_central_bank'
group :development do
gem "listen", "~> 3.3"
gem "spring"
gem "spring-watcher-listen", "~> 2.0.0"
gem "web-console", ">= 4.1.0"
gem 'pry-rails'
end
group :test do
gem "capybara", ">= 3.26"
gem "minitest"
gem "puma"
gem "selenium-webdriver"
end
# rubocop:enable Layout/ExtraSpacing
gem "groupdate", "~> 6.4"
gem "chartkick", "~> 5.0"
77
Додаток Г
Сторінка авторизації
78
Сторінка рахунків
Сторінка транзакцій
79
Сторінка звітів
Сторінка створення нового рахунку
80
Віконце для реєстрації дохода або втрати (створення транзакції)
81