في الماضي ، يستخدم التطوير الأمامي (الويب أو الهاتف المحمول) بشكل أساسي JQuery + Native JS. إذا تم استخدام بعض أطر عمل واجهة المستخدم الأمامية ، فقد يوفر أيضًا بعض واجهات برمجة التطبيقات لاستخدامه. علاوة على ذلك ، تعتمد العديد من أطر عمل واجهة المستخدم على jQuery ، وبالتالي فإن الفترة من jQuery إلى AngularJS كبيرة نسبيًا. لقد درست AngularJS لفترة من الوقت. لنتحدث عن التجربة العامة:
حول المقارنة مع jQuery
بادئ ذي بدء ، Angular هو إطار MVC. الفرق بينه وبين jQuery هو أن الأول ملتزم بفصل رمز MVC ويستخدم النموذج والوحدة والرؤية لتنظيم الكود. يوفر لك الأخير العديد من وظائف API. لا يمكنك أن تكتب العديد من JS الأصليين لتحقيق تأثيرات أكثر تعقيدًا ، مثل الرسوم المتحركة ، $. إذا كنت بحاجة إلى كتابة JS الأصلي ، فسيكون حجم الكود كبيرًا نسبيًا ؛
ثانياً ، لا تحدد jQuery كيفية تنظيم الكود الخاص بك. يمكنك وضعه في ملف JS منفصل للرجوع إليه ، أو يمكنك كتابته مباشرة في الصفحة للفه باستخدام علامات البرنامج النصي ، أو حتى كتابته مباشرة في علامة HTML في الخط. ومع ذلك ، ستقسم AngularJs صفحة HTML إلى عدة وحدات ، يمكن أن يكون لكل وحدة نطاقها وخدمتها وتوجيهاتها ، ويمكن تنفيذ التواصل بين الوحدات النمطية ، لكن الهيكل العام واضح نسبيًا ، أي أن طريقة تنظيم الكود وحدات.
أخيرًا ، تتمثل فكرة JQuery في تصميم الصفحة أولاً ، ثم تنفيذ عمليات DOM على الصفحة الحالية وعرض الصفحة. ومع ذلك ، قد تكون العرض الزاوي مجرد إطار ، ويتم تنفيذ عمليات DOM أو مراقبة الوقت للعرض في التوجيه. بشكل عام ، نادراً ما يتم كتابته مباشرة من قبل نفسك ، طالما أنك تستمع إلى النموذج. سيتغير العرض أيضًا بعد تغيير النموذج.
حول المناسبات المعمول بها
يجب أن تكون jQuery مناسبة لمعظم تطوير الويب ، وهناك أيضًا jQueryMobile على جانب الهاتف المحمول. يقول بعض الأشخاص أن AngularJS أكثر ملاءمة للسبا (أعتقد شخصياً أن السبا على الهواتف المحمولة قد يتسبب في مشاكل في الأداء لأن آلية الفحص القذرة ستؤثر على الأداء). على جانب الويب ، لا يزال من الممكن استخدام بعض تطبيقات CRUD أو برامج الإدارة (بالطبع ، قد لا يكون الفهم هنا دقيقًا ، وسوف تفهمه أكثر مع التعلم المتعمق).
حول مزيج واجهة المستخدم
يتطلب تطوير أي منتج استخدام واجهة المستخدم الأمامية. حاليًا ، تعتمد العديد من واجهة المستخدم على jQuery ، مما يعني أنه إذا كنت ترغب في استخدام AngularJS ومكونات واجهة المستخدم هذه ، فأنت بحاجة إلى استخدام توجيه AngularJS لإعادة كتابة بعض المكونات. هذه العملية مزعجة للغاية. لحسن الحظ ، يوفر لنا Angular بعض مكونات واجهة المستخدم التي يمكن استخدامها (يجمع جانب الويب بشكل أساسي بين مكونات الواجهة الأمامية bootstrap) ، http://angular-ui.github.io/ ، وعلى جانب الأجهزة المحمولة ، يجمع بشكل أساسي بين الإطار الأيوني http://ionicframework.com/. ومع ذلك ، مع تطوير Angular ، فإن العديد من أطر عمل HTML5 الأمامية قد دمجت تدريجيا إصدارات AngularJS للاستخدام.
حول ميزات AngularJS
1. الربط ثنائي الاتجاه للبيانات: قد تكون هذه ميزة أكثر إثارة. بيانات طبقة العرض وبيانات طبقة النموذج هي ربط ثنائي الاتجاه. إذا تغير أحدهم ، فسيتغير الجانب الآخر وفقًا لذلك. لا تحتاج إلى كتابة أي رمز! (فكر في كيفية القيام بذلك في وضع jQuery)
2. الكود معياري ، ورمز كل وحدة له نطاقه الخاص ، ونموذج ، ووحدة تحكم ، إلخ.
3. يمكن للتوجيه القوي أن يلف العديد من الوظائف في علامات HTML أو السمات أو التعليقات ، وما إلى ذلك ، والتي تعمل على تجميل بنية HTML بشكل كبير ويعزز قابلية القراءة ؛
4. حقن التبعية ، وإعطاء نمط تصميم لغة الواجهة الخلفية هذه إلى الكود الأمامي ، مما يعني أن الكود الأمامي يمكن أن يحسن قابلية إعادة الاستخدام والمرونة. في المستقبل ، قد يضع النموذج عددًا كبيرًا من العمليات على العميل ، ويوفر الخادم مصادر وعمليات بيانات فقط لا يمكن للعملاء الآخرين إكمالها ؛
5. التنمية التي تحركها الاختبار ، يهدف AngularJS إلى البدء بهذا. يمكن للتطبيقات التي تم تطويرها باستخدام Angular إجراء اختبار الوحدة بسهولة واختبار شامل إلى النهاية ، مما يحل أوجه القصور في رمز JS التقليدي الذي يصعب اختباره وصيانته.
ما سبق هو الاستنتاج الذي استخلا عنه من خلال دراسة AngularJS لفترة من الزمن. قد يتم حذف بعض المناطق. لا يهم. بعد ذلك ، سنقوم بتطوير إحدى النقاط ونتعلم خطوة بخطوة.