تعلّم JavaScript عبر الإنترنت وابنِ صفحات ويب تستجيب

• أين تعمل JavaScript: المتصفح وNode.js
• إضافة شيفرة إلى صفحة ويب
• وحدة تحكم المتصفح و⁦console.log()⁩
• الجمل والتعليقات والوضع الصارم (strict mode)

console.log("Hello from JavaScript");

• ⁦let⁩ و⁦const⁩، ولماذا نتجنب ⁦var⁩
• الأعداد والنصوص والقيم المنطقية و⁦null⁩ و⁦undefined⁩
• القوالب النصية (template literals)
• ⁦typeof⁩ وتحويل الأنواع

const name = "Sara"; let score = 0;

• ⁦if⁩ و⁦else if⁩ و⁦else⁩
• عوامل المقارنة والعوامل المنطقية، ومنها ⁦===⁩ و⁦!==⁩
• حلقات ⁦for⁩ و⁦while⁩ و⁦for…of⁩
• جمل ⁦switch⁩

for (const n of [1, 2, 3]) console.log(n * 2);

• تعريف الدوال والدوال السهمية
• المعاملات والقيم الافتراضية و⁦return⁩
• النطاق والإغلاقات (closures)
• تمرير دالة إلى دالة أخرى (دوال الاستدعاء)

const square = (x) => x * x;

• إنشاء المصفوفات وقراءتها وتحديثها
• دوال المصفوفات: ⁦map, filter, find, reduce⁩
• الكائنات وخصائصها ودوالها
• التفكيك (destructuring) وعامل النشر (spread)
• JSON: تحويل البيانات إلى نص والعكس

const passed = marks.filter((m) => m >= 50);

• اختيار العناصر باستخدام ⁦querySelector⁩
• تغيير النصوص والأصناف والأنماط
• إنشاء العناصر وإزالتها
• الأحداث: ⁦click, input, submit⁩
• التحقق من النموذج قبل إرساله

button.addEventListener("click", showResult);

• لماذا تنتظر بعض الشيفرات: المؤقتات وحلقة الأحداث
• دوال الاستدعاء والوعود
• ⁦async⁩ و⁦await⁩
• تحميل البيانات باستخدام ⁦fetch()⁩ ومعالجة الفشل باستخدام ⁦try⁩ و⁦catch⁩

const res = await fetch("/data.json");

• تعليقات الأنواع والاستدلال والمترجم (⁦tsc⁩)
• الواجهات وأسماء الأنواع المستعارة والخصائص الاختيارية
• أنواع الاتحاد والأنواع الحرفية وتضييق الأنواع
• الأنواع العامة (generics) في الدوال والأصناف والواجهات
• الأنواع المساعدة مثل ⁦Partial, Pick, Record⁩
• الوضع الصارم و⁦tsconfig⁩ وتحديد أنواع البيانات القادمة من API

function first<T>(items: T[]): T | undefined { return items[0]; }

• المكوّنات وJSX
• الخصائص (props) والحالة (state) والخطاف ⁦useState⁩
• الأحداث والنماذج والمدخلات المتحكَّم بها
• القوائم والمفاتيح والعرض الشرطي
• ⁦useEffect⁩ وتحميل البيانات
• الخطافات المخصّصة وcontext، وReact مع TypeScript

const [count, setCount] = useState(0);

• المكوّنات والقوالب وربط البيانات
• تدفق التحكم المدمج والتوجيهات (directives)
• الخدمات وحقن الاعتماديات
• التوجيه بين الصفحات
• النماذج المعتمدة على القوالب والنماذج التفاعلية
• ⁦HttpClient⁩ وأساسيات RxJS observables

@Component({ selector: "app-tasks", templateUrl: "./tasks.html" })

• المكوّنات الأساسية: ⁦View, Text, Image, FlatList⁩
• التنسيق باستخدام ⁦StyleSheet⁩ وFlexbox
• اللمس وإدخال النص والإيماءات البسيطة
• التنقّل بين الشاشات
• تحميل البيانات من API في تطبيق جوّال
• تشغيل التطبيق على هاتفك أو على محاكٍ

<Text style={styles.title}>My tasks</Text>