آموزش سیگنال های زاویه ای در عمق (Angular 18)

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

مقدمه ای بر سیگنال های زاویه ای Introduction To Angular Signals

• زاویه ای مدرن با سیگنال ها - مقدمه Modern Angular With Signals - Introduction

• مهم - نسخه های نرم افزاری توصیه شده IMPORTANT - Recommended Software Versions

• تنظیم محیط توسعه شما Setting Up Your Development Environment

• نوشتن اولین سیگنال زاویه ای شما Writing Your First Angular Signal

• چرا سیگنال های زاویه ای؟ مزایای اصلی Why Angular Signals? Main Benefits

• وضعیت فعلی تشخیص تغییر مبتنی بر سیگنال The Current State of Signal-Based Change Detection

• سیگنال های Angular API و سیگنال های فقط خواندنی را به روز می کنند The Angular signals update API and Read-Only Signals

• سیگنال های زاویه ای و تغییرناپذیری - اشیاء Angular Signals and Immutability - Objects

• سیگنال های زاویه ای و تغییرناپذیری - آرایه ها Angular Signals and Immutability - Arrays

• سیگنال های محاسبه شده زاویه ای - هر آنچه که باید بدانید Angular Computed Signals - Everything You Need To Know

• جلوه های سیگنال زاویه ای - هر آنچه که باید بدانید Angular Signal Effects - Everything You Need To Know

• جلوه های سیگنال زاویه ای - تنظیم زمینه تزریق Angular Signal Effects - Setting The Injection Context

• جلوه های سیگنال زاویه ای - زمان استفاده از allowSignalWrites Angular Signal Effects - When To Use allowSignalWrites

• جلوه های سیگنال زاویه ای - نحوه انجام پاکسازی اثر دستی Angular Signal Effects - How To Do Manual Effect Cleanup

نمونه کامل CRUD با سیگنال های زاویه ای Complete CRUD Example With Angular Signals

• مقدمه ای بر بخش CRUD کامل با سیگنال ها Introduction To The Complete CRUD With Signals Section

• چرا RxJ را در Angular اختیاری کنیم؟ Why Making RxJs Optional In Angular?

• عملیات خواندن CRUD - تعریف API لایه سرویس ما CRUD Read Operation - Defining The API of our Service Layer

• لایه های سرویس HTTP زاویه ای - دو گزینه متفاوت Angular HTTP Service Layers - Two Different Options

• واکشی داده ها از لایه سرویس با مدیریت خطا Fetching Data From the Service Layer With Error Handling

• بارگیری داده ها با OnInit یا AfterNextRender Loading Data With OnInit or afterNextRender

• لایه‌های سرویس زاویه‌ای با سرویس گیرنده HTTP و غیر همگام‌سازی/منتظر هستند Angular Service Layers With The HTTP Client and async / await

• تعریف داده های مشتق شده به صورت اعلامی با استفاده از computed() Defining Derived Data Declaratively Using computed()

• ورودی های سیگنال زاویه ای - ورودی های اختیاری و مورد نیاز Angular Signal Inputs - Optional and Required Inputs

• CRUD - نمایش لیست دوره ها CRUD - Display a List of Courses

• لایه سرویس CRUD - پیاده سازی واکشی CRUD Service Layer - Fetch Implementation

• لایه سرویس CRUD با async/await و Angular HTTP Client CRUD Service Layer with async / await and the Angular HTTP Client

• به روز رسانی CRUD - باز کردن گفتگوی ویرایش دوره CRUD Update - Opening the Edit Course Dialog

• به روز رسانی CRUD ویرایش فرم دوره CRUD Update Edit Course Form

• به روز رسانی CRUD - راه اندازی تماس HTTP PUT CRUD Update - Triggering the HTTP PUT Call

• CRUD Update - به روز رسانی UI CRUD Update - Updating the UI

• CRUD Delete - پیاده سازی کامل CRUD Delete - Full Implementation

• CRUD ایجاد دوره پیاده سازی CRUD Create Course Implementation

نشانگر بارگذاری مبتنی بر سیگنال زاویه ای Angular Signal-Based Loading Indicator

