آموزش Blazor Through the Ages - (تعاملی دستی)

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

مقدمه Introduction

• تشویق سازنده بازخورد: پیامی به دانشجویان Udemy ما Encouraging Constructive Feedback: A Message to Our Udemy Students

• مقدمه و ویژگی ها Introduction and Features

• محدوده دوره Course Scope

• نصب و پیکربندی Blazor Blazor Installation and Configuration

• نسخه نمایشی زنده برنامه کامل فیلم Blazor Live Demo Of Completed Blazor Movie App

• نسخه نمایشی زنده Blazor Client با API وب مصرف کننده صفحه Live Demo of Blazor Client with Pagination Consuming Web API

انتقال کامل Blazor MovieApp به ASP.NET6.0 Migrating the Completed Blazor MovieApp to ASP.NET6.0

• انتقال برنامه تکمیل شده فیلم CRUD به ASP.NET 6.0 Migrating the Completed Movie App CRUD Application to ASP.NET 6.0

مقدمه ای بر ASP.NET Core 3.1 Blazor Introduction To ASP.NET Core 3.1 Blazor

• بلزور چیست؟ What is Blazor ?

• مدل های هاست بلزور Blazor Hosting Models

قطعات در Blazor Components in Blazor

• اولین جزء Razor خود را در Blazor ایجاد کنید Create Your First Razor Component in Blazor

• یک مؤلفه تودرتو در Blazor ایجاد کنید Create a Nested Component in Blazor

چه چیزی در Blazor 3.1 با ASP.NET Core 3.1 منتشر شد؟ What's New in Blazor 3.1 Released With ASP.NET Core 3.1?

• کلاس های جزئی و استفاده از تگ مؤلفه Partial Classes And Component Tag Usage

• انتقال پارامتر به کامپوننت ها و جلوگیری از عملکرد پیش فرض Pass Parameter To Components And Prevent Default Action

• توقف انتشار رویداد و مدیریت دقیق خطا در طول ساخت برنامه Stop Event Propagation And Detailed Error Handling During App Building

تمرین تکلیف Assignment Exercise

• کدگذاری در تمرین 1 را کامل کنید Complete the Coding in the Exercise 1

مفاهیم پیشرفته با کدنویسی دستی در Blazor Advanced Concepts with Hands-On Coding in Blazor

• مسیریابی در ASP.NET Core 3.1 Blazor Routing in ASP.NET Core 3.1 Blazor

• اتصال داده های یک طرفه در ASP.NET Core 3.1 Blazor One Way Data Binding in ASP.NET Core 3.1 Blazor

• تماس مجدد رویداد در ASP.NET Core 3.1 Blazor Event callback in ASP.NET Core 3.1 Blazor

• اتصال داده دو طرفه در ASP.NET Core 3.1 Blazor Two Way Data Binding in ASP.NET Core 3.1 Blazor

• وراثت در ASP.NET Core 3.1 Blazor Inheritance in ASP.NET Core 3.1 Blazor

• روش‌های چرخه حیات در ASP.NET Core 3.1 Blazor - قسمت 1 (مبانی) Lifecycle methods in ASP.NET Core 3.1 Blazor - Part 1 (Fundamentals)

• روش‌های چرخه حیات (مثال کد) - SetParametersAsync Lifecycle methods (Code Example) - SetParametersAsync

• روش‌های چرخه حیات (مثال کد) - OnInitialized & OnInitializedAsync Lifecycle methods (Code Example) - OnInitialized & OnInitializedAsync

• روش‌های چرخه حیات (مثال کد) - OnParametersSet & OnParametersSetAsync Lifecycle methods (Code Example) - OnParametersSet & OnParametersSetAsync

• روش‌های چرخه زندگی (مثال کد) - OnAfterRender & OnAfterRenderAsync Lifecycle methods (Code Example) - OnAfterRender & OnAfterRenderAsync

• روش های چرخه حیات (مثال کد) - ShouldRender Lifecycle methods (Code Example) - ShouldRender

مبانی برنامه نویسی ناهمزمان Asynchronous Programming Fundamentals

• برنامه نویسی ناهمزمان را از طریق مثال های کدنویسی یاد بگیرید Learn Asynchronous Programming through Coding Examples

یک برنامه CRUD در Blazor ایجاد کنید Create a CRUD Application in Blazor

• یک برنامه Blazor (سرور) با احراز هویت حساب های کاربری فردی ایجاد کنید Create a Blazor (Server) App with Individual User Accounts Authentication

• برنامه Blazor را اجرا کنید Run the Blazor App

• ساختار پروژه را درک کنید Understand the Project Structure

• کلاس برنامه و شی میزبان The Program Class and Host Object

• کلاس استارتاپ Startup Class

• عملکرد _Imports.razor Class Function of _Imports.razor Class

• پوشه مشترک The Shared Folder

• ایجاد یک پایگاه داده و اضافه کردن جداول برای ذخیره کاربران و نقش ها Create a Database and Add Tables To Store Users and Roles

• کاربران و نقش ها را اضافه کنید Add Users and Roles

• اجرای مجوز پایه Implement Basic Authorization

• دستورالعمل های صفحه پرکاربرد برای صفحه Razor Frequently Used Page Directives for a Razor Page

• یک کلاس فیلم ایجاد کنید Create a Movie Class

• موجودیت فیلم را در ApplicationDbContext اضافه کنید Add the Movie Entity in the ApplicationDbContext

• اضافه کردن مهاجرت برای ایجاد جدول فیلم Add Migration to Create Movies Table

• یک رابط برای سرویس دسترسی به داده ایجاد کنید Create an Interface for Data Access Service

• یک سرویس دسترسی به داده و روش‌هایی برای بازیابی سوابق ایجاد کنید Create a Data Access Service and Methods to Retrieve Records

• ایجاد متدهایی برای عملیات افزودن، ویرایش و حذف Create Methods for Add, Edit and Delete Operations

• کلاس خدمات دسترسی به داده را در Startup ثبت کنید Register the Data Access Services Class in Startup

• پایگاه داده فیلم ها را ببینید Seed the Movies Database

• یک صفحه جزئیات برای نمایش لیست فیلم ها ایجاد کنید Create a Details Page to Show List of Movies

• بوت استرپ را به پروژه اضافه کنید Add Bootstrap to the Project

• برای افزودن یک فیلم، یک گفتگوی پاپ آپ Modal ایجاد کنید Create a Modal Popup Dialog to Add a Movie

• جدول فیلم ها را ویرایش کنید Edit the Movies Table

• اعتبارسنجی داده های کاربر User Data Validation

• داده ها را در پایگاه داده ذخیره کنید Save Data to the Database

• JavaScript Interop Call to Close Modal JavaScript Interop Calls to Close Modal

• ارتباط بین جزئیات فیلم و فیلم Communication Between Movie Detail and Movies

• ویرایش فیلم ها Edit Movies

• استفاده از قطعه را برای تغییر پویا عنوان مدال رندر کنید Render Fragment Usage to Change Modal Title Dynamically

• یک گفتگوی تایید حذف ایجاد کنید Create a Confirm Delete Dialog

• عملیات حذف را کامل کنید Complete the Delete Operation

احراز هویت و مجوز Authentication and Authorization

• احراز هویت در عمل برای برنامه فیلم Authentication in Action for the Movie App

• مشاهده اطلاعات نمایه کاربر با مجوز View User Profile Data with Authorization

• برنامه را برای محافظت از داده های کاربر اجرا و آزمایش کنید Run and Test the App For User Data Protection

• نصب برنامه Blazor Movie با پایگاه داده از GitHub در ماشین های کاربر Installing the Blazor Movie App with Database from GitHub on User Machines

محتوای اضافی: اضافه کردن Spinkit برای بارگیری نشانگر در برنامه Movies Additional Content : Adding Spinkit For Loading Indication to Movies App

• افزودن Spinkit به برنامه Adding Spinkit to the App

• استفاده از Spinkit با جزء Spinloader Using Spinkit with Spinloader component

• تست چند جزء اسپینر Testing a Few Spinner Components

• یک کامپوننت Blazor برای افزودن اعداد و نمایش در مرورگر ایجاد کنید Create a Blazor Component to Add Numbers and Display on the Browser

صفحه بندی فیلم ها Paginating the Movies

• نمایش فیلم های صفحه بندی شده Display Paginated Movies

بخش پاداش: برنامه های کاربردی وب پیشرفته Bonus Section: Progressive Web Applications

• برنامه وب پیشرو چیست؟ What is a Progressive Web Application ?

تست Blazor با استفاده از bUnit Testing Blazor Using bUnit

• تست کامپوننت شمارنده Testing the Counter Component

امتیاز: ایجاد یک برنامه Blazor در ASP.NET 6.0 با صفحه بندی که API وب را مصرف می کند Bonus: Create a Blazor App in ASP.NET 6.0 with Pagination that Consumes Web API

• لینک های کد منبع Source Code Links

• مخزن API وب مشتری را کلون کنید Clone the Customer Web API Repository

• برنامه سرور Blazor را ایجاد کنید Create the Blazor Server Application

• مدل مشتری را در برنامه سرور Blazor تعریف کنید Define the Customer Model in the Blazor Server App

• یک کلاس خدمات مشتری برای مصرف Api وب مشتری ایجاد کنید Create a Customer Service Class to Consume the Customer Web Api

• کامپوننت Customer List Razor را برای رندر کردن مشتریان ایجاد کنید Create the Customer List Razor Component to Render the Customers

• یک منوی پیمایش برای مشاهده لیست مشتریان ایجاد کنید Create a Navigation Menu for Viewing the Customer List

Blazor در نسخه های بعدی ASP.NET Blazor in Later Versions of ASP.NET

• یک ویرایشگر ایمیل با پیش نمایش زنده در Blazor در ASP.NET 7 ایجاد کنید Create an Email Editor with Live Preview in Blazor in ASP.NET 7

• یک برنامه رندر جریانی سمت سرور با Blazor در ASP.NET 8 بسازید Build a Server-Side Streaming Rendering App with Blazor in ASP.NET 8