Full-Stack Web Developer | Next.js & MERN Specialist
I’m a passionate full-stack developer who loves building fast, responsive web applications with clean UIs and solid backends. I specialize in Next.js, TypeScript, and the MERN stack, especially projects that handle dynamic data and smooth API integrations.
WeRank | 1st Prize Winner - NUML Open House 2024
Full-Stack MERN Social Platform with Custom Ranking Algorithms
The Innovation: Developed a social media ecosystem that replaces "likes" with a Weighted Ranking System. Users collaborate to rank content, which is then processed by a custom-built intelligent algorithm to curate feeds.
Technical Deep-Dive:
-
Frontend: Built with React 18 & Redux Toolkit, featuring a complex Drag-and-Drop UI for real-time list reordering.
-
Backend: A high-performance Node.js/Express API utilizing custom scoring logic, algorithmic feed engines, and Firebase-backed authentication.
-
Architecture: Implemented clean, domain-driven design with state persistence and optimized API orchestration.
-
Impact: Awarded 1st Place out of dozens of projects for its technical complexity, clean UI/UX, and innovative approach to social data.
📂 View Frontend Repo | 📂 View Backend Repo
Full-Stack Web Application for Authentic, Performance-First Quranic Reading
Successfully rendered the 15-line standard Medina (QPC) Mushaf layout into a web environment. Replaced generic, scrollable text interfaces with a meticulously crafted Right-to-Left (RTL) reading spread featuring immersive 3D page-flipping mechanics and dynamic, page-specific typography.
Technical Deep-Dive:
-
Frontend: Engineered with Next.js 15+ (App Router), React 19, and Tailwind CSS v4. Utilized Framer Motion to build complex 3D transformations (
preserve-3d,rotateY) that simulate authentic physical book behaviors. -
Data & Performance: Optimized data fetching by shifting away from standard HTTP APIs to Next.js Server Components with native filesystem queries (
fs/promises). Executed massive Static Site Generation (SSG) for all 604 pages, achieving near-instant, zero-latency load times. -
Architecture: Developed a custom
QpcFontStyleRegistrythat intelligently injects specialized WOFF2 fonts just-in-time (JIT) per page spread to eliminate browser bloat. Built custom routing logic to enforce proper RTL alignment and double-page spread snapping. -
Impact: Delivered a visually stunning, highly resilient reading environment featuring smart search integration, Juz/Surah navigators, and a modern glassmorphism aesthetic that ensures a premium user experience across all devices.
Frontend: React • Next.js • TypeScript • Tailwind CSS • Material UI
Backend: Node.js • Express.js • MongoDB • RESTful API Design
Tools: Git • GitHub • Postman • NPM • Cursor
BS Software Engineering
National University of Modern Languages (NUML), Islamabad
GPA: 3.2
Achievements: 1st Prize – Final Year Project | NUML High Achievers Award
- English – Full Professional Proficiency
- Urdu – Native
- Arabic – Limited Working Proficiency
Feel free to check out my repositories or reach out if you’d like to collaborate!