آموزش فارسی انگولار ۵ ( شامل انگولار ۲ تا ۵) + پروژه محور

کد دوره:‌ 951858
پرفروش
فهرست و سرفصل ها
  • فصل 1: معرفی دوره، مقدمه و تنظیمات اولیه نمایش رایگان
    30:30
  • فصل 2: ویرایش نرم‌افزار و نصب فریم ورک بوت استراپ نمایش رایگان
    29:42
  • فصل 3: کامپوننت‌‌‌‌‌‌‌‌ها (Components)
    24:49
  • فصل 4: ارتباط داده‌ای دو طرفه (Two-Way-Databinding)
    35:40
  • فصل 5: دستورها (Directives)
    31:27
  • فصل 6: پروژه عملی فروشگاه اینترنتی (قسمت اول)
    57:31
  • فصل 7: فایل‌های پروژه فروشگاه اینترنتی (قسمت اول)
    -
  • فصل 8: خطایابی (Debugging)
    14:19
  • فصل 9: سطح پیشرفته کامپوننت‌ها (قسمت اول)
    34:40
  • فصل 10: سطح پیشرفته کامپوننت‌ها (قسمت دوم)
    15:06
  • فصل 11: سطح پیشرفته کامپوننت‌ها (قسمت سوم)
    23:48
  • فصل 12: پروژه عملی فروشگاه اینترنتی (قسمت دوم)
    40:42
  • فصل 13: فایل‌های پروژه فروشگاه اینترنتی (قسمت دوم)
    -
  • فصل 14: سطح پیشرفته دستورها (Directives) - قسمت اول
    22:44
  • فصل 15: سطح پیشرفته دستورها (Directives) - قسمت دوم
    20:56
  • فصل 16: پروژه عملی فروشگاه اینترنتی (قسمت سوم)
    07:08
  • فصل 17: فایل‌های پروژه فروشگاه اینترنتی (قسمت سوم)
    -
  • فصل 18: سرویس ها (Services) و تزریق وابستگی (DI)
    34:00
  • فصل 19: پروژه عملی فروشگاه اینترنتی (قسمت چهارم)
    44:57
  • فصل 20: فایل‌های پروژه فروشگاه اینترنتی (قسمت چهارم)
    -
  • فصل 21: مسیردهی (Routing) - قسمت اول
    25:36
  • فصل 22: مسیردهی (Routing) - قسمت دوم
    40:27
  • فصل 23: مسیردهی (Routing) - قسمت سوم
    24:15
  • فصل 24: احراز هویت کاربران (Gaurd و Authentication)
    25:12
  • فصل 25: ارسال پارامترها توسط مسیردهی (Routing)
    17:37
  • فصل 26: پروژه فروشگاه اینترنتی (قسمت پنجم)
    31:19
  • فصل 27: فایل‌های پروژه فروشگاه اینترنتی (قسمت پنجم)
    -
  • فصل 28: Observable یا مشاهده کننده و Observer یا مشاهده گر
    24:52
  • فصل 29: Subject ها و عملگرها (Operator) در پکیج RxJs
    20:59
  • فصل 30: پروژه فروشگاه اینترنتی (قسمت ششم)
    08:23
  • فصل 31: فایل پروژه فروشگاه اینترنتی (قسمت ششم)
    -
  • فصل 32: فرم ها با رویکرد Template-Driven (قسمت اول)
    32:39
  • فصل 33: فرم ها با رویکرد Template-Driven (قسمت دوم)
    32:16
  • فصل 34: فرم ها با رویکرد Reactive (قسمت اول)
    21:27
  • فصل 35: فرم ها با رویکرد Reactive (قسمت دوم)
    31:24
  • فصل 36: پروژه فروشگاه اینترنتی (قسمت هفتم)
    1:23:15
  • فصل 37: فایل پروژه فروشگاه اینترنتی (قسمت هفتم)
    -
  • فصل 38: معرفی Pipe ها و راه اندازی فیلتر
    35:09
  • فصل 39: معرفی Api و درخواست های HttpClient
    45:28
  • فصل 40: مدیریت درخواست های Http و کار با Http Interceptor
    25:24
  • فصل 41: پروژه فروشگاه اینترنتی (قسمت هشتم)
    16:52
  • فصل 42: فایل پروژه فروشگاه اینترنتی (قسمت هشتم)
    -
  • فصل 43: احزار هویت کاربران با استفاده از Token
    38:58
  • فصل 44: بهینه سازی ماژول ها
    24:33
  • فصل 45: Lazy Loading ماژول ها و بهینه سازی کدها
    27:15
  • فصل 46: فایل های پروژه فروشگاه اینترنتی (قسمت نهم)
    -
  • فصل 47: انیمیشن ها در انگولار (قسمت اول)
    17:59
  • فصل 48: انیمیشن ها در انگولار (قسمت دوم)
    10:51
  • فصل 49: کار با Unit Testing در انگولار
    43:13
توضیحات دوره

دوره آموزش انگولار 5 به زبان فارسی به شما کمک می‌کند تا یک فرانتندکار (Frontend) حرفه‌ای شوید. اگر چنانچه هیچ دانشی درباره فریم ورک‌های جاوا اسکریپت ندارید اصلا نگران نباشید چون در این دوره شما را از یک فرد کاملا مبتدی به یک برنامه نویس حرفه‌ای در این زمینه تبدیل می‌کنیم.

an-introduction-to-angulars-digest-cycle_thumb.jpg

مخاطب دوره آموزش فارسی انگولار 5 کیست؟

  • تمام افراد مبتدی و همچنین توسعه‌دهندگان حرفه‌ای و پیشرفته که علاقه‌مند به یادگیری یک فریم ورک سطح بالا هستند
  • این دوره برای همه‌ی علاقه‌مندان به طراحی وب سمت کاربر (Frontend) و فول استک‌ها (Full Stack) مناسب است.

با یاد گیری این دوره شما می‌توانید جزو اولین کسانی باشید که از انگولار درک عمیقی پیدا کرده‌اید.

