Awesome GitHub RepositoriesFrontend Development

هذا المشروع عبارة عن مستودع تعليمي لـ JavaScript ودورة برمجية. يوفر مجموعة من أمثلة الكود والمشاريع العملية المصممة لتعلم لغة البرمجة JavaScript. يغطي المستودع تعلم اللغة من خلال تمارين عملية، بما في ذلك تنفيذ مشاريع برمجية وممارسة الخوارزميات. يركز على كل من تطوير ويب الواجهة الأمامية وتطبيق البرمجة كائنية التوجه. يتضمن المحتوى مواد لإدارة المتغيرات وأنواع البيانات، وإجراء العمليات الحسابية، ومعالجة السلاسل والتواريخ. كما يوفر أمثلة لمقارنة قيم البيانات وهيكلة الكود باستخدام الفئات (classes) والنماذج الأولية (prototypes).

Scala.js هو مترجم وسلسلة أدوات لغة عبر المنصات تحول كود مصدر Scala إلى JavaScript أو WebAssembly. تعمل كأداة مكتوبة بشكل ثابت لنظام JavaScript البيئي، مما يتيح تطوير تطبيقات لمتصفحات الويب وبيئات Node.js. يعمل المشروع كإطار عمل للتوافق مع JavaScript، مما يسمح بإنشاء واجهات وربط آمنة للأنواع للتفاعل مع المكتبات الخارجية والكائنات العالمية. يوفر آليات لاستدعاء JavaScript الثابت والديناميكي، بما في ذلك إنشاء روابط TypeScript والقدرة على تصدير المنطق الداخلي للاستخدام في كود JavaScript خارجي. تتضمن سلسلة الأدوات أداة بناء واجهة أمامية لتجميع الإنتاج وتحسين المخرجات، بما في ذلك إزالة الكود الميت وتقسيم الوحدات. تغطي مساحة واسعة من القدرات بما في ذلك التحقق من نوع عنصر DOM لتطوير واجهة المستخدم، ومشاركة الكود عبر المنصات للتطوير الكامل (full-stack)، وأطر اختبار متنوعة للتحقق من عناصر البناء المحسنة. يمكن تنفيذ النصوص المجمعة مباشرة داخل بيئة سطر الأوامر باستخدام مترجم JavaScript.

TypeScript-Vue-Starter هو قالب مشروع مهيأ مسبقاً ومجموعة أدوات بداية مصممة لبناء تطبيقات ويب باستخدام Vue و TypeScript. يوفر أساساً هيكلياً لإنشاء بيئات واجهة مستخدم آمنة من حيث النوع (type-safe) من خلال هيكلة المشروع المتكاملة والقوالب الجاهزة. يتميز المشروع بدمج مصممات فئات TypeScript (class decorators) مع مكونات Vue، مما يسمح بنهج منظم لتعريف بيانات المكونات وخصائصها. يدعم هذا الإعداد مكونات الملف الواحد التي تجمع بين الترميز (markup) والتنسيق والمنطق في وحدات نمطية ومفحوصة النوع. تتضمن البيئة خطوط معالجة بناء تلقائية وتجميع أصول لتحويل الكود المصدري المكتوب بقوة الأنواع إلى JavaScript قابلة للتوزيع. تدير هذه الأدوات عملية التجميع وتغلف عناصر الواجهة القابلة لإعادة الاستخدام للتنفيذ في متصفحات الويب.

vscode-browser-preview هو أداة معاينة ويب ومصحح أخطاء مدمج في المحرر يقوم بتضمين مثيل متصفح حي مباشرة داخل مساحة العمل. يستخدم تكامل المتصفح بدون واجهة (Headless) لمزامنة حالة المتصفح مع محرر الكود النشط. يوفر المشروع مصحح أخطاء ويب متكاملاً يسمح للمستخدمين بتعيين نقاط التوقف وفحص حالة تطبيقات الويب دون مغادرة واجهة المحرر. كما يتيح الوصول إلى أدوات المطور عن بُعد عبر رابط شبكة لتحليل عناصر الصفحة، والأنماط، ونشاط الشبكة. يدعم النظام سير عمل تطوير الواجهة الأمامية من خلال توفير معاينات ويب داخل المحرر للعرض في الوقت الفعلي للأنماط والتخطيطات. يتضمن ذلك قدرات لفحص حالة المتصفح وتصحيح أخطاء تطبيقات الويب.

This project is a comprehensive JavaScript programming tutorial and frontend web development curriculum. It serves as a structured educational resource for learning the JavaScript language, ranging from basic syntax to advanced asynchronous patterns and modern programming techniques. The resource functions as a frontend engineering textbook and CSS layout guide, providing detailed instructional material on building responsive user interfaces. It covers the design of custom web components and the application of styles and positioning to create effective frontend interfaces. The curriculum enc

rxdrag is a declarative frontend framework and low-code builder used to create web interfaces and application logic visually. It functions as an HTML web interface designer and visual logic orchestrator, allowing users to define structures and data flows through a graphical interface to reduce imperative coding. The system enables the design of responsive frontend layouts and user interactions using a coordinate-based editor. It integrates a logic engine that allows application behavior to be defined by arranging visual blocks rather than writing manual code. The framework covers frontend wo

Vuestic UI is a Vue 3 component library providing a collection of pre-made user interface elements. It serves as a responsive UI framework and a themed component system designed to speed up frontend development and maintenance. The toolkit features a centralized configuration system for global styling and dynamic branding, including a built-in dark mode. It includes an internationalized interface toolkit with native support for localization and translating application content for multiple languages. The library provides a set of accessible web components that meet accessibility standards for

