A behind-the-scenes look at how this site is built, for anyone curious about the stack.
Next.js (App Router, Turbopack)
Framework & routing
React 19 & TypeScript
UI & type safety
Tailwind CSS v4
Styling
Framer Motion
Animation
lucide-react
Icons
Dark mode is applied by a tiny inline script in the document head, before the page paints, so it reads the saved preference (or the browser's) and sets the theme instantly — no flicker from light to dark on load.
English, Arabic, and French are handled by a lightweight in-house translation layer rather than a full framework — a language switcher swaps the visible text and flips the page to right-to-left for Arabic, all without a page reload.
The Projects page fetches directly from the GitHub API at request time, so new repositories show up automatically, along with each repo's own live star count and language.
The downloadable PDF resume is generated from the same content as the rest of the site, with a QR code in the corner linking straight back here.
Deployed on Vercel, built automatically from GitHub on every push, on a custom domain registered through Namecheap.
