Finance Goal Visualization

🛠️ Technologies Used

📝 Table Contents

• Features
• Screenshots
• Getting Started
• API Documentation

🚀 Features

• User Authentication (Login, Register), also link bank account
• Create Finance Goals
• Visualize Finance Goals with interactive cards
• Verify funds with bank account, verifying if you actually have the funds you claim to have ( dummy bank - Bank App )
• Update goals fund status with bank in real time after goal verification done
• Articles about finance, recommended articles
• Responsive UI, mobile responsive UI

Screenshots

Register Page

Home Page

Finance Goals Page

Create Finance Goals

When create goal and bank verification clicked, need to verify and accept from the Bank App

Articles Page

Read an Article

Getting Started

Prerequisites

• Node.js
• MongoDB installed or ensure that you have MongoDB Atlas set up. Obtain your connection string.

Installation

1. Clone the repo:

   git clone https://github.com/yourusername/banking-service.git

2. Install NPM packages for backend:

   cd backend
   npm install

3. Install NPM packages for frontend:

   cd backend
   npm install

Creating .env files

You can use any port number you want.

In the fronted directory create a .env file and add these 2 variables

• REACT_APP_URL="http://localhost:7000"
• REACT_APP_BANK_API="http://localhost:7001"

In the backend directory create another .env file and add these

• MONGO_URL="mongodb://localhost:27017"
• PORT=7000
• BANK_URL="http://localhost:7001"

Running the app

Open 2 terminals, in the root folder of the project enter these commands

1. Start the backend server

   cd backend
   npm start

2. Start the frontend server

   cd frontend
   npm start

API Documentation