پیش‌نیازها

  • نیازی به دانش انگولار ‍۱ یا انگولار ۲ و ۴ نیست
  • یادگیری اصول اولیه زبان HTML و CSS (در سطح مقدماتی)
  • دانش اولیه در ارتباط با زبان تایپ اسکریپت (TypeScript) - برای یادگیری اینجا کلیک کنید
  • دانش اولیه و مقدماتی درباره زبان جاوا اسکریپت (JavaScript)

شرح دوره

این دوره به آموزش انگولار 5 به زبان فارسی می‌پردازد و در طی فصول متفاوت شما را از یک فرد کاملا مبتدی به یک برنامه نویس حرفه‌ای سمت کاربر (Frontend) تبدیل می‌کند. این آموزش فارسی به گونه‌ای ارائه شده است که از نصب تا راه اندازی انگولار 5 روی سرور واقعی را‌ به شما آموزش می‌دهد. هر آنچه که درباره کامپوننت‌های انگولار، دستورها، سرویس‌ها، فرم‌ها، دسترسی Http، احزار هویت (Authentication)، بهینه‌سازی نرم افزار انگولاری و ... لازم باشد به شما ارائه می‌دهیم. به طور کلی شما در طی این دوره یاد می‌گیرید که چگونه یک وب اپلیکیشن مشابه موبایل در سطح اینترنت راه اندازی کرده تا کاربران از تجربه کاربری فوق العاده‌ای بهره ببرند.

این دوره به شما تمام اصول مرتبط با ماژول‌ها، مسیریابی (Routing)، ارتباط با api، ارتباط دو طرفه (DataBinding) و .. را به زبان بسیار ساده آموزش می‌دهد. به زبان عامیانه اینجا شما به صورت کامل غواصی در عمق انگولار رو یاد می‌گیرید. :)

ما در دوره آموزش انگولار 5 به سوالات زیر پاسخ خواهیم داد:

  • معماری انگولار ۲، ۴ یا 5 یا 6 چگونه است؟
  • چطور از زبان تایپ اسکریپت (TypeScript) برای آموزش انگولار 5 استفاده کنم؟
  • دستورها (Directives) و کامپوننت‌ها (Components) چی هستند؟
  • ارتباط دو طرفه داده‌ای (Two-Way-Databinding) چیست و چگونه کار می‌کند؟
  • مسیریابی (Routing) و ناوبری (Navigation) را چطوری باید انجام داد؟
  • پایپ (Pipe) در انگولار چه مفهومی دارد؟
  • چطور انگولار را به سرور api متصل کنم؟
  • تزریق وابستگی در انگولار چیست و چه کاربردی دارد؟
  • چگونه از ماژول‌ها در انگولار استفاده کنم؟
  • چطور نرم افزار‌های حجیم انگولاری را بهینه کنم تا سرعت وب سایت افزایش پیدا کند؟
  • ساخت یک پروژه از ۰ تا ۱۰۰ وب سایت انگولاری
  • و ...

اما این تمام دوره نیست. در دوره آموزش انگولار 5 به زبان فارسی یک پروژه کاملا عملی را از ۰ تا ۱۰۰ برای شما پیاده سازی می‌کنیم تا تمام ابهامات ذهنی شما برطرف شود. و اگر شما در طی انجام پروژه به مشکلی بر خوردید می‌توانید تا ۶ ماه آینده به صورت رایگان از خدمات پشتیبانی ما بهره‌مند شده و از طریق تیکت پشتیبانی سوالات خود را مطرح کنید.

انگولار یکی از مدرن‌ترین فریم‌ورک‌های فرانتند (Frontend) بوده که هر برنامه‌نویس سمت کاربر باید یکی از این فریم‌ورک‌ها را به صورت حرفه‌ای یاد بگیرد. این فریم ورک قابلیت تولید وب اپلیکیشن‌های بسیار قدرتمند و پیچیده را فراهم می‌کند تا تجربه‌ی کاربری (User Experiences) را افزایش داده و تعامل کاربر با وب سایت طراحی شده را بسیار لذت بخش کند. تمام اصولی که باید درباره این فریم‌ورک بدانید درون این دوره گنجانده شده است. ما به شما راه ساخت سریع وب سایت‌های انگولاری را می‌آموزیم.

زبان اصلی مورد استفاده در این دوره زبان برنامه نویسی تایپ اسکریپت است. زبانی که توسط کمپانی گوگل و ماکروسافت به صورت مشترک ایجاد و پشتیبانی می‌شود. برای کسب اطلاعات بیشتر، دوره آموزشی رایگان زبان برنامه نویسی تایپ اسکریپت را از طریق این لینک دریافت کنید.

و اما سوال خیلی مهم!

چرا انگولار؟

اولین و اصلی‌ترین دلیل استفاده از انگولار پشتیبان قدرتمند آن یعنی کمپانی گوگل است. این دلیل به اندزه کافی باعث شده تا هر روز هزاران سایت طراحی سمت کاربر (Frontend) خود را به سمتی ببرند که بتوانند از انگولار به عنوان یک فریم ورک سمت کاربر استفاده کنند. اما همه‌ی دلیل ما این نیست. انگولار 5 از نظر امنیتی بسیار قدرتمند عمل کرده و اکثر کدها را در حالت کامپرس شده در اختیار می‌گذارد. قابلیت تنظیم پروژه را به گونه‌ای اعمال کرده که شما می‌توانید در لحظه خروجی خود را مشاهده کنید و از طرفی چندین برنامه و پروژه انگولاری را با یک API به صورت مستقیم جلو ببرید. و با ساختار و کدهای بسیار تمیز شما را از سردگمی بین کدها و سینتکس‌ها نجات می‌دهد.

در حال حاضر انگولار 5 به عنوان آخرین نسخه این فریم‌ورک معرفی شده است. البته لازم به ذکر است افرادی که با انگولار ۲ یا ۴ کار می‌کنند با استفاده از این آموزش می‌توانند سطح معلومات خود را بسیار حرفه‌ای تر کنند. زیرا تفاوت‌های بین ورژن ۲، ۴ و 5 بسیار جزئی بوده ولی کلیات مباحث همان است.

سرفصل‌های این دوره

