بخش های اصلی

آموزش AngularJS

آموزش AngularJS - مرور کلی

AngularJS چیه؟

AngularJS یک فریم ورکِ برنامه ی کاربردیِ وبِ سورس بازه. AngularJS در اصل در سال 2009 توسط میسکو اِوِری و اَدام اَبرانز تولید شد. در حال حاضر به گوگل واگذار شده. آخرین نسخه ی آن 1.4.3. است.

تعریف AngularJS، بر اساس تعریفی که در مستنداتِ اختصاصی آن آمده بصورت زیره:

AngularJS، یک فریم ورکِ ساختاری برای برنامه های کاربردی وبِ پویاست. AngularJS امکان استفاده از HTML را بعنوان زبان الگو، به شما میده و همینطور گسترش دستورالعمل های HTML را نیز جهت ارائه ی اجزای برنامه بصورت دقیق و خلاصه، امکان پذیر می کنه. اتصال اطلاعاتیِ (data binding)   AngularJS و تزریق وابستگی (dependency injection)، بیش ترِ کدی که باید بنویسین را حذف می کنه. تمام این موارد داخل مرورگر اتفاق میفتن و به این ترتیب AngularJS در تمام تکنولوژی های سرور، شریکی ایده آلِه.

ویژگی ها

  • AngularJS، جاوا اسکریپتی قدرتمند و مبتنی بر فریم ورکِ توسعه ست، برای ایجاد یک برنامه ی اینترنتیِ قدرتمند (RIA).
  • AngularJS، برای توسعه دهنده ها آپشن هایی را برای نوشتن برنامه های سمت کلاینت (با استفاده از جاوا اسکریپت) به روش واضحِ MVC (مدل، نمایش، کنترلر) ارائه میده.
  • برنامه های نوشته شده با AngularJS با مرورگر سازگارن. AngularJS، کد جاوااسکریپت مناسب برای تمام مرورگرها را بصورت اتوماتیک اجرا می کنه.
  • AngularJS، سورس باز و کاملاً مجانیِه و توسط هزاران توسعه دهنده در سراسر جهان استفاده میشه. AngularJS تحت لایسِنسِ (licensed) Apache License version 2.0 است.

روی هم رفته، AngularJS، فریم ورکی برای ساختن برنامه های بزرگ و پرکاربرده و قابلیت نگهداری آن ها را آسان می کنه.

ویژگی های اساسی

موارد زیر مهم ترین ویژگی های اساسیِ AngularJS هستن:

  • Data-binding (اتصال داده) – این مورد همان هماهنگ سازی خودکار داده بین اجزای model (مدل) و view (نمایش) است.
  • Scope (حوزه) – این گزینه، اشیایی هستن که به model (مدل) اشاره می کنن. آن ها میان controller (کنترلر) و view (نمایش)، مثل چسب عمل می کنن.
  • controller (کنترلر) – این گزینه، تابع هایِ  (functions) جاوا اسکریپتیِه که به حوزه ی خاصی متصلَن.
  • Services (سرویس ها) – AngularJS، سرویس های تعبیه شده ی زیادی داره مثل $http که برای ساختن یک XMLHttpRequests است. این سرویس ها، اشیاءِ واحدی هستن که فقط یک بار در برنامه نمونه سازی میشن.
  • Filters (فیلترها) – این مورد، یک زیردامنه از آیتم های یک آرایه را انتخاب می کنه و یک آرایه ی جدید برمی گردانه.
  • Derectives (دستورات) – Derectives ، نشانه هایی در عناصر DOM (مثل عناصر، خصیصه ها (attributes)، CSS و...) هستن. Derectiveها برای ایجاد تگ هایِ HTML سفارشی که بعنوان ویجت های جدید و سفارشی ارائه میشن، به کار میرن. AngularJS دارای directivesهای داخلیِه (ngBind, ngModel…)
  • Templates (الگوها) – Templateها viewای تفسیر شده (rendered) هستن بهمراهِ اطلاعاتی از controller (کنترلر) و view (نمایش). Templateها می توانند یک فایل واحد باشن (مثل index.html) یا با استفاده از partial”ها”، چندین view در یک صفحه باشن.
  • Routing (مسیریابی) – این مورد مفهومِ switching viewهاست.
  • هرچیزی، Model ,View  - MVC یک الگوی طراحیِه برای تقسیم برنامه ی کاربردی به بخش ها مختلف (که به این بخش ها Model، View و Controller می گن)، و هر یک از این بخش ها مسئولیتی مجزا دارن. AngularJS در مفهوم اساسی خودش، MVC را پیاده سازی نکرده ولی چیزی شبیه به آن را به نام MVVM (Model-View-ViewModel) پیاده سازی کرده. تیم AngularJS، بگونه ای طنز آمیز، نام این مدل را ، "هر چی، View، Model" گذاشته.
  • Deep Linking – این مورد، رمزگذاری وضعیت برنامه را در URL، امکان پذیر می کنه، به این ترتیب می توان این وضعیت را نشانه گذاری (boolmark) کرد. سپس برنامه می تواند از طریق URLای که نشانه گذاری شده، به وضعیتی مشابه برگرده.
  • Dependency Injection (تزریق وابستگی) – AngularJS یک زیرسیستمِ تعبیه شده ی Dependency Injection (تزریق وابستگی) داره که به توسعه دهنده کمک می کنه تا توسعه، درک و تستِ برنامه را راحت تر کنه.

