Angular هي أداة إطار عمل تستخدم بشكل أساسي لتطوير التطبيقات المكونة من صفحة واحدة. تتم كتابة الرموز البرمجية في هذه الأداة القائمة على Javascript باستخدام لغة Typescript، وعلى الرغم من أنها مفتوحة المصدر، إلا أنها تخضع للصيانة بواسطة Google. بمجرد كتابة الرمز البرمجي، يمكنك تشغيله من خلال Angular CLI لتهيئة التطبيق وتطويره ودعمه وصيانته.
يشتمل النظام الأساسي على الأدوات اللازمة لإنشاء تطبيقات ويب قابلة للتوسيع من خلال إطار عمل قائم على المكونات. لديه القدرة على إضافة مجموعة واسعة من الميزات إلى تطبيقاتك لتوجيه المستخدمين، وإدارة النماذج، والإشراف على اتصال خادم العميل، والمزيد. كما أنه يحتوي على أدوات مطور متكاملة لتطوير وبناء واختبار وتحديث المصدر لتطبيقك.
اتبع الإرشادات أدناه، وسأوضح لك كيفية تنزيل Angular وتثبيته على جهاز الكمبيوتر مجانًا.
كيفية تنزيل Angular وتثبيته على جهاز الكمبيوتر مجانًا
قبل أن تتمكن من تنزيل Angular، تحتاج إلى تثبيت Node.js. إذا كان مثبتًا بالفعل، انقر هنا للانتقال إلى تثبيت Angular.
- اضغط على زر التنزيل في الشريط الجانبي، وسيفتح موقع Node.js الرسمي.
- انقر فوق شعار ويندوز لتنزيل ملف التثبيت على ويندوز.
![تنزيل Node.js]()
- افتح الملف، وسيفتح معالج الإعداد.
- اقبل اتفاقية الترخيص واضغط على التالي.
- حدد مجلد الوجهة أو استخدم الخيار الافتراضي، واضغط على التالي.
- يمكنك تخصيص الإعداد أو تثبيت جميع المكونات. إذا قمت بتخصيص الإعداد، فتأكد من تضمين مدير الحزم npm في التثبيت. عند الانتهاء، اضغط على زر التالي.
![إعداد مخصص لـ Node.js]()
- يمكنك تحديد المربع إذا كنت تريد تثبيت أدوات للوحدات النمطية الأصلية، ولكن هذا ليس ضروريًا. اضغط على زر التالي للمتابعة.
![أدوات للوحدات الأصلية]()
- اضغط على تثبيت، وسيتم تثبيت البرنامج على جهاز الكمبيوتر الخاص بك.
- اضغط على زر إنهاء لإكمال تثبيت Node.js.
الآن وبعد تثبيت Node.js، افتح واجهة سطر الأوامر عن طريق كتابة cmd في شريط بحث ويندوز واضغط على Enter.
- اكتب npm install -g @angular/cli واضغط على Enter.
![تثبيت الزاوي]()
- سيتم سؤالك عما إذا كنت تريد مشاركة بيانات الاستخدام مع فريق Angular. يمكنك الإجابة بنعم أو لا، فلن يؤثر ذلك على البرنامج.
![]()
- سيتم تثبيت Angular على جهاز الكمبيوتر الخاص بك.
كيفية إلغاء تثبيت Angular من جهاز الكمبيوتر
إذا وجدت أن Angular ليس منصتك المفضلة لتطوير الواجهة الأمامية أو أنه لا يناسب احتياجاتك، ستحتاج إلى إلغاء تثبيته من خلال موجه الأوامر .
- اكتب cmd في شريط بحث ويندوز واضغط على مفتاح الإدخال.
- اكتب npm uninstall -g @angular/cli واضغط على مفتاح Enter
![إلغاء تثبيت الزاوي]()
- لمسح ذاكرة التخزين المؤقت، اكتب npm cache clean –force واضغط على مفتاح Enter.
إذا كنت لا تزال تبحث عن إطار عمل لتطوير تطبيقك، ألق نظرة على بدائل Angular أدناه.
نظرة عامة على Angular
Angular هو إطار تطوير قوي للواجهة الأمامية للتطبيقات يستخدمه مطورو التطبيقات الرائدون. يحتاج المستخدمون إلى فهم كيفية البرمجة باستخدام HTML و CSS و Javascript؛ إذا كانوا يجيدون استخدام هذه اللغات البرمجية سيكون استخدام هذا البرنامج سهلًا بالنسبة لهم. يوفر البرنامج للمطورين إطار عمل يزيد من الإنتاجية والسرعة في عملية التطوير. يمنح التطبيق بنية متسقة، لذلك ليست هناك حاجة لإعادة كتابة الرمز البرمجي أو إعادة إنشائه عدة مرات.
يتضمن إطار العمل Angular مكتبة مضمنة من المكونات التي يمكن أن تضيف ميزات قوية لتطوير التطبيق. بالإضافة إلى ذلك، هناك أدوات تساعدك طوال دورة حياة التطوير، من مراحل التطوير الأولية إلى اختبار الكود وتحديثه.
ميزات Angular
عندما تقوم بتطوير تطبيق باستخدام Angular، فإنه يقوم بإنشاء نموذج كائن مستند (DOM). يؤدي هذا إلى إعادة تنظيم كود XML و HTML كهيكل شجرة، حيث يتم التعامل مع كل قسم تم تمييزه بشكل منفصل. يمكن أن يكون هذا بمثابة توفير كبير للوقت عند تحديث مستند. بدلاً من الانتقال إلى كل علامة وإضافة التحديثات يدويًا، سيقوم Angular بتحديث كل شيء مرة واحدة.
استخدام ربط البيانات للمكونات التفاعلية
يعد ربط البيانات أسهل طريقة للتعامل مع عناصر الويب المختلفة من خلال المتصفحات. لا تحتاج إلى أي نصوص احترافية أو مهارات برمجة متقدمة. بدلاً من ذلك، يعمل النظام مع نص HTML الديناميكي ويسهل إضافة ميزات تفاعلية مثل الألعاب والمنتديات.
يعمل Angular مع الربط ثنائي الاتجاه بحيث تعمل حالة النموذج وحالة واجهة المستخدم معًا إلى جانب توصيل DOM ببيانات النموذج، مما يجعل إدارة الوظائف أسهل.
العناصر
المكونات هي أسس إطار العمل الذي يساعد في إنشاء التطبيق. يحتوي كل مكون على مصمم فئة Typescript، وصفحة HTML، وأنماط CSS.
يتضمن مصمم البيانات الخاص بـ Angular الميزات التالية:
- أداة تحديد CSS التي توجه الكود إلى كيفية تشغيل المكون الذي تم تحديده في القالب.
- قالب HTML يوجه Angular لكيفية العرض في المكون.
- هناك مجموعة اختيارية من القواعد التي يمكنها إضافة مزيدًا من رموز CSS البرمجية لإضافة عناصر تصميم إضافية إلى HTML.
إجراء الاختبارات
يدمج Angular إطار اختبار Jasmine لتوفير اختبار شامل للتطبيق. لا يوفر لك هذا الوقت فقط من تحميل تطبيقك إلى برامج اختبار مختلفة، ولكنه يكتشف أيضًا أخطاء ومشكلات في التصميم، وبالتالي يكون الإصدار الذي تطلقه جاهزًا لطرحه في السوق.
بدائل مجانية لـ Angular
- React: تم تصميم منصة Javascript هذه لإنشاء واجهة مستخدم سريعة وتفاعلية. إنها واحدة من أفضل الخيارات المفضلة لدى مطوري الواجهة الأمامية الذين يفضلون نظامًا أساسيًا يدمج المكتبات وأطر العمل المليئة بالمكونات اللازمة لتطوير تطبيقات الجوال والتطبيقات المستندة إلى الويب.
- Aurelia: تحتوي أداة إطار العمل سهلة الاستخدام على مكتبات متعددة تعمل معًا لتحسين واجهة المستخدم للتطبيقات المستندة إلى الويب والتطبيقات المحمولة. تقوم Aurelia بإنشاء كتلة واحدة من الرموز البرمجية التي تحتوي على جميع مكونات التطبيق في حزمة واحدة.
الأسئلة الشائعة
هل Angular مجاني؟
نعم! Angular هو برنامج مجاني مفتوح المصدر يستخدم رخصة MIT المسموح بها. اتبع الإرشادات أعلاه، وسأوضح لك كيفية تنزيل Angular وجميع المكونات اللازمة لتشغيل برنامج واجهة سطر الأوامر.
هل Angular آمن؟
لدى Angular العديد من الإجراءات المعمول بها لمنع ثغرات HTTP الشائعة وتزوير الطلبات عبر المواقع وإدراج البرنامج النصي عبر المواقع. بالإضافة إلى ذلك، فإن البرنامج مفتوح المصدر، مما يسمح للمطورين بفحص الكود والتأكد من عدم وجود ملفات أو تعليمات برمجية ضارة يتم إدخالها في البرنامج.
من أجل أمانك، يجب عليك اتباع الإرشادات أعلاه وتنزيل الإصدار الرسمي من Angular وتجنب مواقع الجهات الخارجية. خلاف ذلك، ستتعرض لخطر الفيروسات أو البرمجيات الخبيثة أو برامج التجسس التي يتم تحميلها على المثبت الذي يمكنه تجاوز جميع تدابير الأمان الخاصة بك.
هل Angular سهل الاستخدام؟
إذا كان لديك فهم أساسي لـ HTML و Javascript و TypeScript، يجب أن تكون قادرًا على البدء في استخدام Angular دون أي مشاكل. يمنح إطار العمل التطبيقات بنية متسقة، وبمجرد أن تتعرف عليها، ستتمكن من الانتقال خلال مرحلة التطوير بسرعة.