مقدمه، نصب و راه اندازی اولیه

  • معرفی دوره و مدرس
  • انگولار چیست؟
  • تفاوت بین Angularjs و Angular 2 و Angular 4 و Angular 5
  • ساخت اولین پروژه
  • ویرایش اولین پروژه
  • برنامه‌ریزی دوره
  • معرفی ابزار قدرتمند Angular CLI
  • زبان تایپ اسکریپت (TypeScript) چیست؟
  • نصب و راه‌اندازی بوت استراپ روی انگولار

شرح مختصر مفاهیم بنیادی

  • معرفی ماژول‌ها (Modules)
  • توضیح نحوه‌ی کارکرد نرم‌افزارهای انگولاری
  • معرفی کامپوننت‌ها و ساخت یک کامپوننت جدید
  • درک مفاهیم ماژول‌ها و تعریف کامپوننت‌ها
  • تعریف کردن کامپوننت‌های دلخواه با استفاده از CLI
  • کار با قالب‌های HTML در کامپوننت‌ها
  • کار با استایل‌ها در کامپوننت‌ها
  • درک عمیق درباره سلکتورهای (معرف‌های) کامپوننت‌ها
  • معرفی ارتباط داده‌ای یا Databinding
  • معرفی روش ارتباط داده‌ای String Interpolation
  • معرفی Property Binding
  • مقایسه String Interpolation و Property Binding
  • معرفی Event Binding
  • ارسال داده‌ها با استفاده از Event Binding
  • معرفی ارتباط داده‌ای دو طرفه (Two-Way Databinding)
  • ترکیب روش‌های ارتباط داده‌ای با فرم‌ها
  • معرفی دستورها (Directives)
  • معرفی و استفاده دستورهای ساختاری ngIf و ngIf Else
  • معرفی دستورهای صفتی ngStyle
  • افزودن کلاس‌های CSS پویا به تگ‌ها با دستور صفتی ngClass
  • آموزش نحوه‌ی استفاده از دستور ساختاری ngFor

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت اول)

  • معرفی پروژه
  • برنامه‌ریزی و طراحی پروژه
  • نصب نرم‌افزار انگولار و وابستگی‌ها
  • ایجاد کامپوننت‌های مورد نیاز
  • استفاده از کامپوننت‌ها
  • افزودن منوی اصلی فروشگاه
  • معرفی و ایجاد مدل‌ها
  • نمایش لیست محصولات
  • نمایش جزئیات محصول
  • نمایش لیست خرید
  • ویرایش لیست خرید

خطایابی

  • معرفی و آموزش خطایابی نرم‌افزارهای انگولاری
  • خطایابی نرم افزارهای انگولاری با استفاده از مرورگرها
  • معرفی، نصب و آموزش استفاده از ابزار Augury

سطح پیشرفته کامپوننت‌ها

  • معرفی ماژول‌ها
  • جداسازی نرم‌افزار به واحد‌های کوچک کامپوننت‌ها
  • معرفی عمیق Property Binding و Event Binding
  • تعریف یک Property Binding دلخواه و افزودن نام مستعار به آن
  • تعریف یک Event Binding دلخواه و معرفی EventEmiter
  • معرفی مفاهیم کپسوله‌سازی در انگولار 
  • استفاده از لوکال رفرنس‌ها (Local Reference) در قالب HTML
  • دسترسی به تگ‌های قالب HTML و DOM توسط ViewChild@
  • معرفی ng-content و نحوه‌ی استفاده به آن
  • یادگیری چرخه حیات انگولار یا Lifecycle
  • معرفی هوک‌های (Hooks) انگولار و نحوه‌ی تعامل آنها با قالب
  • دسترسی به ng-content با استفاده از ContentChild@

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت دوم)

  • معرفی کامپوننت‌ها و روش ارتباط داده‌ای در پروژه
  • افزودن منو با استفاده از Event Binding و دستور ngIf
  • ارسال داده‌های محصولات با استفاده از Property Binding
  • ارسال داده‌های ترکیبی با استفاده از ngModel
  • افزودن اطلاعات به لیست خرید توسط کاربر

سطح پیشرفته دستورها (Directives)

  • معرفی ماژول‌ها
  • معرفی دستورهای ساختاری ngFor و ngIf به صورت عمیق
  • معرفی دستورهای صفتی ngClass و ngStyle به صورت عمیق
  • ساخت دستورهای صفتی 
  • استفاده از HostListener برای گوش دادن به رویدادها
  • اتصال داده‌ها به دستورهای صفتی
  • پاسخ به سوال: در پشت صحنه دستورها چه اتفاقی می‌افتد؟
  • درک دستور ngSwitch

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت سوم)

  • افزودن دستورها به پروژه

معرفی سرویس‌ها و تزریق وابستگی

  • معرفی ماژول‌های مورد نیاز
  • چرا باید از سرویس‌ها استفاده کنیم؟
  • ساخت سرویس ورود کاربران
  • تزریق سرور ورود کاربران به کامپوننت
  • ساخت سرویس داده‌ها
  • درک مفهوم تزریق وابستگی
  • تزریق یک سرویس درون سرویس‌های دیگر
  • استفاده از یک سرویس برای چندین کامپوننت

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت چهارم)

  • معرفی سرویس‌ها
  • نصب سرویس‌ها
  • مدیریت سرویس‌های محصولات و کاربران
  • افزودن سرویس‌ها به پروژه جهت حذف و یا اضافه کردن سبد خرید

