Розробка веб-додатку для управління особистими фінансами

Abstract

UA : Мета роботи – проєктування, реалізація та хмарне розгортання адаптивного веб-додатку «FinanceFlow» для автоматизованого обліку фінансів, контролю бюджетів і візуалізації витрат. Методи дослідження – системний і порівняльний аналіз, об’єктно-орієнтоване проєктування та UML-моделювання, проєктування реляційних баз даних, компонентний підхід у веб-розробці, ручне тестування. У ході виконання роботи було спроєктовано та реалізовано адаптивний веб-додаток «FinanceFlow». Бекенд-частину побудовано на базі платформи Node.js та фреймворку Express.js з використанням Sequelize ORM для роботи з реляційною СУБД PostgreSQL. Клієнтську частину (SPA) розроблено на React + TypeScript із застосуванням збирача Vite та Vanilla CSS для стилізації. Реалізовано систему безпечної автентифікації користувачів на основі JWT-токенів із хешуванням паролів алгоритмом bcryptjs. Створено аналітичний модуль із динамічною візуалізацією витрат за допомогою інтерактивних SVG-діаграм, систему автоматичної перевірки перевищення встановлених бюджетів та фонову генерацію сповіщень. Розгортання бази даних проведено на серверлес-платформі Neon DB, а серверного та клієнтського модулів — на платформі Vercel з налаштуванням автоматичного CI/CD конвеєра через GitHub.

EN : Goal of the work – design, software implementation, and practical cloud deployment of a modern adaptive web application «FinanceFlow» for automated finance tracking, budget limits monitoring, and expense statistics visualization. Methods of research – system and comparative analysis, object-oriented design and UML-modeling, relational database design, component-oriented web development approach, manual verification testing. In the course of the work, the adaptive web application «FinanceFlow» was designed and implemented. The backend part is built on the Node.js platform and Express.js framework using Sequelize ORM to interact with the PostgreSQL relational DBMS. The client part (SPA) is developed on React + TypeScript using Vite bundler and Vanilla CSS for styling. A secure user authentication system based on JWT tokens with password hashing by bcryptjs algorithm has been implemented. An analytical module with dynamic expense visualization using interactive SVG charts, a system for automated monitoring of active budget limits, and background notification generation have been created. The database was deployed on the Neon DB serverless platform, while server and client modules were deployed on Vercel with an automated CI/CD pipeline set up via GitHub.