React Bank

screenshot of React Bank
react
firebase
strapi

Banking app built in React, Redux, TypeScript, Node, Strapi

Overview

The react-bank app is a banking application built using TypeScript, React, Redux, and Node. It allows users to login/register, manage accounts, perform transactions, manage credit/debit cards, send internal messages, view and update user profile information, generate dummy data, and more. The app is still in the early stages of TypeScript implementation and currently only covers the frontend. It uses technologies such as React Router, Bootstrap 4, recharts, and JWT tokens. The backend API is built using Node, Express, and Strapi, with MongoDB or MySQL/MariaDB as the database options. Currency rates are obtained from Fixer.io.

Features

  • Login/register functionality
  • Account management
  • Transaction functionality
  • Credit/debit card management
  • Internal messaging system
  • User profile management
  • Help form for assistance
  • Income change chart
  • Currency statistics
  • Form validation and async routing
  • Dummy data generation

Summary

The react-bank app is a TypeScript-based banking application built using a combination of frontend technologies such as React, Redux, and Bootstrap 4, and backend technologies such as Node, Express, Strapi, and MongoDB or MySQL/MariaDB. It offers various banking functionalities, user management features, and data visualization options. The app is still in the early stages of development, with ongoing TypeScript implementation and limited backend coverage.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

firebase
Firebase

Firebase offers a comprehensive set of features, including real-time database, authentication, hosting, cloud functions, storage, and more. Firebase provides an easy-to-use interface and allows developers to focus on building features rather than managing infrastructure.

strapi
Strapi

Strapi is an open source headless CMS that provides a customizable content management system and API for your projects. It allows you to manage content in a visual interface and use a REST or GraphQL API to retrieve the data.

formik
Formik

Formik is a popular form library for React that helps with form state management, validation, and submission handling. It provides a declarative approach to building forms with support for complex validation scenarios and easy integration with validation libraries like Yup.

Redux

Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.