مسیردهی (Routing)

  • معرفی ماژول‌های موردنیاز
  • چرا باید از مسیردهی استفاده کنیم؟
  • راه‌اندازی مسیر‌های اولیه و بارگذاری مسیرها
  • اختصاص دادن لینک‌ها به مسیرها
  • درک مفهوم مسیرهای ناوبری
  • استایل دادن به مسیرهای فعال
  • ناوبری (Navigation) داینامیک و پویا بر اساس ID 
  • استفاده از مسیرهای نسبی (Relative Path) در برنامه‌نویسی ناوبری
  • ارسال پارامتر به مسیرها
  • بررسی پارامترها در مسیرها
  • ارسال پارامترهای کوئری و فرگمنت‌ها (#)
  • بازیابی و تحلیل پارامترهای کوئری و فرگمنت‌ها (#)
  • راه‌اندازی مسیرهای تودر تو
  • نحوه ریدایرکت کردن (Redirecting) و Wildcard در مسیرها
  • معرفی Guards یا محافظان مسیرها
  • حفاظت از برخی مسیرها با استفاده از canActivate
  • حفاظت از مسیرهای فرزند تو در تو با استفاده از canActiveChild
  • راه اندازی سرویس Auth برای احراز هویت
  • کنترل دسترسی به مسیر با استفاده از canDeactivate
  • ارسال داده‌های ثابت به مسیرها
  • درک استراتژی موقعیت و مکان مسیرها در انگولار

پروژه وب سایت فروشگاه اینترنتی (قسمت پنجم)

  • برنامه‌ریزی و طراحی مسیرها
  • نصب مسیرها
  • اضافه کردن ناوبری بین مسیرها
  • افزودن استایل به صفحات فعال
  • حل کردن مشکل بارگذاری مجدد صفحات
  • استفاده از مسیرهای فرزند
  • اضافه کردن مسیرهای تو در تو
  • تنظیم پارامترهای مسیرها
  • ارسال پارامترهای داینامیک به مسیرها
  • افزودن مسیرهای ویرایش محصول

مشاهده‌کننده و مشاهده‌گر (Observable و Observer)

  • معرفی ماژول‌ها
  • آنالیز و تحلیل مشاهده‌کننده‌های داخلی انگولار
  • ساخت اولین مشاهده‌کننده (Observable) در انگولار
  • ساخت و استفاده از Observableهای دلخواه از صفر تا صد
  • استفاده از دستور Subscribe و Unsubscribe
  • معرفی و استفاده از Subjectها برای ارسال داده
  • درک عملگرهای موجود در مشاهده کننده‌ها یا Observables

پروژه وب سایت فروشگاه اینترنتی (قسمت ششم)

  • بهبود عملکرد سرویس‌ها با استفاده از Observablesها و Subjectها

کار کردن با فرم‌ها در انگولار

  • معرفی ماژول فرم‌ها
  • مقایسه رویکرد Template-Driven یا TD و Reactive
  • تعریف یک مثال از فرم‌ها
  • ساخت یک فرم ثبت نام و کنترل آن با رویکرد TD
  • ثبت اطلاعات درون فرم با رویکرد TD
  • درک مفهوم موقعیت فرم‌ها با رویکرد TD
  • دسترسی به فرم‌ها با استفاده از ViewChild@ با رویکرد TD
  • افزودن اعتبارسنجی به ورودیهای فرم با رویکرد TD
  • نمایش خطاهای اعتبارسنجی با رویکرد TD
  • استفاده از ngModel‌در فرم‌ها و Two-way Databinding با رویکرد TD
  • گروه‌بندی فرم‌ها با رویکرد TD
  • کار کردن با دکمه‌های رادیویی با رویکرد TD
  • بروزرسانی اطلاعات یک فرم با رویکرد TD
  • استفاده از داده‌های فرم‌ها با رویکرد TD
  • بازنویسی کردن و پاک کردن اطلاعات موجود در فرم‌ها با رویکرد TD
  • معرفی رویکرد Reactive
  • نصب رویکرد Reactive
  • ساخت یک فرم با رویکرد Reactive
  • تنظیم قالب HTML و فرم با استفاده از رویکرد Reactive
  • افزودن اعتبارسنجی با رویکرد Reactive
  • دستیابی به کنترل‌ها با رویکرد Reactive
  • گروه‌بندی فرم‌ها با رویکرد Reactive
  • آرایه‌های فرم‌ها یا FormArray در رویکرد Reactive
  • ساخت اعتبارسنجی‌های دلخواه با رویکرد Reactive
  • نمایش خطاهای فرم‌ها با رویکرد Reactive
  • ساخت اعتبارسنجی‌های غیرهمزمان (Async) با رویکرد Reactive
  • بروزرسانی اطلاعات فرم‌ها با رویکرد Reactive

پروژه وب سایت فروشگاه اینترنتی (قسمت هفتم)

  • افزودن فرم‌ها به محصولات با رویکرد TD
  • افزودن اعتبارسنجی‌ها به فرم‌ها
  • بارگذاری اطلاعات لیست خرید درون فرم
  • ویرایش فرم محصولات
  • بازنویسی فرم‌ها
  • اجازه دادن به کاربر جهت حذف اطلاعات درون فرم‌ها
  • کار کردن با رویکرد Reactive در بخشی از پروژه
  • اعتبارسنجی ورودی‌های کاربران
  • ثبت اطلاعات

معرفی Pipeها

  • معرفی و مقدمه‌ای بر Pipeها در انگولار
  • استفاده از Pipeها
  • پارامترگذاری کردن Pipeها
  • ساخت Pipe‌ دلخواه
  • ساخت یک فیلتر برای جستجو
  • درک Pipeهای غیرهمزمان یا async

درخواست‌های پروتکل HTTP و HttpClient

  • معرفی پروتکل Http و نحوه‌ی استفاده از آن در نرم‌افزارهای spa
  • ارسال درخواست‌ POST
  • افزودن هدر به درخواست‌ها
  • ارسال درخواست GET
  • ارسال درخواست PUT یا PATCH
  • انتقال پاسخ‌ها به ساده‌ترین شکل ممکن با استفاده از عملگرهای Observable‌ مثل ()map
  • استفاده از داده‌های بازگشتی
  • شفاف سازی خطاهای Http
  • استفاده از Pipe غیر همزمان (async) با متدهای Http

پروژه وب سایت فروشگاه اینترنتی (قسمت هشتم)

  • اتصال پروژه به یک پایگاه داده
  • دریافت اطلاعات از پایگاه داده
  • نمایش اطلاعات بر اساس متدهای Http

احراز هویت (Authentication) و محافظت از مسیرها

  • معرفی ماژول‌های احراز هویت
  • نحوه‌ی کارکرد احزار هویت در انگولار
  • ساخت صفحه عضویت کاربران و مسیردهی آن
  • استفاده از توکن
  • ارسال توکن جهت بررسی احزار هویت و اعلام وضعیت کاربر
  • افزدون دکمه خروج
  • محافظت از مسیرها و هدایت آنها به صفحات مشخص

بهینه‌سازی نرم‌افزار و ماژول‌ها

  • معرفی بهینه‌سازی
  • ایده‌ی موجود در ماژول‌ها
  • درک App Module
  • درک ویژگی‌های ماژول‌ها
  • ساخت ماژول‌های مشترک
  • ساخت ماژول Auth
  • درک مفهوم Lazy Loading در انگولار
  • افزودن ماژول‌های Lazy Loading به پروژه فروشگاه اینترنتی
  • آموزش نحوه کارکرد ماژول‌ها و تعامل آنها با سرویس‌ها
  • معرفی AoT‌ در انگولار و نحوه‌ی کار با آن

بارگذاری نرم افزار در اینترنت

  • معرفی ماژول‌های موردنیاز
  • ایجاد نسخه پروداکشن (محصول نهایی) جهت بارگذاری در اینترنت و هاست واقعی

انیمیشن در انگولار

  • معرفی انیمیشن‌ها در انگولار
  • نصب و راه‌اندازی اولین پروژه دارای انیمیشن
  • معرفی اینیمیشن‌های Triggers
  • تغییر موقعیت انیمیشن‌ها
  • استفاده از Transitionsها
  • استفاده از Transitionsها در سطح پیشرفته
  • استفاده از موقعیت viod
  • استفاده از Keyframeها برای انیمیشن‌سازی
  • گروه‌بندی Transitionsها
  • استفاده از کال بک‌ها (Callbacks) در انیمیشن‌ها

معرفی Unit Testing در انگولار

  • معرفی Unit Testing
  • چرا باید از Unit Testing استفاده کنیم؟
  • تحلیل و آزمایش نرم‌افزار تولید شده با اسفتاده از CLI
  • افزودن یک کامپوننت برای تست و آزمایش
  • تست کردن وابستگی‌ها مانند کامپوننت‌ها و سرویس‌ها
  • شبیه‌سازی کردن عملیات‌های غیرهمزمان (Async)
  • استفاده از دستور fakeAsunc و tick

آموزش سئو و انگولار یونیورسال (Angular Universal) در انگولار

  • معرفی سئو در انگولار
  • چرا باید فریم‌ورک‌های سمت فرانتند رو سئو کنیم؟
  • ایجاد main.server.ts
  • کار با tsconfig
  • کار کردن با SSR یا Server-Side-Rendering از طریق angular.cli.json
  • ساخت سرور با Nodejs
  • استفاده از Webpack برای بسته‌بندی داده‌ها

انگولار (که پر استفاده ترین نسخه های آن "انگولار 5" یا "انگولار 2" است) یک فریم ورک سمت کاربر (front-end) رایگان و متن باز می باشد که توسط تیم توسعه انگولار در شرکت گوگل به زبان تایپ اسکریپت برنامه نویسی شده است. در واقع فریم ورک انگولار یک بازنویسی کامل از فریم ورک انگولار جی اس می‌ باشد.

تفاوت بین انگولار و انگولار جی اس

انگولار یک بازنویسی کامل و از صفر فریم ورک انگولار جی اس می باشد:

  • فریم ورک انگولار واژه‌هایی مانند اسکوپ (scope) یا کنترلر (controller) ندارد. به جای این واژه‌ها، الگوهایی مانند کامپوننت‌ ها، مدل‌ ها و سرویس‌ ها را در اختیار می‌ گذارد.
  • انگولار نگارش (syntax) متفاوتی داشته و بیشتر روی علامت "{{ }}" متمرکز است. علامت "{{ }}" برای ارتباط داده‌ای ویژگی ها و علامت "( )" برای ارتباط داده‌ای رویدادها مورد استفاده قرار می‌گیرد.
  • ماژولار بودن - اکثر توابع در فریم ورک انگولار به صورت ماژول‌ها (modules) تعریف می‌شوند.
  • انگولار با استفاده از زبان برنامه نویسی تایپ اسکریپت ایجاد شده است که در ادامه برخی از ویژگی‌های این زبان را مطرح خواهیم کرد:
    • این زبان از قابلیت شیءگرایی پشتیبانی می‌کند
    • داده‌های آن بر اساس نوع تعیین می‌شوند
  • زبان برنامه نویسی تایپ اسکریپت از ساختار ES6 یا اکمااسکریپت ۶ پشتیبانی می‌کند و علاوه بر این با ساختار ES5 (جاوا اسکریپت) سازگار است. به عبارت دیگر از زبان برنامه نویسی جاوا اسکریپت نیز پشتیبانی می کند. از ویژگی‌های بارز زبان‌های ES6 می‌توان به موارد زیر اشاره کرد:
    • لامبدا
    • تکرارکننده ها
    • حلقه های for
    • ساختار نوشتاری مشابه زبان برنامه نویسی پایتون
  • بارگذاری خودکار
  • کلاس
  • قالب های غیر همزمان (Asynchronous template)
  • کنترلرها و $scope به ترتیب با کامپوننت‌ها (components) و دستورها (directives) جایگزین شده اند. در واقع یک کامپوننت به عنوان دستوری که دارای قالب html است شناخته می‌شود.
  • بهره‌مندی از کال بک های تولید شده توسط RxJs.

تاریخچه

نام گذاری

در ابتدا نام‌گذاری انگولار بر اساس فریم ورک قبلی یعنی انگولار جی اس صورت گرفت. اولین نام این فریم ورک تحت عنوان "انگولار ۲" معرفی شد. اما این نام گذاری باعث ایجاد سردرگمی در برنامه نویسان و توسعه دهندگان گردید. برای برطرف کردن این ابهام، تیم تصمیم گرفت که نام فریم ورک قبلی را انگولار جی اس و فریم ورک جدید را انگولار تعریف کند. یعنی از این به بعد انگولار ۲ و ۴ و 5 همگی زیرمجموعه‌ای از فریم ورک انگولار (بدون جی اس) هستند.

نسخه ۲.۰.۰

در نسخه ۲ انگولار تغییرهای بسیار زیادی بوجود آمد بگونه‌ای که دیگر مفاهیم فریم ورک قبلی هیچ معنایی پیدا نمی‌کردند. انگولار ۲ در کنفرانس ng-Europe در سپتامبر ۲۰۱۴ رونمایی شد. سپس نسخه بتای آن در دسامبر ۲۰۱۵ در اختیار برنامه نویسان قرار گرفت.[1] در نهایت در ۱۴ سپتامبر ۲۰۱۶ نسخه اصلی و نهایی انگولار ۲ رونمایی گردید.

نسخه ۴.۰.۰

در دسامبر سال ۲۰۱۶ انگولار ۴ شروع به کار کرد. برای بسیاری از برنامه‌نویسان سوال پیش آمد که چرا انگولار ۳ توزیع نشد. دلیل این امر عدم هماهنگی بخش مسیردهی (Router) در انگولار ۳ بود. در نهایت با تکمیل ورژن ۲، انگولار ۴ در تاریخ ۲۳ مارس ۲۰۱۷ به صورت رسمی در اختیار توسعه دهندگان قرار گرفت. همچنین یک نسخه تحت عنوان انگولار ۴.۳ نیز معرفی گردید که در آن تغییرهای جزئی صورت گرفته بود.

برخی از تغییرهای انگولار ۴.۳ عبارتند از:

  • معرفی یک ویژگی تحت عنوان HttpClient که درخواست‌های Http را به طرز شگفت انگیزی ساده‌سازی کرد.
  • چرخه کارکرد (Lifecycle) جدیدی در سیستم مسیردهی انگولار معرفی شد که رویدادهایی مانند: GuardsCheckStart، GuardsCheckEnd، ResolveStart و ResolveEnd را در اختیار برنامه‌نویسان قرار داد.
  • به طور موقت انیمیشن‌ها را غیر فعال کرد.

نسخه 5.0.0

تغییرهای نسبتا مناسبی در نسخه ۵.۰.۰ انگولار اعمال شد که باعث بهینه شدن کدها و ارتباط بهتر انگولار با متریال (Material) گردید. این نسخه در تاریخ ۱ نوامبر سال ۲۰۱۷ ارائه شد.

نسخه‌های آینده

با توجه به پیش‌بینی‌های شرکت گوگل نسخه ۶ انگولار در ماه مارس یا آپریل سال ۲۰۱۸ رونمایی میشود. همچنین در تاریخ سپتامبر یا اکتبر ۲۰۱۸ نسخه ۷ این فریم‌ورک قدرتمند چاوا اسکریپت در اختیار برنامه‌نویسان قرار می‌گیرد

یک بار خرید کن، یک عمر حرفه‌ای کدنویسی کن

دیگر دوره های این کاربر
نظرات (48)
نظر شما
بازیابی
سایر نظرات
محمد جعفری
2 روز پیش
0
1

سلام مهندس تبریک میگم بهتون بابت این دوره عالی 

مهندس راستش میخوام دوررو بخرم فقط سوالم اینجاست این دوره کامل کامل یاد میده انگولارو و چه پروژه هایی رو توش پیاده میکنین (دقیق بهم بگین) و اینکه آیا دوره تموم شده /؟ ممنون

    تیم مدیریت روکسو
    2 روز پیش
    0
    1

    سلام وقت شما بخیر

    این دوره به صورت کاملا تخصصی به آموزش انگولار از صفر تا صد می پردازه و با آمدن نسخه های جدید مثل انگولار 6 و انگولار 7 بروزرسانی خواهد شد. در واقع شما یکبار دوره را خریداری می کنید و به تمام بروزرسانی ها دسترسی خواهید داشت. پروژه های متعددی در طی روند آموزش هر فصل ارائه شده و یادگیری تمام فصل ها پروژه محور می باشد اما پروژه اصلی شامل یک فروشگاه اینترنتی مواد غذایی است که پیش نمایش آن در ویدیوی اول به صورت رایگان در دسترس است. تمام سرفصل ها که در توضیحات دوره درج شده است به شما عزیزان آموزش داده خواهد شد. 

    تنها چند فصل دیگر باقی مانده تا دوره تکمیل شود و در روز بروزرسانی ها انجام می شود.

      محمد جعفری
      2 روز پیش
      0
      0

      ممنون مهندس از پاسختون چند تا سوال دیگه هم دارم مهندس که شاید سوال خیلی از دانشجو های عزیز باشه : 

      1 - مهندس میشه هر وبسایتی رو SPA یا تک صحفه پیاده کرد ؟ یعنی وبسایتو ما نوشتیم و رانه میشه اونو تک صحفه کردش ؟ 

      2 - خود روکسو تک صحفس درسته ؟ 

      3 - کی چیزای جدیدی که در ورژن 6 انگولار به انگولار اضافه شدرو به دوره اضافه میکنین ؟ 

      4 - مهندس چندین فریم ورک الان میگن ما SPA میتونیم پیاده کنیم مثل react و vue بین تمام این فریم ورکا (که تعدادشون هم یکم بالاس) بهترین انتخاب چیه بنظرتون ؟ انگولار ؟ لطفا بگین . 

      5 - مهندس وقتی در بخش کامنت کامنتمو مینویسم و وقتی جواب سوال امنیتی رو نمینویسم و ثبت پاسخو میزنم سایت از نو لود نمیشه فقط یه آلرت بقل میاد این لود نشدنم توسط انگولاره ؟ اگه هست یاد میدین توی دوره ؟ 

      6 - و اخرین سوال مهندس اینکه میشه هر چیزی رو در یک وبسایت SPA پیاده کرد ؟ (منظورم از هر چیزی مثال کامنتی که زدم هستش و دقیقا اینکه هر چیزی )

      ممنون میشم پاسخ کامنتو سریعا بدین چون خیلی به دورتون علاقه مند شدم . ممنون 

        تیم مدیریت روکسو
        2 روز پیش
        0
        0

        سلام وقت بخیر

        ۱) تمام وب سایت هایی که در سطح اینترنت هستند را می شود با طراحی مجدد به صورت SPA دیزاین کرد. طراحی وب سایت های تک صفحه ای یک الگو است که با فریم ورک هایی مانند انگولار لذت بخش تر و ساده تر خواهد بود.

        ۲) بله وب سایت روکسو با اخرین ورژن انگولار پیاده سازی شده است.

        ۳) به محض پایدار شدن انگولار 6 و تمام پلاگین های آن، آموزش انگولار 6 و آپدیت های بخش ها به سرفصل ها اضافه خواهد شد.

        ۴) مقایسه بین فریم ورک های جاوا اسکریپت خیلی رایج نیست ولی انگولار از قابلیت MVC برخوردار می باشد و مدیریت پروژه های بزرگ توسط آن بسیار ساده تر است.

        ۵) بله کامنت های بخش مطالب در روکسو تک صفحه ای است. در کل در صورتیکه صفحه رفرش نشود و شما وارد بخش های جدید یک سایت شوید، آن وبسایت تک صفحه ای یا SPA است.

        ۶) بله

