This document describes how the frontend connects to the backend API.
The API configuration is stored in src/config/api.ts:
- Base URL:
http://localhost:8000 - Authentication: JWT Bearer tokens
- Content Type:
application/json
- Login: User submits username/password → Backend validates → Returns JWT token
- Token Storage: JWT token is stored in localStorage
- Protected Requests: Token is included in Authorization header
- Auto-login: On app startup, check for stored token and validate with backend
POST /auth/token- Login (returns JWT token)GET /auth/users/me- Get current user infoGET /auth/protected- Test protected route
/customers- Customer management/employees- Employee management/branches- Branch management/saving-accounts- Savings account operations/transactions- Transaction handling/fixed-deposits- Fixed deposit management/joint-accounts- Joint account management
const { login } = useAuth();
await login(username, password);const { user } = useAuth();
const response = await fetch(buildApiUrl('/some-endpoint'), {
headers: getAuthHeaders(user?.token)
});- Network errors are caught and displayed to user
- Invalid credentials show appropriate error message
- Token expiration automatically logs user out
-
Start Backend:
cd Backend ./venv/Scripts/Activate # Windows uvicorn main:app --reload --port 8000
-
Start Frontend:
cd Frontend npm run dev -
Access Application: http://localhost:5173
The backend should have demo users set up. Check with your backend team for valid credentials, or create test users through the authentication system.