About The Project ??
Mahmoud-Dev is an open-source, full-stack portfolio application designed to be more than just a static page. It functions as a complete digital operating system (PORTFOLIO_OS), featuring a unique Brutalist Design System that emphasizes bold typography, high-contrast borders, and neon accents.
This project isn't just about displaying skills; it's about providing a fully functional, authentic backend experience where all data flows dynamically from a PostgreSQL database, leveraging cutting-edge web technologies like React 19 and advanced Next.js routing patterns (Intercepting Routes, Parallel Routes, and Suspense Streaming).
Architecture & Tech Stack ?
The architecture focuses on edge-ready performance, type-safe robust integrations, and a beautiful UI.
Core Foundation
UI / Design System & State Management
Backend & Database
Authentication & Infrastructure
Admin OS & Frontend Features ⚙️
The portfolio includes a highly responsive, app-like frontend and a protected administration panel mapped to /admin/dashboard. Key features include:
⚛️ React 19 Mastery: Forms and state management utilize the latest React 19 features like useActionState, useFormStatus, and useOptimistic for instant UI feedback and zero-layout-shift mutations.?️ Advanced Next.js Routing: Implements Intercepting Routes & Parallel Routes (e.g., viewing a project opens a modal over the home page instead of navigating away) and Streaming with Suspense for blazing fast initial loads.? Magic Link & Biometric Auth: Powered by Better Auth, the login supports seamless passwordless Magic Link authentication alongside traditional biometrics and robust session tracking.? Dynamic Content Manager: Update your Bio, Header, Social Links, and Resumé right from the dashboard with optimistic UI updates.? Modular Experience/Projects: Full CRUD operations for career history and project portfolios.?️ Security Logging: Every admin action (logins, logouts, edits, deletes) is tracked and audited in the SecurityLog table.? Brutalist UI Elements: High-contrast, custom-designed alert and confirm dialogs, loading skeletons, and modals bypassing native browser structures.