تینا
5 روز پیش
-1
2

من دانشجوی رشته ی نرم افزار دانشگاه تهران هستم و این دوره رو به پیشنهاد استاد بهرک خریداری کردم. واقعا هر آنچه درباره انگولار و فریم ورک های جاوا اسکریپت بود تا به اینجا یاد گرفتم. تنها راهی که میشه یک مهندس نرم افزار رو به بازار کار معرفی کرد با مطالعه این دوره های پروژه محور هست.

ممنونم از شما استاد گرانقدر

سیما
7 روز پیش
0
0

با سلام ، بنده میخواستم بدونم ویدیوهای مربوط به مباحث  Unit Testing و Webpack   بارگذاری شده؟ و این مباحث به چه شکلی بیان شدند؟

    تیم مدیریت روکسو
    6 روز پیش
    0
    0

    با سلام

    خیر هنوز مباحث آموزش unit test در انگولار و آموزش کار با وب پک برای سئو کردن انگولار اضافه نشده و جزو فصل های پایانی است.

سید محمد رضی سادات حسینی
7 روز پیش
0
0

سلام . من این دوره رو خریدم . این دوره چند قسمته ؟

    تیم مدیریت روکسو
    6 روز پیش
    0
    0

    سلام وقت بخیر

    این دوره حدود ۵۰ فصل خواهد بود و بسته به نیازمندی کاربران تعداد فصل ها ممکن است زیاد شود.

