آموزش Angular Advanced MasterClass و کتاب الکترونیکی رایگان

سرفصل ها و درس ها

بررسی اجمالی دوره و راه اندازی محیط توسعه Course Overview and Development Environment Setup

• دوره پیشرفته زاویه ای - نمای هلیکوپتر Angular Advanced Course - Helicopter View

• دوره پیشرفته زاویه ای - نمای هلیکوپتر Angular Advanced Course - Helicopter View

• نسخه های نرم افزاری پیشنهادی Recommended Software Versions

• تایپ اسکریپت Jumpstart کتاب الکترونیکی The Typescript Jumpstart Ebook

• تایپ اسکریپت Jumpstart کتاب الکترونیکی The Typescript Jumpstart Ebook

• نصب Node، NPM، Git، IDE - یک نسخه Webstorm جایگزین Installing Node, NPM, Git, IDE - An Alternative Webstorm Version

• نصب Node، NPM، Git، IDE - یک نسخه Webstorm جایگزین Installing Node, NPM, Git, IDE - An Alternative Webstorm Version

• نصب کد درس - درباره Git Remote در مقابل شعبه های محلی بیاموزید Installing The Lessons Code - Learn About Git Remote vs Local Branches

• نصب Yarn و CLI، راه اندازی سرور توسعه Installing Yarn and CLI, Setting Up a Development Server

بررسی اجمالی دوره و راه اندازی محیط توسعه Course Overview and Development Environment Setup

• نسخه های نرم افزاری پیشنهادی Recommended Software Versions

• نصب کد درس - درباره Git Remote در مقابل شعبه های محلی بیاموزید Installing The Lessons Code - Learn About Git Remote vs Local Branches

• نصب Yarn و CLI، راه اندازی سرور توسعه Installing Yarn and CLI, Setting Up a Development Server

اولین کتابخانه زاویه‌ای ما - جعبه‌های ورودی فونت عالی و طراحی متریال Our First Angular Library - The Font Awesome And Material Design Input Boxes

• چگونه از بخش پرسش و پاسخ نهایت استفاده را ببریم How to Make The Most Of the Q&A Section

• چگونه از بخش پرسش و پاسخ نهایت استفاده را ببریم How to Make The Most Of the Q&A Section

• نسخه ی نمایشی اولین کتابخانه ما - فونت عالی و ورودی آیکون های مواد Google Demo of Our First Library - Font Awesome And Google Material Icons Input

• شروع پیاده سازی Font Awesome Input Box Beginning The Implementation Of The Font Awesome Input Box

• شروع پیاده سازی Font Awesome Input Box Beginning The Implementation Of The Font Awesome Input Box

• یک ظاهر طراحی کامپوننت زاویه‌ای - جداسازی سبک ساعت در عمل Angular Component Styling - Watch Style Isolation In Action

• یادگیری یک ویژگی برنامه افزودنی CSS زاویه ای - انتخابگر شبه میزبان Learn An Angular CSS Extension Feature - The Host Pseudo Selector

• بهترین روش‌های طراحی کامپوننت - اطمینان از استایل‌های جامد برای اندازه‌های مختلف ویجت Component Styling Best Practices - Ensure Solid Styles For Multiple Widget Sizes

• طراحی API کامپوننت - اجزای ساده تر و قابل استفاده مجددتر با محتوای ng Component API Design - Simpler and More Reusable Components With ng-content

• طراحی API کامپوننت - اجزای ساده تر و قابل استفاده مجددتر با محتوای ng Component API Design - Simpler and More Reusable Components With ng-content

• درک محتوای ng و جداسازی سبک - آموزش اصلاح کننده سبک عمیق Understanding ng-content and Style Isolation - Learn The Deep Style Modifier

• پیکربندی ViewChild/@ContentChild در Angular 8 ViewChild / @ContentChild Configuration in Angular 8

• ContentChild Decorator، چگونه کار می کند؟ بهترین روش های طراحی کامپوننت The ContentChild Decorator, How Does It Work ? Component Design Best Practices

• ContentChild Decorator، چگونه کار می کند؟ بهترین روش های طراحی کامپوننت The ContentChild Decorator, How Does It Work ? Component Design Best Practices

