Projects
Here are some of the projects I've built. Each project showcases different technologies and problem-solving approaches. Feel free to explore the code and live demos.
ZeroGPT
Built a full-stack SaaS platform that detects AI-generated text in real time using advanced analysis algorithms. Implemented Google OAuth authentication, role-based access control, and subscription billing with Stripe. Designed developer API with key management, rate limiting, and integration documentation for third-party apps. Delivered multilingual support (8+ languages) with Next.js internationalization and responsive UI using Tailwind CSS.
Tech Stack: Next.js 15, React 19, TypeScript, Prisma ORM, MySQL, Stripe API, Radix UI, JWT, Vitest
Reparo
Reparo.dev is an all-in-one, DNS-only performance optimization platform that boosts PageSpeed Insights and GTmetrix scores without requiring plugins or SDKs. It enhances site speed across desktop and mobile via advanced optimization of images, HTML, servers, and third-party assets. With deep technical SEO support, quality-assured testing, and control over HTML tweaks, it ensures smoother workflows and better UX.
Galley System
Developed a bilingual (Arabic/English) CMS with real-time analytics, content management, and secure role-based access. Built advanced admin dashboard with CRUD operations, Excel import/export, image uploads, and user management. Designed scalable architecture with Appwrite, automated migration scripts, cloud storage integration, and SEO support.
Tech Stack: Next.js 15, React 19, TypeScript, Appwrite, Tailwind CSS, Radix UI, next-intl, Prisma ORM, MySQL
EduBrain
Built AI-driven platform providing instant homework assistance across 30+ subjects using OpenAI GPT-4. Integrated Stripe subscription system with secure checkout, webhook processing, and tiered access control. Implemented JWT authentication, bcrypt password hashing, email verification, and 100% test coverage with Vitest. Designed responsive, multilingual UI with Tailwind CSS, Radix UI, React Query, and PDF export functionality.
Tech Stack: Next.js 15, React 19, TypeScript, Prisma ORM, MySQL, OpenAI API, Stripe, Nodemailer, Vitest
A7lamy
Developed culturally-aware dream interpretation system based on Islamic methodology with real-time analysis. Implemented multi-step user flow, contextual questioning, and personalized interpretation results. Built CMS with MDX integration, SEO-optimized content, automated blog generation, and image optimization.
Tech Stack: Next.js, React, TypeScript, Tailwind CSS, MDX, Animations, SEO Optimization
JobMail
Job-Mail is a full-stack web application built to streamline and automate the job application process. It allows users to manage templates and send customized emails directly from a clean, modern interface. The application leverages the power of Next.js and React for a dynamic frontend, while Nodemailer handles the backend email functionality. This project demonstrates a practical, user-centric solution using a modern web development stack.
Antique E-Commerce
A modern, multilingual e-commerce platform built with Next.js 15, featuring Arabic and English language support, comprehensive user management, and a full-featured shopping experience for furniture and antique items.
AI Travel Planner
Welcome to the AI Travel Dashboard! This project is a modern, full-stack web application designed to simplify travel planning using AI-generated itineraries. It provides users with a seamless experience to create, view, and manage travel plans tailored to their preferences.
Zoom Clone
Built with the latest Next.js and TypeScript, this project replicates Zoom, a widely used video conferencing tool. It enables users to securely log in, create meetings and access various meeting functionalities such as recording, screen sharing, and managing participants.
Threads
Build a full stack Threads clone using Next.js 14+ with a redesigned look transformed from a Figma design, user interaction to community management, technical implementation, and various features, including nested deep comments, notifications, real-time-search, and more.
Quran
Quran is a feature-rich radio app crafted with React.js and Redux Toolkit, offering a clean and intuitive user interface styled with Bootstrap 5. Built using Vite for fast development and bundling, the app demonstrates modern frontend architecture—including modular JavaScript, organized styling, and streamlined state management. Hosted seamlessly on Vercel, this project highlights your strengths in building interactive UI, managing global state effectively, and optimizing for performance and deployment.
Tech Stack: React, Vite, Bootstrap, Redux, Redux Toolkit, React-Bootstrap
Zentry
This project is a modern React application designed with GSAP animations, Tailwind CSS for styling, and a structured component-based architecture. The app consists of sections like Navbar, Hero, About, Features, Story, Contact, and Footer to showcase its functionality.
Tech Stack: React, Vite, Tailwind CSS, GSAP, React-use
Omnifood
A responsive, modern landing page for a fictional healthy meal delivery service, featuring smooth animations, sticky navigation, responsive design, and a visually engaging layout inspired by Udemy’s responsive-web-design tutorial.
Tech Stack: HTML, CSS, JavaScript, responsive design, animations, Flexbox/Grid
Random Chat
RandomChat is a modern web application built with Next.js that enables spontaneous conversations with strangers in real time. Leveraging Firebase for instant messaging and using shadcn-ui for a sleek interface, it’s deployed on Vercel for effortless hosting and performance. TypeScript ensures robust type safety throughout the codebase, while Tailwind CSS provides responsive design and styling flexibility. This project highlights my skills in full-stack development, real-time communication, and clean, scalable frontend architecture.
Tech Stack: Next.js, TypeScript, Tailwind CSS, Firebase, ShadCN, zustand, use-sound, next-intl
Flux
Flux is a sleek and interactive web app featuring a responsive UI built with HTML, CSS, and JavaScript, delivering a clean and engaging user experience. The project’s structure includes well-organized assets like index.html, indexAr.html, main.js, and style.css, hinting at thoughtful internationalization and modular coding. With 15 commits under your belt, it reflects your commitment to iterative design and development.
Tech Stack: HTML, CSS, JavaScript, responsive design, internationalization (via indexAr.html), modular structure (index.html, main.js, style.css)
Brain Wave
BrainWave is a dynamic web application built with Next.js and TypeScript, featuring a clean, modular architecture with app/page.tsx at its core. Styled elegantly using Tailwind CSS, the project also leverages next/font for optimized loading of the Inter typeface. Deployed effortlessly to Vercel, this app showcases your strengths in modern frontend development, performance optimization, and maintainable code structure.
Tech Stack: Next.js, TypeScript, Tailwind CSS, PostCSS, react-just-parallax, optimized font loading (via next/font Inter), structured app/page.tsx architecture
Anime
Anime is a sleek, infinite scroll performant web application built with Next.js and TypeScript, showcasing a clean, modular architecture centered around the app/page.tsx structure. It’s elegantly styled using Tailwind CSS, with optimized font loading through Next.js’s next/font utilizing the Inter typeface.
Tech Stack: Next.js, TypeScript, Tailwind CSS, Framer Motion, Observer, React.js
Supabase Chat
Supabase Chat is a real-time chat application built using Next.js and TypeScript, powered by Supabase for Authentication, Realtime subscriptions, and database management. The project features a well-structured, modular directory layout—including components, hooks, providers, and utility modules—highlighting best practices in code organization
Tech Stack: Real-time chat, Next.js, TypeScript, Supabase, Tailwind CSS, React.js, Next Themes, radix-ui
Bank Modern
Bank Modern is a polished, modern UI/UX website built using React.js and styled with Tailwind CSS, reflecting clean design inspiration, possibly from financial or banking themes. Structured with front-end tooling like Vite, it supports a streamlined development experience and fast build times.
Tech Stack: React.js, Tailwind CSS, Vite, modern UI/UX design
Flashcard Quiz
Interactive flashcard experience allowing users to choose number of questions, category, and difficulty. Fetches trivia questions via API and presents them as practice flashcards using React, useState, and Axios.
Tech Stack: React, JavaScript, Axios, useState, Vite, Axios, CSS, HTML