2025 · Full-stack development

System Web

An internal business management dashboard with a Next.js front end and a FastAPI and PostgreSQL back end.

Overview

An internal business management system, built as two projects: a Next.js web app and a FastAPI backend.
Web app: Next.js 16 (App Router), React 19, TypeScript, and Tailwind CSS 4, with shadcn-style UI primitives on Base UI.
Collapsible sidebar shell with breadcrumbs, a version switcher, and a menu search that filters the navigation and opens the first match on Enter.
Pages: Dashboard, Users, Profile, and Settings, each under a locale prefix with English and Khmer translations.
Account menu with profile links, light, dark, and system themes, a language switch, and sign-out.
API: FastAPI with async SQLAlchemy on PostgreSQL, Alembic migrations, and a Docker Compose setup for the database and the service.
Auth endpoints for register, login, and the signed-in user's profile, with bcrypt password hashing and JWT access tokens.
User model with roles, active and soft-delete flags, and created, updated, and deleted timestamps.
Status: the UI shell and the auth API are in place. The sign-in flow and the data screens are being connected next.

User profile page of the System Web dashboard on desktop and mobile.

Sidebar navigation driven by one typed config, with breadcrumbs, search, and active state all derived from it.

English and Khmer with locale-prefixed routing, using the same locale codes as this portfolio.

Server Components by default, client code only at the leaves, and design tokens kept in one stylesheet.

JWT authentication with bcrypt password hashing on a role-based user model.

Async FastAPI and SQLAlchemy on PostgreSQL, with schema changes tracked by Alembic migrations.

Dockerised PostgreSQL and API for a one-command local setup.

Next.jsTypeScriptTailwind CSSnext-intlFastAPIPostgreSQLDocker