مفاهیم

نمودار زیر بعضی از بخش های مهم AngularJS را به تصویر کشیده که در بخش بعدی راجع به جزئیات آن ها صحبت خواهیم کرد.

angularjs concepts

مزایای AngularJS

  • AngularJS، ویژگی هایی برای ایجاد صفحه ای واحد در یک نرم افزار به روشی واضح و با قابلیت نگهداری، ارائه میده.
  • AngularJS، قابلیت اتصال داده را برای HTML امکان پذیر می کنه به این ترتیب به کاربران تجربه ای واکنشی و ارزشمند میده.
  • کدِ AngularJS ، unit tastable (قابلیت تست کردن بصورت واحدی) است.
  • AngularJS از تزریق وابستگی (dependency injection) استفاده می کنه و استفاده از مفاهیم را مجزا می کنه.
  • AngularJS، اجزائی با قابلیت استفاده ی مجدد ارائه میده.
  • با AngularJS، توسعه دهنده، کد کمتری خواهد نوشت و کارایی بیش تری خواهد داشت.
  • در AngularJS، viewها صفحه های هستن از کد HTML خالص و controllerها که به زبان جاوا اسکریپت نوشته شدن و کار پردازش را انجام میدن.

مهم تر از همه چیز، برنامه های AngularJS روی تمام مرورگرهای مطرح و موبایل های هوشمند مثل آندروید و IOS مبتنی بر موبایل ها/تبلت ها، قابل اجرا هستن.

معایب AngularJS

با این که AngularJS امتیازات زیادی داره ولی در عین حال باید به نکات زیر هم توجه کنیم:

  • امن نیست – چون جاوا اسکریپت فقط یک فریم ورکِه، برنامه های نوشته شده با AngularJS امن نیستن. اهراز هویت و صدور مجوز سمت سرور باید امنیت برنامه را تأمین کنه.
  • تجزیه پذیر نیست – اگه کاربرِ برنامه تان، جاوا اسکریپت را غیر فعال کنه، فقط صفحه ی پایه را خواهد دید.

اجزای AngularJS

فریم ورکِ AngularJS به بخش های اصلی زیر تقسیم میشه:

  • ng-app – این دستور یک برنامه ی AngularJS را تعریف کرده و به HTML لینک می کنه.
  • ng-model – این دستور مقادیر داده های برنامه ی AngularJS را به کنترل های ورودی HTML متصل می کنه.
  • ng-bind – این دستور داده های برنامه ی AngularJS را به تگ های HTML متصل می کنه.

مبحث آموزشی

آموزش AngularJS

Learn AngularJS

پرســیدن سؤال جدید

سؤال های تخصصی خود را از ما بپرسید

تبلیغات

دنبال کردن تلگرام کانال سافت اسکیل

https://telegram.me/softskill_ir

عملیات کاربران

خبـرنــامه

Newsletters

در خبــرنـامه سافت اسکیل عضو شویــد تا جدیدترین هـای سایت را بلافاصله در ایمیل خـود دریافت کنیـد