Get Started

The Nalubale frontend is a React 18 single-page application built with Vite and styled with Tailwind CSS. It talks to the Nalubale Flask backend API.

Prerequisites

  • Node.js 18 or newer and npm

  • A running Nalubale backend API at http://localhost:5000

Installation

git clone git@github-tb:TechyBuddies/nalubale-frontend.git
cd nalubale-frontend
npm install
npm run dev

Then open http://localhost:3000 in a browser. The development server listens on port 3000 (see vite.config.js).

Available Scripts

Command

Description

npm run dev

Start the development server

npm run build

Build for production into dist/

npm run preview

Preview the production build

npm run lint

Run ESLint

npm run test

Run tests with Vitest

API Configuration

The API base URL is set in src/services/api.js:

const API_BASE_URL = 'http://localhost:5000/api/v1'

Change it there to point the frontend at a different backend.

Authentication

The app uses JWT authentication:

  1. The user logs in with a username and password.

  2. The backend returns access and refresh tokens.

  3. The tokens are stored in localStorage.

  4. Requests send the access token in the Authorization header.

  5. After login, users are redirected by role: shareholders to the investor dashboard, staff to the admin dashboard.

Features

Admin and staff interface

Dashboard with key metrics and charts; shareholder, policy, subscription/payment, and beneficiary management; CSV export.

Shareholder portal

Personal portfolio dashboard, policies, payment history, and beneficiary management.

Building This Documentation

This documentation is written in MyST Markdown and built with Sphinx. From the project root:

make setup   # create .venv and install the documentation tooling
make html    # build a preview into build/html

Open build/html/index.html to view the result.