آموزش Angular (برنامه کامل) با مواد Angular، Angularfire و NgRx [ویدئو]

Angular (Full App) with Angular Material, Angularfire and NgRx [Video]

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: این دوره شما را به سفری می برد که در آن یاد خواهید گرفت که یک برنامه Angular واقعی با استفاده از Angular، Angular Material، AngularFire (+ Firebase با Firestore) و NgRx بسازید. Angular یک فریمورک frontend شگفت انگیز است که با آن می توانید برنامه های وب قدرتمند بسازید. ما عملکردهای پایگاه داده بلادرنگ را اضافه می کنیم و تقریباً قبل از اینکه آنها را در اینجا ایجاد کنیم، به روز رسانی های خود را مشاهده خواهیم کرد. این دوره آموزشی مختصری در مورد Angular، معرفی دقیق Angular Material، و یک برنامه واقعی که از بسیاری از اجزای Angular Material استفاده می کند، ارائه می دهد. بسته کد این دوره ویدیویی در https://github.com/PacktPublishing/Angular-Full-App-with-Angular-Material-Angularfire-and-NgRx در دسترس است. و AngularFire برنامه های بلادرنگ بسازید که نه تنها عالی کار می کنند، بلکه عالی نیز به نظر می رسند یک برنامه واقع گرایانه که از بسیاری از اجزای Angular Material استفاده می کند نمونه‌هایی از مؤلفه‌هایی مانند Datepickers، Sidenavs، یا جدول داده‌های مواد (از جمله مرتب‌سازی، فیلتر کردن، و به‌روزرسانی زنده!) اتصال به پایگاه داده بلادرنگ با Firebase (با استفاده از Firestore) و AngularFire درک بهتر از RxJS مشاهده پذیر مدیریت دولتی پیشرفته با کمک NgRx این دوره برای کسانی طراحی شده است که می خواهند به Angular بپردازند و یک برنامه واقعی با آن بسازند، کسانی که می خواهند Angular را تمرین کنند، کسانی که می خواهند راهنمای عملی برای ساخت برنامه های Angular، و کسانی که علاقه مند به استفاده از Firebase، NgRx و/هستند طراحی شده است. یا Angular Material. آموزش ساخت برنامه های Angular با Material، NgRx و Angularfire * یک دوره عملی که برای ساخت برنامه های Angular طراحی شده است. *

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

شروع شدن Getting Started

  • خوش آمدید و معرفی Welcome & Introduction

  • داخل دوره چیست؟ What's Inside the Course?

  • چگونه از این دوره بیشترین بهره را ببرید How To Get The Most Out Of This Course

  • برنامه ریزی اپلیکیشن Planning the App

بازنگری مختصر زاویه ای (اختیاری) A Brief Angular Refresher (OPTIONAL)

  • معرفی ماژول Module Introduction

  • Angular چیست؟ What is Angular?

  • راه اندازی پروژه با Angular CLI Project Setup with the Angular CLI

  • چگونه یک برنامه Angular شروع و کار می کند How an Angular App Starts and Works

  • افزودن کامپوننت ها Adding Components

  • نحو الگو Template Syntax

  • استفاده از دستورالعمل هایی مانند ngFor و ngIf Using Directives like ngFor and ngIf

  • ویژگی سفارشی و صحافی رویداد Custom Property & Event Binding

  • تشکیل می دهد Forms

  • آشنایی با خدمات و تزریق وابستگی Understanding Services & Dependency Injection

  • مسیریابی زاویه ای Angular Routing

مواد زاویه ای Angular Material

  • معرفی ماژول Module Introduction

  • درک اجزای مواد زاویه ای Understanding Angular Material Components

  • افزودن متریال زاویه ای به پروژه Adding Angular Material to a Project

  • به روز بمانید! Stay Up To Date!

  • اولین جزء مواد زاویه ای ما - دکمه Our First Angular Material Component - The Button

  • ایجاد ساختار برنامه دوره Creating the Course App Structure

  • کار بر روی فرم ثبت نام Working on The Signup Form

  • Flexbox - یک تجدید کننده سریع Flexbox - A Quick Refresher

  • کنترل Layout با @angular/flex-layout Controlling the Layout with @angular/flex-layout

  • افزودن و پیکربندی دکمه ارسال Adding & Configuring the Submit Button

  • پیاده سازی نکات و خطاهای اعتبار سنجی (در فرم ها) Implementing Hints and Validation Errors (on Forms)

  • اضافه کردن یک Datepicker Adding a Datepicker

  • محدود کردن تاریخ های قابل انتخاب Restricting Pickable Dates

  • افزودن چک باکس Adding a Checkbox

  • تکمیل فرم با سبک Finishing the Form with Style

  • بسته شدن Wrap Up