• ContentChild، Directives و HostListener - پیاده سازی ویژگی Input Focus ContentChild, Directives and HostListener - Implementing the Input Focus Feature

• پیاده سازی عملکرد فوکوس ورودی - The HostBinding Decorator Implementing The input Focus Functionality - The HostBinding Decorator

اولین کتابخانه زاویه‌ای ما - جعبه‌های ورودی فونت عالی و طراحی متریال Our First Angular Library - The Font Awesome And Material Design Input Boxes

• نسخه ی نمایشی اولین کتابخانه ما - فونت عالی و ورودی آیکون های مواد Google Demo of Our First Library - Font Awesome And Google Material Icons Input

• یک ظاهر طراحی کامپوننت زاویه‌ای - جداسازی سبک ساعت در عمل Angular Component Styling - Watch Style Isolation In Action

• یادگیری یک ویژگی برنامه افزودنی CSS زاویه ای - انتخابگر شبه میزبان Learn An Angular CSS Extension Feature - The Host Pseudo Selector

• بهترین روش‌های طراحی کامپوننت - اطمینان از استایل‌های جامد برای اندازه‌های مختلف ویجت Component Styling Best Practices - Ensure Solid Styles For Multiple Widget Sizes

• درک محتوای ng و جداسازی سبک - آموزش اصلاح کننده سبک عمیق Understanding ng-content and Style Isolation - Learn The Deep Style Modifier

• پیکربندی ViewChild/@ContentChild در Angular 8 ViewChild / @ContentChild Configuration in Angular 8

• ContentChild، Directives و HostListener - پیاده سازی ویژگی Input Focus ContentChild, Directives and HostListener - Implementing the Input Focus Feature

• پیاده سازی عملکرد فوکوس ورودی - The HostBinding Decorator Implementing The input Focus Functionality - The HostBinding Decorator

یک ظاهر طراحی شده اجزای زاویه ای - بهترین روش ها Styling Angular Components - Best Practices

• جداسازی سبک‌های ساختاری از سبک‌های تم - ساخت اجزای قالب‌بندی Separating Structural Styles From Theme Styles - Making Components Themeable

• جداسازی سبک‌های ساختاری از سبک‌های تم - ساخت اجزای قالب‌بندی Separating Structural Styles From Theme Styles - Making Components Themeable

• چگونه یک موضوع کامپوننت جایگزین ایجاد کنیم و آن را با کتابخانه ارسال کنیم How To Create An Alternative Component Theme And Ship It With The Library

• چگونه یک موضوع کامپوننت جایگزین ایجاد کنیم و آن را با کتابخانه ارسال کنیم How To Create An Alternative Component Theme And Ship It With The Library

• برای ایجاد یک موضوع کامپوننت جایگزین، به پشتیبانی در عمل CLI Sass مراجعه کنید Creating an Alternative Component Theme, See the CLI Sass Support In Action

• برای ایجاد یک موضوع کامپوننت جایگزین، به پشتیبانی در عمل CLI Sass مراجعه کنید Creating an Alternative Component Theme, See the CLI Sass Support In Action

• جداسازی سبک زاویه ای - کپسوله سازی نمای شبیه سازی شده - نحوه عملکرد آن را بیاموزید Angular Style Isolation - Emulated View Encapsulation - Learn How It Works

• 2 روش جایگزین بیشتر برای مدیریت CSS در برنامه های Angular بیاموزید Learn 2 More Alternative Ways of Handling CSS in Angular Applications

• 2 روش جایگزین بیشتر برای مدیریت CSS در برنامه های Angular بیاموزید Learn 2 More Alternative Ways of Handling CSS in Angular Applications

• راه اندازی یک ماژول کتابخانه، تأیید AOT پشتیبانی می شود Setting Up A Library Module, Confirming AOT is Supported

• راه اندازی یک ماژول کتابخانه، تأیید AOT پشتیبانی می شود Setting Up A Library Module, Confirming AOT is Supported

• بررسی اجمالی تست اجزای زاویه ای Angular Component Testing Overview