محمد حسین رسولیان
12 روز پیش
0
0

با سلام، اگه بخوایم فونت کل پروژه رو عوض کنیم باید چیکار کنیم ؟

    تیم مدیریت روکسو
    12 روز پیش
    0
    0

    سلام 

    باید در فولدر اصلی هم رده با فریم ورک بوت استرپ فونت ها را بارگذاری کرده و داخل فایل css فراخوانی کنید.

امیررضا جاویدان
13 روز پیش
0
0

وای مرررررسی استاد. من این دوره رو یک ماه پیش خریدم و الان تو شرکتی که کارآموز بودم استخدام شدم. وای ممنون برا هممممه چیز

جقدر خوبه تو تیکت ازتون سوال می پرسسم راهنمایی می کنید.

انگاری سر کلاس حضوری تونم

زهرا کریم خانی
14 روز پیش
0
1

عنوان رو خوب اومدی! مرجع تخصصی انگولار ایران! واقعا با خرید دوره فهمیدم میشه تو ایران هم افرادی رو پیدا کرد که به تعهد خودشون عمل میکنن و هر چی بلد هستن رو به دیگران یاد میدن. استاد از اینکه عضو سایت شما هستم خوشحالم و از اینکه صادقانه پشتیبانی محصول خودتون رو دارید ممنونم. مشاوره هایی که با شما تو تیکت داشتم باعث شد الان یه مسیر درست رو با این دوره برای پروژه شرکتمون تعیین کنم. کلی مرسی