غواصی عمیق تر در مواد زاویه ای Diving Deeper into Angular Material

  • معرفی ماژول Module Introduction

  • اضافه کردن ناوبری و Sidenav Adding Navigation & a Sidenav

  • کار بر روی Sidenav و Toolbar Working on the Sidenav and Toolbar

  • یک ظاهر طراحی Sidenav Styling the Sidenav

  • ریسپانسیو کردن صفحه Making the Page Responsive

  • افزودن موارد ناوبری Adding Navigation Items

  • تقسیم ناوبری به اجزا Splitting the Navigation Into Components

  • کار بر روی صفحه خوش آمدید Working on the Welcome Screen

  • اضافه کردن یک جزء Tabs Adding a Tabs Component

  • افزودن چند "کارت" Adding some "Cards"

  • اضافه کردن منوی کشویی Adding a Dropdown Menu

  • افزودن اسپینر به صفحه آموزش Adding a Spinner to the Training Screen

  • اضافه کردن یک تایمر ورزشی خوب Adding a Nice Exercise Timer

  • افزودن یک صفحه گفتگوی لغو Adding a Cancel Dialog Screen

  • انتقال داده به دیالوگ Passing Data to the Dialog

  • افزودن گزینه های «خروج» و «ادامه» Adding "Exit" and "Continue" Options

  • بسته شدن Wrap Up

کار با داده ها و مواد زاویه ای Working with Data and Angular Material

  • معرفی ماژول Module Introduction

  • مهم: RxJS 6 Important: RxJS 6

  • پیاده سازی احراز هویت Implementing Authentication

  • مسیریابی و احراز هویت Routing & Authentication

  • حفاظت از مسیر Route Protection

  • آماده سازی داده های تمرین Preparing the Exercise Data

  • تزریق و استفاده از خدمات آموزشی Injecting & Using the Training Service

  • تنظیم یک تمرین فعال Setting an Active Exercise

  • کنترل ورزش فعال Controlling the Active Exercise

  • افزودن فرم به مؤلفه آموزشی Adding a Form to the Training Component

  • مدیریت آموزش فعال از طریق یک سرویس Handling the Active Training via a Service

  • مدیریت رویدادهای "تکمیل" و "لغو". Handling "Complete" and "Cancel" Events

  • اضافه کردن جدول داده های مواد زاویه ای Adding the Angular Material Data Table

  • اضافه کردن مرتب سازی به جدول داده ها Adding Sorting to the Data Table

  • افزودن فیلتر به جدول داده ها Adding Filtering to the Data Table

  • افزودن صفحه بندی به جدول داده ها Adding Pagination to the Data Table

  • بسته شدن Wrap Up

با استفاده از Angularfire & Firebase Using Angularfire & Firebase

  • معرفی ماژول Module Introduction

  • Firebase چیست؟ What is Firebase?

  • شروع کار با Firebase Getting Started with Firebase

  • Angularfire چیست؟ What is Angularfire?

  • Refresher RxJS Oservables RxJS Oservables Refresher

  • غواصی در Firebase Diving into Firebase

  • گوش دادن به تغییرات ارزش (Firestore) Listening to Value Changes (of Firestore)

  • گوش دادن به تغییرات Snapshot (Firestore، از جمله متادیتا) Listening to Snapshot Changes (of Firestore, incl. Metadata)

  • تجدید ساختار کد Restructuring the Code

  • Firebase چگونه اشتراک ها را مدیریت می کند How Firebase Manages Subscriptions

  • ذخیره تمرینات تکمیل شده در Firestore Storing Completed Exercises on Firestore

  • اتصال جدول داده به Firestore Connecting the Data Table to Firestore

  • کار با اسناد Working with Documents

  • افزودن احراز هویت واقعی (ثبت نام) Adding Real Authentication (Sign Up)

  • افزودن ورود کاربر Adding User Login

  • آشنایی با احراز هویت در SPA ها Understanding Authentication in SPAs

  • پیکربندی قوانین امنیتی Firestore Configuring Firestore Security Rules

  • مدیریت اشتراک های Firestore Managing Firestore Subscriptions

  • سازماندهی مجدد کد Reorganizing the Code

  • بسته شدن Wrap Up

