Skip to content

README.md

Latest commit

 

History

History
191 lines (151 loc) · 6.35 KB

README.md

File metadata and controls

191 lines (151 loc) · 6.35 KB

IBM CIC Client Intelligence Dashboard

A production-grade enterprise dashboard built for IBM Client Innovation Center (CIC) style consulting workflows — featuring real-time data management, microservices architecture, PostgreSQL + MongoDB dual-database design, and an AI-powered ticket classification engine.

Live Demo: (coming soon — deploying to Vercel + Railway)

Architecture Overview

┌─────────────────────────────────────────────┐
│           React 18 Frontend (Vite)           │
│     TypeScript · Tailwind CSS · Hooks        │
└──────────┬──────────────────┬────────────────┘
           │                  │
    ┌──────▼──────┐    ┌──────▼──────┐
    │ Project     │    │ AI          │
    │ Service     │    │ Service     │
    │ FastAPI     │    │ FastAPI     │
    │ :8000       │    │ :8001       │
    └──────┬──────┘    └─────────────┘
           │
    ┌──────┴──────────────────┐
    │                         │
┌───▼────────┐        ┌───────▼──────┐
│ PostgreSQL │        │   MongoDB    │
│ (Clients,  │        │ (Activity    │
│  Projects) │        │  Logs)       │
└────────────┘        └──────────────┘

Tech Stack

Layer Technology
Frontend React 18, TypeScript, Tailwind CSS, Vite
Project Service Python, FastAPI, SQLAlchemy, Uvicorn
AI Service Python, FastAPI, NLP Classification Engine
Primary Database PostgreSQL 15 (via Docker)
Secondary Database MongoDB 6 (via Docker)
Containerization Docker, Docker Compose
Version Control Git, GitHub

Features

Client Management (PostgreSQL)

  • Full CRUD operations for enterprise clients
  • Real-time data fetched from PostgreSQL via REST API
  • SQLAlchemy ORM with clean model definitions

Project Tracker

  • Visual progress bars per project
  • Status management: In Progress / On Hold / Completed
  • Client-project relationship management

AI Ticket Classifier (Microservice)

  • Dedicated FastAPI AI service running on port 8001
  • NLP-based ticket classification engine
  • Auto-detects category: Backend / Frontend / Performance / Security
  • Auto-assigns priority: High / Medium / Low
  • Designed for HuggingFace Transformers integration

Activity Logs (MongoDB)

  • Every client action logged to MongoDB automatically
  • Audit trail displayed live on Dashboard
  • NoSQL document storage for unstructured log data

Getting Started

Prerequisites

  • Node.js 18+
  • Python 3.10+
  • Docker Desktop

1. Clone the repository

git clone https://github.com/J4jatin/ibm-client-dashboard.git
cd ibm-client-dashboard

2. Start databases

docker-compose up -d

3. Start Project Service

cd backend/project-service
python -m venv venv
venv\Scripts\activate  # Windows
pip install -r requirements.txt
uvicorn main:app --reload

4. Start AI Service

cd backend/ai-service
python -m venv venv
venv\Scripts\activate  # Windows
pip install -r requirements.txt
uvicorn main:app --reload --port 8001

5. Start Frontend

cd frontend
npm install
npm run dev

6. Open in browser

http://localhost:5173

API Documentation

FastAPI auto-generates interactive API docs:

  • Project Service: http://localhost:8000/docs
  • AI Service: http://localhost:8001/docs

Key Endpoints

Method Endpoint Service Description
GET /clients/ Project List all clients
POST /clients/ Project Create client + log to MongoDB
GET /clients/logs Project Activity logs from MongoDB
GET /projects/ Project List all projects
GET /tickets/ Project List all tickets
POST /classify AI Classify ticket by NLP
POST /classify-batch AI Batch classify tickets

Project Structure

ibm-client-dashboard/
├── frontend/                  # React + TypeScript + Tailwind
│   └── src/
│       ├── pages/
│       │   ├── Dashboard.tsx  # Live MongoDB activity feed
│       │   ├── Clients.tsx    # PostgreSQL CRUD
│       │   ├── Projects.tsx   # Project tracker
│       │   └── Tickets.tsx    # AI ticket classifier
│       └── App.tsx            # Routing + layout
├── backend/
│   ├── project-service/       # Main FastAPI microservice
│   │   ├── routes/
│   │   │   ├── clients.py     # Client endpoints + MongoDB logging
│   │   │   ├── projects.py    # Project endpoints
│   │   │   └── tickets.py     # Ticket endpoints
│   │   ├── models.py          # SQLAlchemy models
│   │   ├── database.py        # DB connection + session management
│   │   └── main.py            # App entry point + CORS
│   └── ai-service/            # AI classification microservice
│       └── main.py            # NLP classifier engine
└── docker-compose.yml         # PostgreSQL + MongoDB containers

Design Decisions

Why two databases? PostgreSQL handles structured relational data (clients, projects) where data integrity and relationships matter. MongoDB handles unstructured activity logs where schema flexibility and write speed are priorities. Using the right database for the right job is a core enterprise architecture principle.

Why microservices? The AI service is intentionally separated from the project service — it can be scaled, updated, or replaced independently. This mirrors how IBM CIC structures real client delivery systems.

Why Tailwind CSS? Utility-first CSS enables rapid, consistent UI development without context-switching between component files and stylesheets — aligning with modern enterprise frontend practices.

Author

Jattin Shah MSc Applied Artificial Intelligence — TU Dresden LinkedIn · GitHub