DOTNET Core 6 + React + Redux

By : Eng.Muhammad Awadallah
Fb: https://www.facebook.com/muhammad.awadallah1981

Whatsapp : 00201004207522

Course Content
Section 1 : Course Introduction
1-Introduction
2-Installing VSCode and extensions
3-Installing environments and create solution
Section 2 : Web API Basics
4-Review webapi template and new in .Net6 p1
5-Review webapi template and new in .Net6 p2
6-Creating Product Class
7-Entity Framework Core
8-Adding SouqContext Class
9-Adding migration and create Database
10-Creating DbInitializer Class
11-Configure program class to migrate and seed data
12-Add Products API Controller
 13-Using Asynchronous Code
Section 3 : React Basics
14-Introduction To React
15-Create React App
16-Review React App Files
17-React Component Basics
18-useState Hook
19-useEffect Hook
20-Adding CORS
21-Adding Product Interface
22-React File Structure
23-Props In React
24-Styling With Material UI
25-MUI List Component
26-Adding Product List And Product Card
27-React Developer Tool Installing
28-Adding App Bar MUI Component
29-Grid And Card
30-Styling Product Card
Section 4 : React Routing
31-React Router Dom Installing
 32-Browser Router
33-Adding Links To App Bar
34-Links Styling
35-useParams Hook
36-Adding Axios
37-Component UnMounting Life Cycle
Section 5 : HttpResponse Errors Handling
38-HttpResponse Errors Handling Intro
39-Adding Error Controller
40-Adding Custom Error Middleware
41-Adding API agent inside SPA
42-Testing Errors Responses
43-Axios Interceptors
44-Adding React Toastify
45-Handling Validation Errors
46-History Router
47-Use Navigate Use Location
48-Adding NotFound Component
49-Adding Loader Component
50-Using Dotnet Debugger Tool
51-Using React Debugger Tool
Section 6 : Adding Shopping Cart
52-Creating Basket Entity
53-Add And Remove Basket Item
54-Create Basket Controller
55-Add Basket Item Endpoint Logic
56-Add Basket Item Endpoint Logic
57-Data Transfer Object
58-Remove Basket Item Endpoint
59-CreatedAtRoute
60-Adding Axios Methods Of Basket
61-Creating Basket Component
62-React Context Global State
63-Get Basket On App Start
64-Consume Souq Context
65-Update Basket Items Counter
66-Increase And Decrease Basket Item Quantity
67-Solving Loaders Problem
68-Adding Basket Summary
69-Updating Item Quantity In Product Details
70-Updating Quantity Functionality
71-Adding Checkout Page Component
Section 7 : Redux
72-Redux Introduction
73-Creating Redux Store
74-Redux Actions
75-Action Creators
76-Using Redux Toolkit
77-Redux Dev Tools
78-Adding Basket Slice
79-Using Redux Souq Store
80-Create Async Thunk In Redux
81-Using Async Thunk In Redux
82-Adding Remove Item Async Thunk
83-Resolve Remove Item Loader
84-Using Entity Adapters
85-Using Entity Adapter Selectors
86-Fetching Single Product
87-Thunk API In Redux
88-Basket Slice Error Handling
Section 8 : Paging – Sorting - Filtering
89-Adding Sort Method In API
90-Adding Search Method In API
 91-Adding Filter Method In API
92-Adding Pagination Helper Classes
93-Adding PagedList Class
94-Adding Pagination Header
95-Adding Filters Endpoint
96-Fetch Filters Async
97-Adding Filters Section In SPA
98-Adding Product Params In Redux State
99-Using Product Params In Axios Get Request
100-Searching Filter On SPA
101-Sorting Filter On SPA
102-Types And Brands Filter On SPA
103-Setup Pagination In SPA
104-Adding App Pagination Component
105-Resolve Filters Issue
106-Adding MUI React Skeleton
Section 9 : Identity
107-Identity Introduction
108-Identity Setting Up
109-Adding Identity Configuration
110-Adding Account Controller
111-Testing Account Controller
112-JSON Web Tokens
113-Creating Token Service
114-Using Token Service
115-Validating Token On API
116-Configuring Swagger To Add Authorization
117-Adding Login And Register Components
118-Adding Login Form
119-Using Controlled Component
120-Adding React Hook Form
121-Using React Hook Form Validators
122-Adding Account Slice
123-Adding User Menu
124-Persisting The Login
125-Use Callback Hook
126-Adding Register Form
127-Adding Registeration Validators
128-Transfer Basket To Logged In User
129-Transfer Basket Coding On SPA
130-Adding Protected Route In React
Section 10 : Orders And Payment
131-Adding Order Entities
132-Refactoring Identity To Use Int
133-Adding Orders Controller
134-Adding Create Order Method
135-Testing Orders Controller
136-Mapping Order To OrderDto
137-Designing Checkout Page
138-Use Controller Hook
139-Use Form Context Hook
140-Creating Reusable Checkbox
141-Using Validation Yup Library
142-Updating Review Component
143-Updating Payment Form Component
144-Placing Order
145-Fetching Saved Address Of User
146-Adding Orders Component
147-View Order Details
148-Setting Up Stripe
149-Creating Payment Service
150-Adding Payment Controller
 151-Adding Stripe To SPA
152-Using Stripe Payment Input
153-Validating Stripe Inputs
154-Disabled Place Order Button
155-Create Payment Intent In SPA
156-Submit Order
157-Testing Card Payment
158-Installing Stripe CLI
159-Creating Stripe Web Hook Endpoint
Section 11 : CRUD Operations And Images
160-Adding Create Product Endpoint
161-Adding Automapper
162-Adding Update Product Endpoint
163-Adding Delete Product Endpoint
164-Adding Image Service
165-Using Image Service
166-Updating And Deleting Images
167-Adding Inventory Component
168-Adding Product Form
169-Adding App Select List
170-Reusable Textarea And Number Inputs
 171-Adding React Drop Zone
172-Styling Drop Zone
173-Validating Product Form
174-Submitting Product Form
175-Deleting Product From Inventory
176-Extracting Roles From Token
177-Using Roles In React
Section 12 : Deployment
178-Creating React Production Build
179-Serving SPA from API
180-Switching To PostgreSQL DB
181-Test Application Before Publish
182-Setting Up Heroku
183-Deploying To Heroku

َ ‫َي َوأَ ْن أَ ْع َم َل‬

َ ‫صا ِّل ًحا تَ ْر‬
‫ضا ُه‬ َّ ‫علَ ٰى َوا ِّلد‬ َ َ‫شك َُر نِّ ْع َمتَكَ الَّتِّي أَ ْن َع ْمت‬
َ ‫علَ َّي َو‬ ْ َ‫ب أَ ْو ِّز ْعنِّي أَ ْن أ‬
ِّ ‫َر‬
َّ ‫َوأَد ِّْخ ْلنِّي ِّب َر ْح َمتِّكَ ِّفي ِّعبَا ِّدكَ ال‬
َ ‫صا ِّل ِّح‬
‫ين‬