بهینه سازی برنامه Optimizing the App

  • معرفی ماژول Module Introduction

  • بهبود سبک و مدیریت خطا Style Improvements & Error Handling

  • اضافه کردن اسپینر Adding a Spinner

  • افزودن نوار اسنک با قابلیت استفاده مجدد (اعلان) Adding a Re-Usable Snackbar (Notification)

  • بهبود مدیریت خطا Improving Error Handling

  • تقسیم برنامه به ماژول Splitting the App Into Modules

  • بهینه سازی اشتراک ها Optimizing Subscriptions

  • ایجاد یک SharedModule Creating a SharedModule

  • تقسیم کردن مسیرها Splitting Up Routes

  • بارگذاری یک ماژول با تنبلی Loading a Module Lazily

  • جابجایی گارد Auth Moving the Auth Guard

  • بسته شدن Wrap Up

استفاده از NgRx برای مدیریت دولتی Using NgRx for State Management

  • معرفی ماژول Module Introduction

  • مفاهیم اصلی NgRx - اولین مثال NgRx Core Concepts - A First Example

  • کار با چند کاهش دهنده و اکشن Working with Multiple Reducers & Actions

  • ارسال اقدامات و انتخاب برش های حالت Dispatching Actions & Selecting State Slices

  • افزودن کاهش دهنده تأیید اعتبار (و اقدامات) Adding an Auth Reducer (and Actions)

  • اضافه کردن اشتراک های Auth Adding Auth Subscriptions

  • افزودن کاهش دهنده آموزشی و اقدامات با بارگذاری Adding the Training Reducer and Actions with Payloads

  • حالت لود تنبل Lazy Loaded State

  • اعزام اقدامات آموزشی Dispatching Training Actions

  • انتخاب وضعیت آموزش Selecting Training State

  • انتخاب صحیح مقادیر واحد Selecting Single Values Correctly

  • اتصال جدول داده ها Connecting the Data Table

  • پاکسازی پروژه Cleaning the Project Up

  • اضافه کردن یک رفع اشکال کوچک Adding a small Bugfix

  • بسته شدن Wrap Up

  • Redux چیست - مروری What is Redux - An Overview

استقرار برنامه Deploying the App

  • مقدمه و آماده سازی Introduction & Preparation

  • استقرار برنامه در میزبانی Firebase Deploying the App to Firebase Hosting

جایزه: تم های متریال زاویه ای BONUS: Angular Material Themes

  • خلاصه دوره Course Roundup

نمایش نظرات

Packtpub یک ناشر دیجیتالی کتاب‌ها و منابع آموزشی در زمینه فناوری اطلاعات و توسعه نرم‌افزار است. این شرکت از سال 2004 فعالیت خود را آغاز کرده و به تولید و انتشار کتاب‌ها، ویدیوها و دوره‌های آموزشی می‌پردازد که به توسعه‌دهندگان و متخصصان فناوری اطلاعات کمک می‌کند تا مهارت‌های خود را ارتقا دهند. منابع آموزشی Packtpub موضوعات متنوعی از جمله برنامه‌نویسی، توسعه وب، داده‌کاوی، امنیت سایبری و هوش مصنوعی را پوشش می‌دهد. محتوای این منابع به صورت کاربردی و به‌روز ارائه می‌شود تا کاربران بتوانند دانش و توانایی‌های لازم برای موفقیت در پروژه‌های عملی و حرفه‌ای خود را کسب کنند.

آموزش Angular (برنامه کامل) با مواد Angular، Angularfire و NgRx [ویدئو]
جزییات دوره
11 h 30 m
119
Packtpub Packtpub
(آخرین آپدیت)
از 5
ندارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar