آموزش توسعه زاویه ای تمام پشته

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

مقدمه ای بر حالت جزء Introduction to Component State

• بررسی اجمالی Overview

• معرفی Introduction

• ایجاد پیام خوش آمد گویی Creating a Welcome Message

• نمایش و پنهان کردن عناصر با دستورالعمل ngIf Showing and Hiding Elements With The ngIf Directive

• روش های دیگر برای پنهان کردن عناصر Other Methods for Hiding Elements

• استفاده از حالت برای پیگیری موارد دلخواه Using State to Keep Track of Favorites

• نتیجه Conclusion

ملزومات پشته MEAN Essentials of the MEAN Stack

• بررسی اجمالی Overview

• معرفی Introduction

• ساختار پشته MEAN پایه Basic MEAN Stack Structure

• تنظیم جلویی Front-end Setup

• راه اندازی Back-end Back-end Setup

• نتیجه Conclusion

مبانی درخواست شبکه زاویه ای Angular Network Request Basics

• بررسی اجمالی Overview

• معرفی Introduction

• نقاط پایانی "خواندن" و "ایجاد" ایجاد کنید Create "Read" and "Create" Endpoints

• نقطه پایانی "به روز رسانی" و "حذف" ایجاد کنید Create "Update" and "Delete" Endpoints

• بارگذاری داده ها با HttpClient و RxJS Load Data with HttpClient and RxJS

• درخواست های "به روز رسانی" و "حذف" را ارسال کنید Make "Update" and "Delete" Requests

• نتیجه Conclusion

مبانی پایگاه داده MEAN Stack MEAN Stack Database Basics

• بررسی اجمالی Overview

• معرفی Introduction

• درخواست های شبکه از سرویس ها ایجاد کنید Make Network Requests from Services

• پرس و جوهای اساسی MongoDB Basic MongoDB Queries

• نقاط پایانی سرور را برای استفاده از MongoDB تبدیل کنید Convert Server Endpoints to use MongoDB

• نتیجه Conclusion

تبدیل تمام پشته زاویه ای: بارگیری داده ها Angular Full-Stack Conversion: Loading Data

• بررسی اجمالی Overview

• معرفی Introduction

• استراتژی اصلی تبدیل تمام پشته Basic Full-stack Conversion Strategy

• راه اندازی کامل و ساختار فایل Full-stack Setup and File Structure

• نکات پایانی اصلی "خواندن". Basic "Read" Endpoints

• بارگیری داده ها از سرور Loading Data from the Server

• نتیجه Conclusion

تبدیل کامل پشته زاویه ای: ایجاد، اصلاح و حذف داده ها Angular Full-Stack Conversion: Creating, Modifying, and Deleting Data

• بررسی اجمالی Overview

• معرفی Introduction

• درخواست های "ایجاد" را ارسال کنید Make "Create" Requests

• درخواست های "حذف" را ارسال کنید Make "Delete" Requests

• درخواست های "به روز رسانی" را ارسال کنید Make "Update" Requests

• نتیجه Conclusion

تبدیل تمام پشته زاویه ای: تبدیل یک سرور به MongoDB Angular Full-stack Conversion: Convert a Server to MongoDB

• بررسی اجمالی Overview

• معرفی Introduction

• یک پایگاه داده Mongo را راه اندازی کنید Set Up A Mongo Database

• نقاط پایانی "خواندن" را به MongoDB تبدیل کنید Convert "Read" Endpoints to MongoDB

• "ایجاد" نقطه پایانی را به MongoDB تبدیل کنید Convert "Create" Endpoints to MongoDB

• نقاط پایانی "حذف" را به MongoDB تبدیل کنید Convert "Delete" Endpoints to MongoDB

• نقاط پایانی "به روز رسانی" را به MongoDB تبدیل کنید Convert "Update" Endpoints to MongoDB

• نتیجه Conclusion

Firebase Auth Basics با Angular Firebase Auth Basics with Angular

• بررسی اجمالی Overview

• معرفی Introduction

• Firebase Auth را به Angular اضافه کنید Add Firebase Auth to Angular

