آموزش Angular 8 را با ایجاد یک برنامه وب ساده Full Stack بیاموزید [ویدئو]

معرفی Introduction

• معرفی Introduction

وب API Web API

• SQL Server و SSMS را نصب کنید Install SQL Server and SSMS

• ویژوال استودیو 2019 را نصب کنید Install Visual Studio 2019

• ایجاد پایگاه داده در MS SQL Server Create Database in MS SQL Server

• ایجاد جدول بخش در MS SQL Create Department Table in MS SQL

• ایجاد جدول کارکنان در MS SQL Create Employee Table in MS SQL

• پروژه Web API را در ویژوال استودیو ایجاد کنید Create Web API project in Visual Studio

• Web API را مجبور کنید که فقط پاسخ JSON را خروجی کند Force Web API to output JSON response only

• سرویس گیرنده Postman را نصب کنید Install Postman client

• کلاس مدل برای برنامه ما ایجاد کنید Create Model Class for our Application

• کنترلرهای Web API را ایجاد کنید Create Web API Controllers

• پیاده سازی متد GET در Web API Implement GET method in Web API

• پیاده سازی متد POST در Web API Implement POST method in Web API

• پیاده سازی روش PUT در Web API Implement PUT method in Web API

• روش DELETE را در Web API پیاده سازی کنید Implement DELETE method in Web API

زاویه ای 8 Angular 8

• Node JS را نصب کنید Install Node JS

• کد ویژوال استودیو را نصب کنید Install Visual Studio Code

• Angular 8 را نصب کنید Install Angular 8

• پروژه Angular 8 را ایجاد کنید Create Angular 8 project

• بوت استرپ را روی پروژه Angular ما نصب کنید Install bootstrap onto our Angular project

• Angular Material Design را نصب کنید Install Angular Material Design

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

• منوی ناوبری بوت استرپ را اضافه کنید Add Bootstrap Navigation Menu

• مدل‌ها و سرویس‌ها را برای برنامه Angular ما ایجاد کنید Create Models and Services for our Angular App

• جدول طراحی متریال برای صفحه بخش Material Design Table for Department Page

• روش GET را مصرف کنید و جزئیات بخش را نمایش دهید Consume GET method and display Department details

• مشکل CORS The CORS problem

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

• فیلتر کردن Filtering

• پنجره گفتگوی Mat Mat Dialog Window

• برای جزئیات بخش، فیلدها را فرم دهید Form fields for department details

• برای جزئیات بخش، از روش POST در Angular App استفاده کنید Consume POST method in Angular App for Department details

• بازخوانی شبکه در حالت بسته شدن پنجره Refresh grid on Modal Window close

• جزء اسنک بار در طراحی متریال Snackbar component in Material design

• روش API DELETE را در Angular مصرف کنید Consume API DELETE method in Angular

• برای به روز رسانی یک بخش، از روش API PUT در Angular استفاده کنید Consume API PUT method in Angular to update a department

• نمایش جزئیات صفحه کارمند Show details for Employee page

• مولفه جزئیات کارمند جدید را اضافه کنید Add new employee details component

• کشویی و Datepicker در فرم Dropdown and Datepicker in Form

• جزئیات کارمند را حذف و ویرایش کنید Delete and edit employee details

• مسیریابی را برای برنامه Angular 8 ما پیاده سازی کنید Implement routing for our Angular 8 app