• زیرساخت تست Angular CLI - اجرای اولین آزمایش ما The Angular CLI Testing Infrastructure - Running Our First Test

• افزودن فونت ورودی عالی را آزمایش می کند - چگونه یک کامپوننت را آزمایش کنیم Adding Tests the Font Awesome Input - How to Test a Component

• تست کامپوننت زاویه ای - تولید یک گزارش تست قابل خواندن تر Angular Component Testing - Producing a More Readable Test Report

• تست کامپوننت زاویه ای - تولید یک گزارش تست قابل خواندن تر Angular Component Testing - Producing a More Readable Test Report

• نحوه اشکال زدایی تست های زاویه ای How To Debug Angular Tests

• نحوه اشکال زدایی تست های زاویه ای How To Debug Angular Tests

یک ظاهر طراحی شده اجزای زاویه ای - بهترین روش ها Styling Angular Components - Best Practices

• جداسازی سبک زاویه ای - کپسوله سازی نمای شبیه سازی شده - نحوه عملکرد آن را بیاموزید Angular Style Isolation - Emulated View Encapsulation - Learn How It Works

• بررسی اجمالی تست اجزای زاویه ای Angular Component Testing Overview

• زیرساخت تست Angular CLI - اجرای اولین آزمایش ما The Angular CLI Testing Infrastructure - Running Our First Test

• افزودن فونت ورودی عالی را آزمایش می کند - چگونه یک کامپوننت را آزمایش کنیم Adding Tests the Font Awesome Input - How to Test a Component

نحوه انتشار یک کتابخانه زاویه ای How to Publish An Angular Library

• نحوه انتشار یک کتابخانه در مخزن NPM یک شرکت خصوصی How To Publish A Library To a Private Enterprise NPM Repository

• نحوه انتشار یک کتابخانه در مخزن NPM یک شرکت خصوصی How To Publish A Library To a Private Enterprise NPM Repository

• جعبه ورودی طراحی مواد - تمرین تثبیت Material Design Input Box - Consolidation Exercise

• جعبه ورودی طراحی مواد - راه حل تمرین تحکیم Material Design Input Box - Consolidation Exercise Solution

• جعبه ورودی طراحی مواد - راه حل تمرین تحکیم Material Design Input Box - Consolidation Exercise Solution

• مقدمه ای بر مخزن دانه های شروع سریع کتابخانه انگولار Introduction To The Angular Library Quickstart Seed Repository

• با مزایای اصلی استفاده از قالب بسته زاویه ای آشنا شوید Learn The Main Benefits of Using The Angular Package Format

• بررسی و انتشار یک کتابخانه انگولار در قالب بسته زاویه ای Review And Publication Of An Angular Library In the Angular Package Format

• بررسی و انتشار یک کتابخانه انگولار در قالب بسته زاویه ای Review And Publication Of An Angular Library In the Angular Package Format

• مرحله نهایی انتشار کتابخانه - کتابخانه را با مصرف کنندگان مختلف آزمایش کنید Final Library Publication Step - Test The Library With Different Consumers

نحوه انتشار یک کتابخانه زاویه ای How to Publish An Angular Library

• جعبه ورودی طراحی مواد - تمرین تثبیت Material Design Input Box - Consolidation Exercise

• مقدمه ای بر مخزن دانه های شروع سریع کتابخانه انگولار Introduction To The Angular Library Quickstart Seed Repository

• با مزایای اصلی استفاده از قالب بسته زاویه ای آشنا شوید Learn The Main Benefits of Using The Angular Package Format

• مرحله نهایی انتشار کتابخانه - کتابخانه را با مصرف کنندگان مختلف آزمایش کنید Final Library Publication Step - Test The Library With Different Consumers

نوشتن جزء Tab Container Writing a Tab Container Component

• نسخه ی نمایشی کتابخانه زاویه ای - یک کانتینر تب با ظاهر و احساس قابل تنظیم Angular Library Demo - A Tab Container With Configurable Look And Feel

• جابجایی به یک شعبه جدید - بررسی نقطه شروع کانتینر Tab Switching To a New Branch - Reviewing the Tab Container Starting Point

