This project implements a financial transaction anomaly detection system using a Flask backend for simulating a data stream and anomaly detection, and a React frontend for visualizing the data stream and highlighting the anomalies.
Backend: Flask API that simulates a financial transactional data stream and detects anomalies using Z-Score and Isolation Forest methods. Frontend: React app that visualizes the data stream with anomalies highlighted on a graph.
- Prerequisites
- Installation
- Backend Setup
- Frontend Setup
- Running the Application
- Project Structure
- Technologies Used
Before you begin, ensure you have the following installed:
- Python 3.8+
- Node.js 14+
- npm 6+
Clone the repository and navigate to root directory:
git clone https://github.com/edwinmvk/anomaly-detection.git
cd anomaly-detection
-
Navigate to the backend directory from root:
cd backend
-
Install the required Python packages:
pip install -r requirements.txt
-
Navigate to the frontend directory from root:
cd frontend
-
Install the required npm packages:
npm install
-
Start the Flask backend:
- In a new terminal, navigate to the backend directory:
The backend will start running on
cd backend python server.py
http://localhost:5000
.
- In a new terminal, navigate to the backend directory:
-
Start the React frontend:
- In a new terminal, navigate to the frontend directory:
The frontend will start running on
cd frontend npm start
http://localhost:3000
.
- In a new terminal, navigate to the frontend directory:
-
Open your web browser and go to
http://localhost:3000
to view the application.
anomaly-detection/
│
├── backend/
│ ├── server.py # Flask backend
│ └── requirements.txt # Python dependencies
│
└── frontend/
├── package.json # npm dependencies and scripts
├── public/
└── src/
├── App.js # Main React component
└── ... # Other React components and assets
- Backend:
- Flask
- NumPy
- SciPy
- scikit-learn
- Frontend:
- React
- Chart.js
- react-chartjs-2
For more details, please refer to the requirements.txt
and package.json
files.