This project is a frontend development tutorial and web programming educational resource. It serves as a structured JavaScript web development course and a step-by-step guide designed to teach the core technologies used to create interactive and modern user interfaces. The curriculum focuses on mastering the combination of HTML, CSS, and JavaScript through a series of exercises and projects. It covers frontend development training and JavaScript programming education to help users learn modern web development standards. The material covers the construction of interactive websites, front end

CSS Guidelines هو دليل أسلوب ومرجع شامل لكتابة CSS قابلة للصيانة، وقابلة للتوسع، ومعيارية في مشاريع الويب واسعة النطاق. يوفر مجموعة من المعايير المهنية لتنظيم أوراق الأنماط وتنفيذ أنماط تسمية متسقة لتحسين صحة قاعدة الكود على المدى الطويل وتقليل الديون التقنية. يركز المشروع على منهجية صارمة لتحديد نطاق الفئات لإنشاء مكونات معزولة ويمكن التنبؤ بها، مما يمنع تسرب الأنماط بين الأجزاء المستقلة لواجهة المستخدم. وهو يؤكد على تسلسل هرمي مسطح للمحددات لتجنب تعارضات الخصوصية ويشجع على فصل التخطيط الهيكلي عن الجماليات المرئية. من خلال تنظيم الكود في هياكل دليل منطقية وتطبيق مبادئ التصميم ذات المسؤولية الواحدة، تضمن المبادئ التوجيهية بقاء الأنماط سهلة التحديث والتجاوز مع نمو المشروع. تغطي هذه المعايير الجوانب الأساسية لبناء أنظمة تصميم موثوقة، بما في ذلك إدارة طبقات التتالي وتنفيذ أنماط معمارية متسقة. تعمل الوثائق كمرجع مركزي للفرق التي تهدف إلى إنشاء اتفاقيات تصميم متسقة وعالية الجودة عبر واجهات معقدة.

يوفر هذا المشروع دليل أسلوب وإطار عمل معمارياً شاملاً لبناء مكونات قابلة للصيانة ومعيارية ومتسقة داخل نظام Vue.js البيئي. يضع مجموعة من القواعد القياسية لتنظيم عناصر واجهة المستخدم في وحدات مستقلة، مما يضمن بقاء المنطق والأنماط معزولة لمنع الآثار الجانبية غير المقصودة. يتميز الدليل بالتركيز على التغليف الصارم وتصميم الواجهة الواضح. يعزز استخدام نطاق الأنماط القائم على مساحة الاسم (namespace-based) لمنع التسرب المرئي ويفرض مدخلات مكونات يمكن التنبؤ بها من خلال اصطلاحات تسمية وصفية وأنواع بيانات بسيطة. من خلال تحديد حدود واضحة لتفاعلات المكونات، يضمن إطار العمل بقاء الوحدات الفردية مستقلة وقابلة لإعادة الاستخدام عبر التطبيقات واسعة النطاق. بعيداً عن الأنماط المعمارية الأساسية، يغطي المشروع نطاقاً واسعاً من معايير التطوير، بما في ذلك التسلسلات الهرمية للملفات القياسية، والتدقيق الآلي (linting)، وممارسات التوثيق لواجهات المكونات. ويؤكد على أهمية استخراج المنطق المعياري واصطلاحات التسمية المتسقة لتسهيل التعاون بين فرق الهندسة الكبيرة. يعمل المستودع كمرجع لتنفيذ ممارسات الترميز الموحدة والأنماط الهيكلية طوال دورة حياة التطوير.

هذا المشروع عبارة عن مجموعة شاملة من تمارين تطوير الويب ومفاهيم التطبيقات المصممة لمساعدة المطورين على ممارسة وتحسين كفاءتهم التقنية. يعمل كمورد منسق لبناء مشاريع برمجية متنوعة، بدءاً من أدوات المرافق البسيطة إلى تطبيقات الويب التفاعلية المعقدة التي توضح مهارات البرمجة الأساسية وتصميم الواجهة. يتميز المستودع بتوفير مجموعة واسعة من تحديات التنفيذ العملية التي تغطي النطاق الكامل لتطوير الواجهة الأمامية والتطوير المتكامل. يمكن للمستخدمين المشاركة في مهام تتطلب إدارة حالة جانب العميل، والتعامل مع البيانات غير المتزامنة من واجهات برمجة التطبيقات الخارجية، وتنفيذ الاستمرارية القائمة على المتصفح للحفاظ على معلومات المستخدم عبر الجلسات. تم هيكلة هذه المشاريع لمساعدة المطورين على إتقان تكوين الواجهة القائم على المكونات والتفاعلات القائمة على الأحداث. تمتد المجموعة عبر العديد من المجالات الوظيفية، بما في ذلك أدوات الإنتاجية مثل المؤقتات ومديري المهام، والتطبيقات التي تركز على الوسائط مثل مشغلات الفيديو وقواعد بيانات الأفلام، والواجهات الموجهة للأعمال مثل واجهات المتاجر الإلكترونية ولوحات الوظائف. كما يتضمن أدوات لتتبع الأموال، وإدارة الأحداث، وتوليد المحتوى التفاعلي، مما يسمح باستكشاف معالجة البيانات المختلفة وأنماط واجهة المستخدم.