• ورود و صفحه اصلی ایجاد کنید Create Login and Home Pages

• ورود و خروج Log In and Log Out

• نتیجه Conclusion

ایجاد حساب و مدیریت خطا در Firebase Account Creation and Error Handling in Firebase

• بررسی اجمالی Overview

• معرفی Introduction

• محافظت از صفحات در برابر کاربران تایید نشده Protect Pages from Unauthed Users

• مدیریت خطای احراز هویت Auth Error Handling

• ایجاد حساب های جدید Create New Accounts

• نتیجه Conclusion

Firebase Auth در برنامه های زاویه ای تمام پشته Firebase Auth In Full-Stack Angular Apps

• بررسی اجمالی Overview

• معرفی Introduction

• راه اندازی Firebase Back-end Back-end Firebase Setup

• نمایش داده های کاربر Firebase Auth Display Firebase Auth User Data

• ذخیره اطلاعات اضافی کاربر Store Extra User Data

• نتیجه Conclusion

MEAN Stack Endpoint Security با Firebase Auth MEAN Stack Endpoint Security with Firebase Auth

• بررسی اجمالی Overview

• معرفی Introduction

• توکن های Firebase Auth را ارسال و تأیید کنید Send and Verify Firebase Auth Tokens

• یک صفحه ویرایش اطلاعات ایجاد کنید Create an Edit Info Page

• ایجاد سرویس‌هایی برای Auth Logic Create Services for Auth Logic

• نتیجه Conclusion

Firebase Auth را به برنامه های Angular موجود اضافه کنید Add Firebase Auth to Existing Angular Apps

• بررسی اجمالی Overview

• معرفی Introduction

• راه اندازی اولیه Front-end Basic Front-end Setup

• یک صفحه ورود اضافه کنید Add a Login Page

• یک صفحه ایجاد حساب اضافه کنید Add a Create Account Page

• Firebase Auth را در یک سرویس کپسوله کنید Encapsulate Firebase Auth in a Service

• نتیجه Conclusion

از Firebase Auth برای پشتیبانی از چندین کاربر استفاده کنید Use Firebase Auth to Support Multiple Users

• بررسی اجمالی Overview

• معرفی Introduction

• محافظت از صفحات برنامه Protect Application Pages

• ساختار داده را برای پشتیبانی از چندین کاربر بازنگری کنید Rethink Data Structure to Support Multiple Users

• داده های کاربر را بارگیری کنید و اجازه خروج از سیستم را بدهید Load User Data and Allow Logging Out

• از شناسه کاربر در درخواست های سرور استفاده کنید Use the User's ID in Server Requests

• نتیجه Conclusion

ایجاد و حذف کاربران در برنامه های MEAN Stack موجود Create and Delete Users In Existing MEAN Stack Apps

• بررسی اجمالی Overview

• معرفی Introduction

• کاربران جدید را از Front-end ایجاد کنید Create New Users from the Front-end

• بازنگری در استراتژی ایجاد حساب ما Rethinking Our Create-Account Strategy

• کاربران جدید از Back-end ایجاد کنید Create New Users from the Back-end

• حذف حساب های کاربری Delete User Accounts

• نتیجه Conclusion

امنیت نقطه پایانی را به برنامه‌های موجود MEAN Stack اضافه کنید Add Endpoint Security to Existing MEAN Stack Apps

• بررسی اجمالی Overview

• معرفی Introduction

• مبانی امنیت Endpoint Endpoint Security Basics

• از GET Endpoints محافظت کنید Protect GET Endpoints

• از نقاط پایانی با Express Middleware محافظت کنید Protect Endpoints with Express Middleware

• نتیجه Conclusion

MEAN Stack Firebase Auth Best-Practics MEAN Stack Firebase Auth Best-Practices

• بررسی اجمالی Overview

• معرفی Introduction

• Refactor Front-End Auth-Token Logic Refactor Front-End Auth-Token Logic

• درخواست های تایید شده را به صورت خودکار انجام دهید Make Authed Requests Automatically