omid
16 روز پیش
-1
0

سلام

میخواستم ببینم تو این آموزش داشبورد هم برای فروشگاه ساخته میشه که از چه طریقی مطالب ارسال بشه و مدیریت بشه؟

    تیم مدیریت روکسو
    16 روز پیش
    0
    1

    سلام دوست عزیز

    سوال شما اشتباه هست چون داشبورد و صفحه مدیریت متعلق به Backend هست و در این دوره شما در حال یادگیری Frontend هستید! اما شیوه کار با Api ها و Http Request ها در این دوره به صورت کامل آموزش داده میشود که شما بتوانید با استفاده از آن پاسخ های Backend وب سایت خودتان را در این Frontend دریافت کنید.

    و اما اگر منظور شما قالب داشبورد مدیریت است، این موضوع هم به زبان HTML و CSS مربوط می شود و نه انگولار.

    با این وجود صفحه ای برای مدیریت محصولات شامل ویرایش، حذف، اضافه کردن طراحی می کنیم که کاربری با مشخصات مدیریت بتواند عملیات CRUD در وب سایت انجام دهد

سمانه
18 روز پیش
-1
0

سلام

وقت بخیر

منظور از 15 هزار تومان هزینه کل دوره هست؟! یعنی تمام فیلم های آموزشی؟!

    تیم مدیریت روکسو
    17 روز پیش
    0
    0

    سلام

    هزینه دوره آموزش انگولار 5 از مقدماتی تا پیشرفته 155000 تومان است نه 15000 تومان. 

سید محمد رضی سادات حسینی
18 روز پیش
0
0

سلام . امکان خرید قسطی هم وجود داره ؟

    تیم مدیریت روکسو
    18 روز پیش
    0
    0

    سلام دوست عزیز

    خیر دوره آموزش فارسی انگولار به صورت نقدی در اختیار دوستان قرار می گیرد. در کل خرید قسطی در وب سایت وجود ندارد.

Atena
21 روز پیش
0
1

من این دوره رو خریداری کردم و تا فصل ۱۱ تک به تک مفاهیمی که گفتید رو خوندم و پروژه هارو مو به مو اجرا کردم. تا اینجا اینقدر اعتماد به نفس پیدا کردم که حد نداره. قبلا توی مقالات آموزشی انگولار 5 و 6 که رایگان در اختیار همه بود با مفاهیم انگولار آشنا شده بودم ولی با این ویدیو ها دانسته هام رو محکم کردم. شما اولین وب سایت ایرانی هستید که با صداقت تمام دارید یک زبان برنامه نویسی رو یاد میدید. اکثر سایت ها سودجو شدن. ممنون از شما و تیم برنامه نویسی تون. ای کاش یه دکمه ای بذارید برای رضایت از خرید تا اینطوری همه بدونن چقدر یک دوره ارزشمنده.

    تیم مدیریت روکسو
    21 روز پیش
    0
    0

    سلام

    ممنون از تمجید شما. برای ارزش گذاری دوره ها بخشی به نام امتیاز دوره در ستون سمت چپ قرار گرفته است که می توانید با فشردن ستاره ها امتیاز خود را ثبت کنید.

