Building a Secure Demo Banking App [Part 1]

#programming #springboot #react

When building software projects or applications, it is important to be aware of how quickly technology evolves over time. For development, it is said that some tools or programming languages get updated at most each six months approximately; so that we need to catch up with newer versions that may introduce new patterns or concepts, otherwise we fall behind.

However, no matter how fast technology changes, the foundational core concepts of software development almost always stay the same. Now, with the revolution of AI, generic and simple software projects, such as CRUD apps, don't add the substantial value that we, as Software Engineers, expect to get in terms of knowledge and critical thinking. In order to build something powerful and reliable it should follow the best coding and security practices in each phase of the development cycle.

Why the Demo Banking App project?

I decided to build a software related to fintech, for demo purposes, based on the following reasons:
It deepens my skills in Full Stack mostly used in Fintech.
It represents a substantial software application for portfolio, that can be showcased publicly. The whole planning, development, deployment, I called it as "The Golden Project", since it covers almost all the grounds in terms of planning, coding structure, security, architectural and design patterns, as well as CD/CI. For simplicity, the name of the software application will be "Demo Banking App".
I plan to document each important feature and component to reinforce my understanding and adapt my approach as roadblocks arise throughout the build.

Project Goals & Scope

The first version of the "Demo Banking App" will include features noted below:

User registration and authentication
User profile
Account dashboard
Transaction history
Payments
Notifications
Fraud-screening

Technology Stack

While deciding the stack to choose for this kind of software project, I took into consideration the relevance and usage in real-world fintech apps, previous experience with some technologies and tools, and relevance of today's software best practices. Below the breakdown of the stack:

Frontend: React, TypeScript, Tailwind CSS.
Backend: Spring Boot
Database: PostgreSQL
Authentication: OAuth2 / OpenID Connect
Observability: Prometheus, Grafana, OpenTelemetry, ElasticSearch

Architecture

The architecture pattern to be applied is based on microservices and the Saga Pattern. The reason behind this choice is due to the project complexity in order to ensure escalability and smoothness of all transactions, simulating a real-world banking app.

Security from the Beginning

Even though it is a bank application for demo purposes, it is crucial and important to apply the best security practices. For version #1, some of them include: