[{"data":1,"prerenderedAt":278},["ShallowReactive",2],{"navigation":3,"projects-page":22,"projects":43,"contributions":241},[4],{"title":5,"path":6,"stem":7,"children":8,"page":21},"Blog","/blog","blog",[9,13,17],{"title":10,"path":11,"stem":12},"🔥 Built from Real-World Needs – My Custom UI Package is Here!","/blog/building-scalable-vue-component-libraries","blog/building-scalable-vue-component-libraries",{"title":14,"path":15,"stem":16},"🔥 Cookie Authentication: How It Works & What Are the Risks?","/blog/cookie-authentication-security","blog/cookie-authentication-security",{"title":18,"path":19,"stem":20},"From Nuxt 2 to Vue 3: My Journey of Migration and Growth","/blog/mastering-nuxt-3-performance-optimization","blog/mastering-nuxt-3-performance-optimization",false,{"id":23,"title":24,"body":25,"description":26,"extension":33,"links":34,"meta":37,"navigation":38,"path":39,"seo":40,"stem":41,"__hash__":42},"pages/projects.yml","Designing Interfaces, Building Experiences.",{"title":24,"description":26,"links":27},"I've worked on a variety of projects, focusing on creating intuitive digital experiences where thoughtful design meets clean code. Here are some highlights I'm proud of, showcasing my process from concept to execution.",[28,31],{"label":29,"color":30},"Let's talk","neutral",{"label":32},"Email me","yml",[35,36],{"label":29,"color":30},{"label":32},{},true,"/projects",{"title":24,"description":26},"projects","GcJdmP9QB0KKpRwrI-DpPT0bUsrDhxGkgro8gh77TMQ",[44,68,86,109,132,150,167,180,199,213,228],{"id":45,"title":46,"date":47,"description":48,"extension":33,"image":49,"meta":50,"stem":65,"tags":66,"url":53,"__hash__":67},"projects/projects/safha-ai.yml","SAFHA – AI-Powered Document & Invoice Management","2026-01-01T00:00:00.000Z","Multi-tenant ERP system built with scalable Next.js frontend, multi-tenant architecture and RBAC. Developed admin dashboards and automated document processing workflows with AI extraction and validation. Created an advanced PDF review experience with highlighted OCR fields and integrated WhatsApp, Odoo, Qoyod, and Daftra APIs.","/safha-ai.webp",{"path":51,"body":52},"/projects/safha-ai",{"title":46,"description":48,"image":49,"url":53,"tags":54,"date":64},"https://platform.safha-ai.com",[55,56,57,58,59,60,61,62,63],"Next.js 16","Laravel 10","TypeScript","shadcn/ui","Playwright","JWT Auth","React Hook Form","Zod","Tailwind CSS v4","2026-01-01","projects/safha-ai",[55,56,57,58,59,60,61,62,63],"pGUglfgmTT_ROaW-gqKFtfk0dXzxKmXUQNe4gzERiC0",{"id":69,"title":70,"date":47,"description":71,"extension":33,"image":72,"meta":73,"stem":83,"tags":84,"url":76,"__hash__":85},"projects/projects/safha-archive.yml","Safha Archive","Developed Laravel backend API with Passport auth and built Next.js 16 frontend with React 19 and TypeScript. Integrated Typesense for system-wide search and Gemini for semantic embeddings. Managed state via TanStack Query and Zustand.","/safha-archive.webp",{"path":74,"body":75},"/projects/safha-archive",{"title":70,"description":71,"image":72,"url":76,"tags":77,"date":64},"https://safha-archive-test.velents.ai",[55,78,57,79,80,81,82,58,63],"Laravel 13","Typesense","Gemini","TanStack Query","Zustand","projects/safha-archive",[55,78,57,79,80,81,82,58,63],"w0SDvv8lqFgOQiqosBzmrwOwftAMF65aIgQMR9K9AJI",{"id":87,"title":88,"date":89,"description":90,"extension":33,"image":91,"meta":92,"stem":106,"tags":107,"url":95,"__hash__":108},"projects/projects/ai-penetration-tester.yml","AI-Powered Penetration Tester","2025-10-01T00:00:00.000Z","Built an AI security dashboard with Nuxt 4, Vue 3, and Tailwind CSS. Implemented autonomous AI pentesting workflows with real-time scan updates via SSE. Developed an AI chat assistant for interactive security analysis and integrated enterprise-grade security, OAuth, and advanced vulnerability intelligence.","/ai-penetration-tester.webp",{"path":93,"body":94},"/projects/ai-penetration-tester",{"title":88,"description":90,"image":91,"url":95,"tags":96,"date":105},"https://dev-ai-pen.atwdemo.com",[97,98,57,99,100,101,102,103,104,63],"Nuxt 4","Vue 3","AI SDK","@eslamdevui/ui","PostgreSQL","Drizzle ORM","Redis","Puppeteer","2025-10-01","projects/ai-penetration-tester",[97,98,57,99,100,101,102,103,104,63],"tZuIAH1PG9MEhAVNq6YP8UrKysPvwiro2jEPbbyRtsg",{"id":110,"title":111,"date":112,"description":113,"extension":33,"image":114,"meta":115,"stem":129,"tags":130,"url":118,"__hash__":131},"projects/projects/amar-benaa.yml","Amar Benaa","2025-01-01T00:00:00.000Z","Amar & Benaa Ready Mix Concrete is a leading provider of high-quality ready-mix concrete solutions in Egypt, delivering reliable construction materials and services for residential, commercial, and industrial projects.","/amar-benaa.png",{"path":116,"body":117},"/projects/amar-benaa",{"title":111,"description":113,"image":114,"url":118,"tags":119,"date":128},"https://amar-benaa.com/",[98,120,121,122,123,124,57,125,126,127],"Pinia","Bootstrap","SCSS","Vue Use","navigator","Axios","Responsive Design","Prettier","2025","projects/amar-benaa",[98,120,121,122,123,124,57,125,126,127],"aVPV1hUw6m8nnJLBO3YbXnECZvtMk5mUTF-i42SXoYE",{"id":133,"title":134,"date":112,"description":135,"extension":33,"image":136,"meta":137,"stem":147,"tags":148,"url":140,"__hash__":149},"projects/projects/eapd.yml","EAPD - Egyptian Agency of Partnership for Development","A comprehensive web platform for Egypt's development agency promoting international cooperation and sustainable development. Developed a professional institutional website featuring dynamic content sections, statistics display, news integration, and project categorization system. Implemented responsive design with smooth animations and modern UI components using custom component library. Integrated interactive features including partnership showcases, FAQ system, and data visualization components.","/eapd.webp",{"path":138,"body":139},"/projects/eapd",{"title":134,"description":135,"image":136,"url":140,"tags":141,"date":128},"https://www-deveapd.atwdemo.com/",[142,98,57,100,143,120,144,145,146],"Nuxt","Tailwind CSS","i18n","Chart.js","Docker","projects/eapd",[142,98,57,100,143,120,144,145,146],"AGXLvs0kedFr9l_BPkuTRz9WbTOiO1DrioBuyzBA6P0",{"id":151,"title":152,"date":112,"description":153,"extension":33,"image":154,"meta":155,"stem":164,"tags":165,"url":158,"__hash__":166},"projects/projects/expert-system.yml","Expert System","A multi-portal expert system for e-commerce, analytics, and POS solutions. Developed the Seller Portal (POS) and Analytics Portal using Vue.js. Implemented modular design patterns (HMVC, SOA) for scalability and maintainability. Integrated E-commerce APIs, Messaging Module, and Safe & HR Modules using DDD (Domain-Driven Design).","/expert-system.webp",{"path":156,"body":157},"/projects/expert-system",{"title":152,"description":153,"image":154,"url":158,"tags":159,"date":128},"https://expert-system.atwdemo.com/",[98,160,143,57,161,162,163,146],"Laravel 11","JavaScript","WebSockets","Livewire","projects/expert-system",[98,160,143,57,161,162,163,146],"-e2elLNVnxbHxaqYPHTzCCoj0xM9Fqh_pbryOQf8Jb4",{"id":168,"title":169,"date":112,"description":170,"extension":33,"image":171,"meta":172,"stem":177,"tags":178,"url":175,"__hash__":179},"projects/projects/future-media.yml","Future Media","Future Media is a cutting-edge digital media company specializing in innovative content creation and distribution. Developed a dynamic and user-friendly website to showcase their services, portfolio, and client testimonials. Implemented advanced features such as video integration, interactive galleries, and a blog section to engage visitors and enhance user experience.","/future-media.png",{"path":173,"body":174},"/projects/future-media",{"title":169,"description":170,"image":171,"url":175,"tags":176,"date":128},"https://dev-future-media.atwdemo.com/services",[142,98,57,100,143,120,144,146],"projects/future-media",[142,98,57,100,143,120,144,146],"9_FlMRX-3aaGPABHcH6EHTEnNdLxrb8-GBoHDPF5xA4",{"id":181,"title":182,"date":183,"description":184,"extension":33,"image":185,"meta":186,"stem":196,"tags":197,"url":189,"__hash__":198},"projects/projects/adltix.yml","Adltix","2024-01-01T00:00:00.000Z","Adltix is an AI-powered marketing platform that helps brands and influencers grow through influencer collaborations, paid media, data & analytics, web development, and Web3 integration. It leverages AI agents and automation to maximize ROI and deliver scalable marketing solutions.","/adltix.png",{"path":187,"body":188},"/projects/adltix",{"title":182,"description":184,"image":185,"url":189,"tags":190,"date":195},"https://adltix.com/",[191,98,120,143,192,57,125,144,193,126,127,194,146],"Nuxt 3","GSAP","Sitemap","PostCSS","2024","projects/adltix",[191,98,120,143,192,57,125,144,193,126,127,194,146],"DS8cjp8xVpZclP3-yKseO9zfhkMbk_gxnJkaizfaX1g",{"id":200,"title":201,"date":183,"description":202,"extension":33,"image":203,"meta":204,"stem":210,"tags":211,"url":207,"__hash__":212},"projects/projects/mini-games.yml","Mini-Games (Mobile Design based)","An interactive platform for cognitive development through games. Developed an engaging and educational gaming experience that helps users improve their cognitive skills through various interactive challenges and puzzles.","/mini-games.webp",{"path":205,"body":206},"/projects/mini-games",{"title":201,"description":202,"image":203,"url":207,"tags":208,"date":195},"https://e-book.eventiadv.com/",[209,142,143,161,57,126,127],"Vue","projects/mini-games",[209,142,143,161,57,126,127],"xOoUzo_RmAOa9tnMMez1c2upCMYYkdH8XXJntnBqqCM",{"id":214,"title":215,"date":183,"description":216,"extension":33,"image":217,"meta":218,"stem":225,"tags":226,"url":221,"__hash__":227},"projects/projects/onclub-ef.yml","ONClub-EF","A project to create a comprehensive sports news platform. Developed a modern and engaging sports news website with responsive design, featuring latest sports updates, articles, and interactive content for sports enthusiasts.","/onClub.webp",{"path":219,"body":220},"/projects/onclub-ef",{"title":215,"description":216,"image":217,"url":221,"tags":222,"date":195},"#",[191,98,223,122,224,161,126],"HTML","CSS","projects/onclub-ef",[191,98,223,122,224,161,126],"E0ghYFov1zFzey-7bm6GvsYzJKtbuhst6xtMBd1eInA",{"id":229,"title":230,"date":183,"description":231,"extension":33,"image":232,"meta":233,"stem":238,"tags":239,"url":236,"__hash__":240},"projects/projects/shomoa-dubai.yml","Shomoa Dubai","A modern e-commerce platform for showcasing and purchasing lighting products with advanced filtering and blog integration. Developed a fully functional e-commerce website featuring a product catalog with category and subcategory filters, a blog section, and a contact page. Delivered a responsive and visually appealing design using Nuxt.js, Vue 3, Tailwind CSS, and Swiper for enhanced user experience.","/shomoa-dubai.webp",{"path":234,"body":235},"/projects/shomoa-dubai",{"title":230,"description":231,"image":232,"url":236,"tags":237,"date":195},"https://shomoa-dubai.com/",[191,98,120,143,57,125,144,193,126,127,194,146],"projects/shomoa-dubai",[191,98,120,143,57,125,144,193,126,127,194,146],"toZnjEJmINR0nZx8vGjkb66Q1CYXhJY87b8g4XX32oE",[242,255,266],{"id":243,"title":244,"date":245,"description":246,"extension":33,"meta":247,"stem":253,"type":251,"url":250,"__hash__":254},"contributions/contributions/nextjs-bug-report.yml","vercel/next.js #93757","2025-12-01T00:00:00.000Z","Identified and reported a critical Next.js bug where a 0-byte file in .next/cache/images/ permanently poisons the disk-LRU singleton, breaking image optimization for the entire process lifetime. Provided root-cause analysis across 3 source files and 4 suggested fixes.",{"path":248,"body":249},"/contributions/nextjs-bug-report",{"title":244,"description":246,"url":250,"type":251,"date":252},"https://github.com/vercel/next.js/issues/93757","Bug Report","2025-12-01","contributions/nextjs-bug-report","OKZec2ksehzucy7rCmre3vZ2iBWzi3gX1rgLXLmxsi0",{"id":256,"title":100,"date":112,"description":257,"extension":33,"meta":258,"stem":264,"type":262,"url":261,"__hash__":265},"contributions/contributions/eslamdevui-ui.yml","A fully accessible UI component library for Vue & Nuxt based on Tailwind CSS. Built and published a UI framework inspired by Nuxt UI v3 with full TypeScript support.",{"path":259,"body":260},"/contributions/eslamdevui-ui",{"title":100,"description":257,"url":261,"type":262,"date":263},"https://www.npmjs.com/package/@eslamdevui/ui","NPM Package","2025-01-01","contributions/eslamdevui-ui","jELtUFpEi72t5XqawDbaON_VbUKUZY3Rg6OsGVlO-10",{"id":267,"title":268,"date":269,"description":270,"extension":33,"meta":271,"stem":276,"type":262,"url":274,"__hash__":277},"contributions/contributions/vue-directives-kit.yml","vue-directives-kit","2024-11-01T00:00:00.000Z","A Vue.js directives utility package to enhance development efficiency. Provides a collection of reusable custom Vue directives for common DOM interactions.",{"path":272,"body":273},"/contributions/vue-directives-kit",{"title":268,"description":270,"url":274,"type":262,"date":275},"https://www.npmjs.com/package/vue-directives-kit","2024-11-01","contributions/vue-directives-kit","Kr_1AEiFujUoa9z72A-MChoxlnQGRDynn4ASoof4wrA",1782857531466]