frontend
ممارسات هندسة الواجهة الأمامية وHTML وCSS وأطر عمل JavaScript والأداء وإمكانية الوصول وتصميم واجهة المستخدم.
3 مقالات
محادثة غداء غيّرت موقعي
ملخص كيف أدى نقاش عشوائي أثناء الغداء إلى إعادة بناء هذا الموقع باستخدام Astro وتحديث التقنيات بالكامل وإعادة التفكير فيه كورشة رقمية شخصية بدلاً من محفظة تقليدية.
لقد بدأت بعض أكثر المشاريع متعةً بالنسبة لي في لحظات عادية بشكل مدهش؛ فقد تكون محادثةً تطرح فكرة جديدة، أو مشاركةً لتجربة عملية من قِبل شخص آخر، أو مصادفةً لطريقة مختلفة في التعامل مع مشكلة مألوفة. تنتهي المحادثة ويعود الجميع إلى أعمالهم اليومية، لكن فكرة صغيرة تظل عالقة في ذهني. ومع مرور الأيام، تنمو تلك الفكرة ببطء لتتحول إلى وثائق وملاحظات وتجارب، وأحياناً إلى مشروع جديد كلياً. وعند النظر إلى الوراء، أجد أن العديد من تجارب التعلم المفضلة لدي تعود إلى لحظات كهذه تماماً، وقد كانت عملية إعادة بناء موقعي الشخصي واحدة من تلك الرحلات غير المتوقعة.
← اقرأ المزيدمحفظة, متتبع محفظة شخصية خفيفة
ملخص يشرح هذا المنشور تصميم وتنفيذ متتبع محفظة شخصي بسيط قائم على المتصفح باستخدام React و TypeScript و Vite بما في ذلك المتطلبات والتحديات والحلول لإدارة الحالة والتخزين المؤقت والمخططات.
هذا المنشور يشرح تصميم وتنفيذ متتبع محفظة browser-first صغير بنيته. التركيز على المتطلبات، التحديات التي واجهتها، وكيف يعالجها الحل النهائي، مع مقاطع كود توضح معالجة الحالة، التخزين المؤقت، والتفاعل مع الرسوم البيانية.
← اقرأ المزيدReactJS: المصفوفات في JSX
ملخص نصيحة سريعة حول استخدام map للمصفوفات في JavaScript لعرض قوائم ديناميكية من العناصر في JSX بدلاً من الترميز الثابت للمكونات المتكررة لكود React أنظف وقابل للصيانة كما هو موضح في مثال لوحة Tic Tac Toe.
عندما جربت دليل ReactJS البرنامج التعليمي قبل بضعة أشهر، لاحظت أن في كود البداية الرسمي، كانوا يكررون نفس العناصر div في طريقة render(). في حالة تغيير المصدر، سأذكره هنا:
← اقرأ المزيد
عمار نجار