BLOGبكتب عن الشغلNotes from the work

المدونةBlog

اللي بتعلمه وأنا ببني: كود، تصميم، وحركة. من غير حشو.What I learn while building: code, design and motion. No filler.

كل التدويناتAll posts

غلاف مقال :has() في CSS بسبع أمثلة عملية آخر تدوينةLatest ويبWeb 4 دقايقmin :has() في CSS: سبع استخدامات بتشيل جافاسكريبت من موقعك:has() in CSS: seven uses that remove JavaScript from your site الـ selector اللي بيخليك تنسق الأب حسب اللي جواه، بأمثلة حقيقية للفورمات والكروت والقوايم.The selector that styles a parent by what it contains, with real examples for forms, cards and menus.
غلاف مقال Container Queries في CSS ويبWeb 4 دقايقmin Container Queries: الكارت اللي بيتظبط حسب مكانه مش حسب الشاشةContainer queries: a card that adapts to its place, not the screen
حركةMotion 4 دقايقmin Scroll-driven animations في CSS: حركة مع السكرول من غير جافاسكريبتCSS scroll-driven animations: scroll motion without JavaScript
ذكاء اصطناعيAI 5 دقايقmin Claude Code للمبتدئين: إزاي تشتغل بوكيل برمجة من غير ما تبوظ مشروعكClaude Code for beginners: working with a coding agent without wrecking your project
غلاف مقال Prompt Injection وشرح ثغرة حقن التعليمات ذكاء اصطناعيAI 5 دقايقmin Prompt Injection: الثغرة اللي لازم تفهمها قبل ما تبني بالذكاء الاصطناعيPrompt injection: the flaw to understand before building with AI إزاي نص في صفحة أو إيميل يقدر يخلي المساعد الذكي يشتغل ضدك، وليه مفيش حل نهائي، وإزاي تبني حواليها.How text in a page or an email can turn an AI assistant against you, why there is no final fix, and how to build around it.
ذكاء اصطناعيAI 5 دقايقmin RAG: إزاي تخلي الذكاء الاصطناعي يجاوب من بياناتكRAG: making an AI answer from your own data
ذكاء اصطناعيAI 4 دقايقmin AI Agents: إيه هي وبتشتغل إزاي من جوهAI agents: what they are and how they work inside
غلاف مقال كتابة Prompt للكود بالذكاء الاصطناعي ذكاء اصطناعيAI 5 دقايقmin كتابة Prompt للكود: إزاي تطلب من الذكاء الاصطناعي صحWriting prompts for code: how to ask an AI properly سبع عادات بتفرق بين كود يتسلم وكود يترمي، مع قالب جاهز وأمثلة قبل وبعد.Seven habits that separate code you ship from code you throw away, with a ready template and before/after examples.
غلاف مقال MCP: شرح Model Context Protocol بالعربي ذكاء اصطناعيAI 4 دقايقmin MCP: إيه هو وليه كل أدوات الذكاء الاصطناعي بتدعمهMCP: what it is and why every AI tool supports it
ذكاء اصطناعيAI 3 دقايقmin Vibe coding: إيه هو وإمتى تعتمد عليهVibe coding: what it is and when to trust it
غلاف مقال الذكاء الاصطناعي والمبرمجين: هل هياخد شغلهم مسار مهنيCareer 4 دقايقmin هل الذكاء الاصطناعي هياخد شغل المبرمجين؟Will AI take programmers' jobs? إيه اللي اتغير فعلا في شغل المبرمج، إيه اللي الأدوات لسه مش بتعمله، والمهارات اللي قيمتها بتزيد.What has really changed in a programmer's work, what the tools still cannot do, and the skills that are gaining value.
غلاف مقال View Transitions API وتبديل الوضع الليلي بدايرة بتكبر حركةMotion 3 دقايقmin View Transitions API: تبديل الوضع الليلي بدايرة بتكبرView Transitions API: a dark mode switch that grows as a circle
مسار مهنيCareer 4 دقايقmin تعلم برمجة المواقع من الصفر: الخريطة اللي تمشي عليهاLearn web development from zero: the roadmap to follow
حركةMotion 3 دقايقmin حركة تخدم الموقع مش تبوظه: قواعدي مع GSAPMotion that helps, not hurts: my GSAP rules
إزاي عملت فورم تواصل الناس بتكمله للآخر تصميم واجهاتUI design 3 دقايقmin إزاي عملت فورم تواصل الناس بتكمله للآخرHow I built a contact form people actually finish تلات خطوات، كلها اختيارات، وخانة الكتابة آخر حاجة. كل قرار في فورم zeyad.email وليه اتاخد.Three steps, all choices, typing comes last. Every decision behind the zeyad.email form and why.