• تأیید خودکار با درخواست‌های POST، PUT و DELETE Automatic Auth with POST, PUT, and DELETE Requests

• نتیجه Conclusion

مفاهیم پایه زاویه ای و نحو Basic Angular Concepts and Syntax

• بررسی اجمالی Overview

• معرفی Introduction

• مزایای اصلی Angular Main Benefits of Angular

• یک برنامه Angular ایجاد و اجرا کنید Create and Run an Angular App

• ساختار پروژه زاویه ای Angular Project Structure

• نتیجه Conclusion

اجزای زاویه ای Angular Components

• بررسی اجمالی Overview

• معرفی Introduction

• ایجاد و نمایش کامپوننت های زاویه ای Create and Display Angular Components

• درج متغیرها در HTML کامپوننت Insert Variables Into Component HTML

• مقدمه ای بر ورودی های کامپوننت Introduction to Component Inputs

• نتیجه Conclusion

داده ها و استایل در برنامه های Angular Data and Styling in Angular Applications

• بررسی اجمالی Overview

• معرفی Introduction

• ایجاد انواع سفارشی Creating Custom Types

• افزودن داده های جعلی برای توسعه Adding Fake Data For Development

• اضافه کردن سبک به اجزای زاویه ای Adding Styles to Angular Components

• نتیجه Conclusion

مدیریت رویداد پایه در Angular Basic Event Handling in Angular

• بررسی اجمالی Overview

• معرفی Introduction

• نمایش کامپوننت ها در کانتینرهای مختلف Displaying Components in Different Containers

• مدیریت رویدادهای کلیک Handling Click Events

• مدیریت رویداد Angular چگونه متفاوت است؟ How is Angular's Event-Handling Different?

• افزودن کنترل کننده های کلیک به کل کامپوننت ها Adding Click-Handlers to Entire Components

• نتیجه Conclusion

حالت کامپوننت زاویه ای در عمق Angular Component State In-Depth

• بررسی اجمالی Overview

• معرفی Introduction

• همگام نگه داشتن متغیرها با ستترها Keeping Variables In Sync with Setters

• نمایش لیست ها با دستورالعمل ngFor Displaying Lists with the ngFor Directive

• نتیجه Conclusion

اجزای قابل استفاده مجدد ایجاد کنید Create Reusable Components

• بررسی اجمالی Overview

• معرفی Introduction

• ایجاد یک کامپوننت قابل استفاده مجدد Creating a Reusable Component

• نمایش کامپوننت یکسان با داده های مختلف Displaying the Same Component with Different Data

• همگام سازی متغیرها با Getters Keeping Variables in Sync with Getters

• عبور توابع به عنوان ورودی Passing Functions as Inputs

• نتیجه Conclusion

مقدمه ای بر مسیریابی زاویه ای Introduction to Angular Routing

• بررسی اجمالی Overview

• معرفی Introduction

• اضافه کردن مسیریابی به یک برنامه Adding Routing to an Application

• ایجاد اجزای صفحه Creating Page Components

• پارامترهای URL URL Parameters

• پیوند بین صفحات Linking Between Pages

• نتیجه Conclusion

مسیریابی زاویه ای پیشرفته Advanced Angular Routing

• بررسی اجمالی Overview

• معرفی Introduction

• پیمایش به صورت برنامه ای Navigating Programmatically

• ارسال چندین تابع به عنوان ورودی Passing Multiple Functions as Inputs

• ایجاد صفحه 404 Creating a 404 Page

• نمایش 404 صفحه به صورت عمدی Displaying 404 Pages Intentionally

• نتیجه Conclusion

پایداری داده های محلی در Angular Local Data Persistence in Angular

• بررسی اجمالی Overview

• معرفی Introduction

• تکنیک های مسیریابی اضافی Additional Routing Techniques

• داده های ماندگار در LocalStorage Persisting Data in LocalStorage

• متغیرهای عضو به صورت خودکار Automatically Persisting Member Variables

• نتیجه Conclusion

پایداری و برنامه های کاربردی داده های پیشرفته Advanced Data Persistence & Applications