morteza
21 روز پیش
-1
0

سلام

کد بک اند پروژه این دوره با جی نوشته شده است؟

php? asp? ....

    تیم مدیریت روکسو
    21 روز پیش
    0
    1

    سلام

    در این پروژه بک اند به صورت یک سرویس API (که به راحتی قابل تبدیل به API در هر زبانی هست) ایجاد می گردد. این دوره یک دوره آموزشی برای انگولار 5 هست و نه دوره ای برای معرفی زبان PHP یا Asp.net.

    دوره ۰ تا ۱۰۰ آموزش زبان برنامه نویسی PHP به همراه ساخت سی ام اس اختصاصی در این لینک موجود است.

بهنام حاجی
23 روز پیش
0
0

سلام لطفا روند رو سریعتر کنید 
ممنون که بخش ها رو کامل توضیح میدید و از سر و ته کار نمیزنید

    تیم مدیریت روکسو
    23 روز پیش
    0
    1

    با سلام

    به دوره آموزشی انگولار 5 روزانه یک فصل اضافه می شود تا تمام دانشجویان همراه با مدرس به سمت جلو حرکت کنند. در صورت امکان تعداد فصل ها رو بیشتر می کنیم.

Mahdi Fazeli
23 روز پیش
0
1

با سلام وخسته نباشید

فایل bootstrap فارسی رو از کجا دانلود کنیم؟

    تیم مدیریت روکسو
    23 روز پیش
    0
    1

    جهت دانلود فایل بوت استراپ فارسی پروژه فروشگاه اینترنتی با انگولار (قسمت اول) رو دانلود کنید و به فولدر assets مراجعه نمایید.

مهدیه رفیعی
23 روز پیش
0
0

 سلام

ببخشید کنار پوشه ی node_modul من در visual studio یه علامتی شبیه علامت ورود ممنوع قرار داده. اون علامت از چیه ؟

    تیم مدیریت روکسو
    23 روز پیش
    0
    0

    علامت ورود ممنوع در ویرایشگر Vusial Studio به معنای خارجی بودن (External) منابع موجود در این پوشه است و در روند کار شما مشکلی ایجاد نمی کند. برای اینکه node_module را به درستی در انگولار نصب کنید حتما از دستور npm install استفاده نمایید. این دستور را پس از ورود به پوشه پروژه خودتان و درون CMD یا Command Line وارد کنید.

مهدی
1 ماه پیش
-1
2

سلام، سایت لاگین نمیکنه لطفا بررسی کنید میخواستم این دوره رو بخرم!

    تیم مدیریت روکسو
    1 ماه پیش
    0
    0

    سلام از سمت سایت مشکلی وجود نداره لطفا مرورگر کروم خودتون رو به آخرین نسخه بروزرسانی کنید.

leila najafvand
1 ماه پیش
0
0

من اگر در پروژه خود (پروژه ای که خودم خارج از این بخش انجام می دم)دچار مشکل شدم می تونم سوالی بپرسم؟

    تیم مدیریت روکسو
    1 ماه پیش
    0
    0

    سلام 

    از طریق بخش پیشخوان -> 《تیکت پشتیبانی》 با مدرس در ارتباط باشید. در صورت امکان راهنمایی تون می کنن.

علی آریا
1 ماه پیش
0
1

سلام

خواهش می کنم دوره های دیگه ای هم تولید کنید. من دوره پی اچ پی و انگولار ۵ رو دارم با هم میگذرونم، حالم خوبه چون هیچ اشکالی دیگه ندارم

ممنونم

سمیرا محمدی
1 ماه پیش
0
2

سلام وقت تون بخیر

من از خریدارای این دوره هستم. قبل از اینکه با دوره شما آشنا بشم نزدیک به ۲ سال با انگولار کار کرده بودم ولی همیشه یه چیزهایی برام ابهام بود. ویدیوهای خارجی و ایرانی زیادی دیدم. توی یوتیوب یه ویدیو ایرانی بود که قسمت های زیادی از اون رو دیدم ولی فقط و فقط منو از مسیر بیرون پرت کرد و خیلی متاسفم برای ایرانی ها که در انتقال مفاهیم خسیس هستن. مهندس صالحی شما با این دوره ثابت کردید که میشه یه ایرانی تفکر خارجی داشته باشه و تموم اطلاعات خودش رو با دیگران به اشتراک بگذاره. من شک ندارم بعد از این دوره هر جایی دوست داشته باشم میتونم تو زمینه فرانتند کاری هر جایی استخدام بشم

از شما با تموم وجودم ممنون. هزینه ای که دریافت می کنید حلال حلاله و نوش جونتون

حیدری
1 ماه پیش
-1
0

با سلام

این دوره کامل ارسال میشه بعد از خرید یا اینکه بصورت پارتی ارسال میشه؟

    تیم مدیریت روکسو
    1 ماه پیش
    0
    0

    سلام

    در حال حاضر برنامه ای برای فروش فیزیکی بر روی هارد دیسک ها نداریم. دوره رو میتونید به صورت آنلاین خریداری و دانلود کنید.

این دوره در حال برگزاری است...
۱۵۵۰۰۰ تومان
شش ماه پشتیبانی بیشتر (95000 تومان)
توضیحات پشتیبانی
گزارش تخلفات
با دریافت این دوره از مزایای زیر بهره مند می شوید:
  • ارتباط مستقیم با مدرس
  • ۶ ماه پشتیبانی رایگان
  • ۷ روز ضمانت بازگشت وجه
  • دسترسی دائمی به فایل ویدیو دوره
تیم مدیریت روکسو
40 نفر این محصول را خریده اند
48 نفر به این دوره نظر داده اند
این دوره در روکسو یک دوره ویژه است
امتیاز این دوره
4.7 از 34 رأی (*) (*) (*) (*) (*)
تاریخ انتشار: 1397/1/28
تاریخ بروزرسانی: 1397/3/7
اصالت و صحت اطلاعات این دوره مورد تایید روکسو است.
سازگاری با فریم ورک Javascript
برچسب ها