• یک ظاهر طراحی کامپوننت زاویه‌ای - ویژگی‌های Sass که معمولاً مورد نیاز است Angular Component Styling - Commonly Needed Sass Features

• یک ظاهر طراحی کامپوننت زاویه‌ای - ویژگی‌های Sass که معمولاً مورد نیاز است Angular Component Styling - Commonly Needed Sass Features

• پیاده سازی کامپوننت Tab Panel - نسخه اولیه بالا و در حال اجرا Implementing The Tab Panel Component - Initial Version Up And Running

• استفاده از الگوی Angular و ویژگی‌های استایل برای ساده‌سازی HTML و CSS Using the Angular Template and Styling Features To Simplify Our HTML and CSS

• استفاده از الگوی Angular و ویژگی‌های استایل برای ساده‌سازی HTML و CSS Using the Angular Template and Styling Features To Simplify Our HTML and CSS

• پروجکشن محتوا با @ContentChildren و The AfterContentInit Lifecycle Hook Content Projection With @ContentChildren and The AfterContentInit Lifecycle Hook

• جزء Tab Container - اجرای اولیه و در حال اجرا را ببینید The Tab Container Component - See The Initial Implementation Up And Running

• ویژگی‌های پیشرفته Angular - ng-template، ng-container، ngTemplateOutlet Angular Advanced Features - ng-template , ng-container, ngTemplateOutlet

• ارجاعات الگوی زاویه ای و جزییات قالب ورودی را بیاموزید Learn Angular Template References And Input Template Partials

• ارجاعات الگوی زاویه ای و جزییات قالب ورودی را بیاموزید Learn Angular Template References And Input Template Partials

• تست مؤلفه Tab Container Testing The Tab Container Component

• تست کامپوننت زاویه ای - نحوه شبیه سازی تعامل کاربر Angular Component Testing - How To Simulate User interaction

نوشتن جزء Tab Container Writing a Tab Container Component

• نسخه ی نمایشی کتابخانه زاویه ای - یک کانتینر تب با ظاهر و احساس قابل تنظیم Angular Library Demo - A Tab Container With Configurable Look And Feel

• جابجایی به یک شعبه جدید - بررسی نقطه شروع کانتینر Tab Switching To a New Branch - Reviewing the Tab Container Starting Point

• پیاده سازی کامپوننت Tab Panel - نسخه اولیه بالا و در حال اجرا Implementing The Tab Panel Component - Initial Version Up And Running

• پروجکشن محتوا با @ContentChildren و The AfterContentInit Lifecycle Hook Content Projection With @ContentChildren and The AfterContentInit Lifecycle Hook

• جزء Tab Container - اجرای اولیه و در حال اجرا را ببینید The Tab Container Component - See The Initial Implementation Up And Running

• ویژگی‌های پیشرفته Angular - ng-template، ng-container، ngTemplateOutlet Angular Advanced Features - ng-template , ng-container, ngTemplateOutlet

• تست مؤلفه Tab Container Testing The Tab Container Component

• تست کامپوننت زاویه ای - نحوه شبیه سازی تعامل کاربر Angular Component Testing - How To Simulate User interaction

مولفه های مدال و دستورالعمل های ساختاری Modal Component and Structural Directives

• بخش مدال و دستورالعمل های ساختاری - مقدمه بخش Modal Component and Structural Directives - Section Introduction

• نحوه پیاده سازی یک مؤلفه مدال - بررسی HTML و CSS How To Implement a Modal Component - Reviewing The HTML and CSS

• نحوه پیاده سازی یک مؤلفه مدال - بررسی HTML و CSS How To Implement a Modal Component - Reviewing The HTML and CSS

• پیاده سازی یک مؤلفه مدال - اولین نسخه بالا و در حال اجرا Implementing a Modal Component - The First Version Up And Running

• پیاده سازی یک مؤلفه مدال - اولین نسخه بالا و در حال اجرا Implementing a Modal Component - The First Version Up And Running

• اجزای زاویه ای قابل تنظیم - قالب های طرح ریزی و ورودی محتوا Configurable Angular Components - Content Projection and Input Templates