• بررسی اجمالی Overview

• معرفی Introduction

• داده های ماندگار در SessionStorage Persisting Data in SessionStorage

• داده های ماندگار در کوکی ها Persisting Data in Cookies

• به اشتراک گذاری داده ها بین صفحات Sharing Data Between Pages

• افزودن داده های برنامه اصلی به LocalStorage Adding Main Application Data to LocalStorage

• نتیجه Conclusion

آشنایی با فرم های زاویه ای Introduction to Angular Forms

• بررسی اجمالی Overview

• معرفی Introduction

• فرم ها چگونه کار می کنند How Forms Used to Work

• ایجاد یک آیتم فهرست "جدید". Creating A "New" List Item

• ایجاد پیوندهای دوطرفه فرم Creating Two-Way Form Bindings

• افزودن فیلدها به فرم ها Adding Fields to Forms

• نتیجه Conclusion

فرم های پیشرفته و قابلیت استفاده مجدد Advanced Forms and Reusability

• بررسی اجمالی Overview

• معرفی Introduction

• اتصالات دو طرفه با ngModel Two-Way Bindings with ngModel

• ایجاد یک کامپوننت فرم قابل استفاده مجدد Creating a Reusable Form Component

• از پیش جمع کردن مقادیر فرم Pre-Populating Form Values

• نتیجه Conclusion

مقدمه ای بر خدمات انگولار Introduction to Angular Services

• بررسی اجمالی Overview

• معرفی Introduction

• ایجاد و تزریق خدمات Creating and Injecting Services

• بارگیری داده ها از یک سرویس Loading Data from a Service

• ذخیره منطق پیچیده در خدمات Storing Complex Logic in Services

• نتیجه Conclusion

برنامه های چند سرویس در Angular Multi-Service Applications in Angular

• بررسی اجمالی Overview

• معرفی Introduction

• عملیات پایه CRUD در خدمات Basic CRUD Operations in Services

• بارگیری منابع با شناسه در خدمات Loading Resources by ID in Services

• به روز رسانی منابع در خدمات Updating Resources in Services

• ایجاد منابع در خدمات Creating Resources in Services

• حذف منابع در خدمات Deleting Resources in Services

• ایجاد سرویس دیگری Creating Another Service

• نتیجه Conclusion

مقدمه ای بر Redux Introduction to Redux

• بررسی اجمالی Overview

• معرفی Introduction

• مفاهیم اولیه Redux Basic Redux Concepts

• راه اندازی اولیه برنامه Basic Application Setup

• ایجاد کنش ها و کاهش دهنده ها Creating Actions and Reducers

• خواندن مقادیر Redux و Dispatching Actions Reading Redux Values and Dispatching Actions

• نتیجه Conclusion

مفاهیم پیشرفته Redux Advanced Redux Concepts

• بررسی اجمالی Overview

• معرفی Introduction

• افزودن انواع به برنامه Redux Adding Types to a Redux App

• دسترسی به چندین مقدار در Redux Accessing Multiple Values in Redux

• ایجاد انتخابگرهای Redux Creating Redux Selectors

• نتیجه Conclusion

از Redux با ورودی های مختلف استفاده کنید Use Redux with Different Inputs

• بررسی اجمالی Overview

• معرفی Introduction

• استفاده از MaterialUI Sliders با Redux Using MaterialUI Sliders with Redux

• تبدیل دکمه ها به لغزنده Converting Buttons to Sliders

• ایجاد یک لغزنده رنگ قابل استفاده مجدد Creating a Reusable Color Slider

• نتیجه Conclusion

با Redux یک Color-Mixer بسازید Build a Color-Mixer with Redux

• بررسی اجمالی Overview

• معرفی Introduction

• افزودن یک ورودی "رنگ جدید". Adding a "New Color" Input

• حذف رنگ ها Deleting Colors

• ترکیب رنگ های هگزا با استفاده از انتخابگرها Combining Hex Colors Using Selectors

• Redux DevTools Redux DevTools

• نتیجه Conclusion