• بخش جدید - نشانگر بارگذاری زاویه ای مبتنی بر سیگنال New Section - Signal-Based Angular Loading Indicator

• نشانگر بارگیری مبتنی بر سیگنال - سرویس سیگنال مشترک Signal-Based Loading Indicator - Shared Signal Service

• در حال بارگذاری نشانگر رهگیر HTTP Loading Indicator HTTP Interceptor

• رد شدن از نشانگر بارگیری با استفاده از زمینه HTTP Skipping The Loading Indicator Using an HTTP Context

پیام های کاربر مبتنی بر سیگنال زاویه ای و مدیریت خطا Angular Signal-Based User Messages and Error Handling

• پیام های کاربر مبتنی بر سیگنال - سرویس مشترک Signal-Based User Messages - Shared Service

• جزء پیام ها - پیاده سازی گام به گام Messages Component - Step-by-Step Implementation

• نسخه نمایشی سرویس مبتنی بر سیگنال پیام ها Messages Signal-Based Service Demo

احراز هویت مبتنی بر سیگنال زاویه ای Angular Signal-Based Authentication

• احراز هویت مبتنی بر سیگنال زاویه ای Angular Signal-Based Authentication

• پیاده سازی فرم ورود Implementing The Login Form

• سرویس مبتنی بر سیگنال احراز هویت Authentication Signal-Based Service

• تطبیق رابط کاربری با وضعیت احراز هویت کاربر Adapting the UI To The User Authentication Status

• پیاده سازی خروج Implementing Logout

• ذخیره نمایه کاربر در فضای ذخیره سازی محلی - Survive Refreshes Save User Profile In Local Storage - Survive Refreshes

• پیاده سازی گارد احراز هویت با سیگنال ها Implementing an Authentication Guard With Signals

ورودی های مدل Model Inputs

• ورودی های مدل Model Inputs

• ورودی های مدل و اتصال داده های دو طرفه Model Inputs and Two-Way Data Binding

• قبل از ادامه - خبر دادن به چند موضوع Before Continuing- Tiding Up a Couple of Issues

ساخت صفحه نمایش دوره Building the View Course Page

• ساخت صفحه نمایش دوره Building the View Course Page

• پیاده سازی الگوی جزء دوره Implementing the Template of The Course Component

• پیاده سازی حل کننده دوره Implementing The Course Resolver

• اجرای سرویس درس Implementing the Lessons Service

• پیاده سازی Resolver درس ها Implementing the Lessons Resolver

الگوی UI جزئیات اصلی Master Detail UI Pattern

• الگوی UI جزئیات اصلی Master Detail UI Pattern

• جزئیات اصلی - فرم درس های جستجو را پیاده سازی کنید Master Detail - Implement The Search Lessons Form

• پرس و جوهای سیگنال زاویه ای - viewChild Angular Signal Queries - viewChild

• پرس و جو سیگنال ViewChildren The ViewChildren Signal Query

• نتیجه گیری از اجرای سناریوی اصلی جزئیات Conclusion of the Implementation of the Master Detail Scenario

• آغاز پیاده سازی جزییات قسمت Master Detail Beginning of the Implementation of the Detail Part of Master Detail

• نتیجه گیری از اجرای سناریوی اصلی جزئیات Conclusion of the Implementation of the Master Detail Scenario

قابلیت همکاری RxJs RxJs Interoperability

• قابلیت همکاری RxJs RxJs Interoperability

• toObservable() را با جزئیات درک کنید Understand toObservable() In Detail

• ابزار قابلیت همکاری toSignal(). The toSignal() Interoperability Utility

• گزینه های پیکربندی toSignal() - requireSync و initialValue toSignal() Configuration Options - requireSync and initialValue

• درک مدیریت خطای toSignal() 2 Understanding toSignal() Error Handling 2

نتیجه Conclusion

• سخنرانی جایزه ژوئن 2024: این کوپن ها اخیراً به روز شده اند Bonus Lecture June 2024 : These coupons have been recently updated

• زاویه ای مدرن با سیگنال ها - نتیجه گیری و نکات کلیدی Modern Angular With Signals - Conclusion and Key Takeways