• اجزای زاویه ای قابل تنظیم - قالب های طرح ریزی و ورودی محتوا Configurable Angular Components - Content Projection and Input Templates

• دستورالعمل های ساختاری - چگونه کار می کنند؟ درک نحو آنها Structural Directives - How Do They Work ? Understanding Their Syntax

• پیاده سازی گام به گام یک دستورالعمل ساختاری - ViewContainerRef را یاد بگیرید Step-By-Step Implementation of a Structural Directive - Learn ViewContainerRef

• مواجه شدن با یک مشکل طراحی در حین اجرای عملکرد بسته معین Running Into A Design Issue While Implementing The Modal Close Functionality

• اجرای یک مکانیسم ارتباطی عمومی برای تعامل دستورالعمل Implementing A General Communication Mechanism For Directive Interaction

• مدیریت صفحه کلید جهانی زاویه ای با EventManager Angular Global Keyboard Handling With EventManager

• مدیریت صفحه کلید جهانی زاویه ای با EventManager Angular Global Keyboard Handling With EventManager

• فرافکنی محتوای چند اسلات زاویه ای را بیاموزید Learn Angular Multi-Slot Content Projection

• فرافکنی محتوای چند اسلات زاویه ای را بیاموزید Learn Angular Multi-Slot Content Projection

• تکمیل گفتگوی احراز هویت - نحوه استفاده از ورودی های ng-template را بیاموزید Completing the Authentication Dialog - Learn How To Use ng-template Inputs

• جلوگیری از نشت حافظه Preventing Memory Leaks

• جلوگیری از نشت حافظه Preventing Memory Leaks

• پیاده سازی آزمون های مدال، بعد چه می شود؟ Implementing The Modal Tests, What's Next ?

• پیاده سازی آزمون های مدال، بعد چه می شود؟ Implementing The Modal Tests, What's Next ?

مولفه های مدال و دستورالعمل های ساختاری Modal Component and Structural Directives

• بخش مدال و دستورالعمل های ساختاری - مقدمه بخش Modal Component and Structural Directives - Section Introduction

• دستورالعمل های ساختاری - چگونه کار می کنند؟ درک نحو آنها Structural Directives - How Do They Work ? Understanding Their Syntax

• پیاده سازی گام به گام یک دستورالعمل ساختاری - ViewContainerRef را یاد بگیرید Step-By-Step Implementation of a Structural Directive - Learn ViewContainerRef

• مواجه شدن با یک مشکل طراحی در حین اجرای عملکرد بسته معین Running Into A Design Issue While Implementing The Modal Close Functionality

• اجرای یک مکانیسم ارتباطی عمومی برای تعامل دستورالعمل Implementing A General Communication Mechanism For Directive Interaction

• تکمیل گفتگوی احراز هویت - نحوه استفاده از ورودی های ng-template را بیاموزید Completing the Authentication Dialog - Learn How To Use ng-template Inputs

مدیریت پیشرفته صفحه کلید - دستورالعمل ماسک ورودی Advanced Keyboard Handling - The Input Mask Directive

• دستورالعمل ماسک ورودی - تعویض شاخه ها The Input Mask Directive - Switching Branches

• دستورالعمل ماسک ورودی که در حال ساخت آن هستیم The Input Mask Directive That We Are About To Build

• دستورالعمل ماسک ورودی که در حال ساخت آن هستیم The Input Mask Directive That We Are About To Build

• Input Mask Directive Skeleton - یادگیری ElementRef و Native Element Interaction Input Mask Directive Skeleton - Learn ElementRef and Native Element Interaction

• Input Mask Directive Skeleton - یادگیری ElementRef و Native Element Interaction Input Mask Directive Skeleton - Learn ElementRef and Native Element Interaction

• پیاده سازی Mask PlaceHolder با استفاده از عملگر عملکردی Reduce Implementing The Mask PlaceHolder Using The Reduce Functional Operator

• پیاده سازی Mask PlaceHolder با استفاده از عملگر عملکردی Reduce Implementing The Mask PlaceHolder Using The Reduce Functional Operator

• آرگومان های روش HostListener - مسدود کردن رفتار پیش فرض صفحه کلید HostListener Method Arguments - Blocking Default Keyboard Behavior

• بازنویسی موقعیت مکان نما فعلی Overwritting the Current Cursor Position

• اجرای عملکرد ناوبری مکان نما ماسک ورودی Implementing The Input Mask Cursor Navigation Functionality

• اعتبار سنجی رقمی - انواع تابع و برنامه ریزی چند شکلی بدون کلاس Digit Validation - Function Types and Polymorphic Programming Without Class

• اعتبار سنجی رقمی - اجتناب از نوشتن کد ویژه برای تهی و تعریف نشده Digit Validation - Avoiding Writing Special Code For Null And Undefined

• Input Mask - پیاده سازی Delete and Backspace Behavior Input Mask - Implementing The Delete and Backspace Behavior

• Input Mask - پیاده سازی Delete and Backspace Behavior Input Mask - Implementing The Delete and Backspace Behavior

• اتمام ماسک ورودی - انتخاب رویداد DOM و فعال کردن کپی متن Finishing The Input Mask - The Select DOM Event and Enabling Text Copy

مدیریت پیشرفته صفحه کلید - دستورالعمل ماسک ورودی Advanced Keyboard Handling - The Input Mask Directive

• دستورالعمل ماسک ورودی - تعویض شاخه ها The Input Mask Directive - Switching Branches

• آرگومان های روش HostListener - مسدود کردن رفتار پیش فرض صفحه کلید HostListener Method Arguments - Blocking Default Keyboard Behavior

• بازنویسی موقعیت مکان نما فعلی Overwritting the Current Cursor Position

• اجرای عملکرد ناوبری مکان نما ماسک ورودی Implementing The Input Mask Cursor Navigation Functionality

• اعتبار سنجی رقمی - انواع تابع و برنامه ریزی چند شکلی بدون کلاس Digit Validation - Function Types and Polymorphic Programming Without Class

• اعتبار سنجی رقمی - اجتناب از نوشتن کد ویژه برای تهی و تعریف نشده Digit Validation - Avoiding Writing Special Code For Null And Undefined

• اتمام ماسک ورودی - انتخاب رویداد DOM و فعال کردن کپی متن Finishing The Input Mask - The Select DOM Event and Enabling Text Copy

مثال نهایی - ابزارک پرداخت با انیمیشن Final Example - Payment Widget Modal With Animations

• همه با هم - نسخه ی نمایشی ابزارک های پرداخت All Together - Demo Of the Payment Widgets Modal

• همه با هم - نسخه ی نمایشی ابزارک های پرداخت All Together - Demo Of the Payment Widgets Modal

• انیمیشن های زاویه ای - انیمیشن های Fade In و Fade Out Angular Animations - Fade In and Fade Out Animations

• انیمیشن های زاویه ای - انیمیشن های Fade In و Fade Out Angular Animations - Fade In and Fade Out Animations

• انیمیشن های زاویه ای - چگونه یک انتقال و یک تحریک انیمیشن را تعریف کنیم Angular Animations - How To Define a Transition and an Animation Trigger

• انیمیشن های زاویه ای - چگونه یک انتقال و یک تحریک انیمیشن را تعریف کنیم Angular Animations - How To Define a Transition and an Animation Trigger

• پارامترهای انیمیشن زاویه ای و قلاب چرخه زندگی انیمیشن Angular Animation Parameters and Animation Lifecycle Hooks

مثال نهایی - ابزارک پرداخت با انیمیشن Final Example - Payment Widget Modal With Animations

• پارامترهای انیمیشن زاویه ای و قلاب چرخه زندگی انیمیشن Angular Animation Parameters and Animation Lifecycle Hooks

نتیجه گیری و درس پاداش Conclusions and Bonus Lesson

• سخنرانی پاداش Bonus Lecture

• سخنرانی پاداش Bonus Lecture

• نتیجه گیری و نکات کلیدی Conclusions and Key Points

• نتیجه گیری و نکات کلیدی Conclusions and Key Points

نتیجه گیری و درس پاداش Conclusions and Bonus Lesson