Learn to build an ecommerce app with Net Core and Angular

Build a proof of concept e-commerce store using Angular, .Net and Stripe for payment processing
Learn to build an ecommerce app with Net Core and Angular
File Size :
16.96 GB
Total length :
34h 37m



Neil Cummings


Last update




Learn to build an ecommerce app with Net Core and Angular

What you’ll learn

.Net Core
C# Generics
Repository and Unit of Work Pattern
Specification Pattern
Angular Lazy loading
Angular Routing
Angular Reactive Forms
Angular Creating a MultiStep form wizard
Accepting payments using Stripe
Angular Re-usable form components
Angular validation and async validation

Learn to build an ecommerce app with Net Core and Angular


3-6 Months prior coding experience


*** Now updated to .Net 7.0 and Angular 15 as at January 2023***Have you learnt the basics of ASP.NET Core and Angular?  Not sure where to go next?  This course should be able to help with that.  In this course we start from nothing and build a proof of concept E-Commerce store using these frameworks.In this course we build a complete application from start to finish and every line of code is demonstrated and explained.Here are some of the things you will learn about in this course:Setting up the developer environmentCreating a multi project .net core application using the dotnet CLICreating a client side front-end Angular UI for the store using the Angular CLILearn how to use the Repository, Unit of Work and specification pattern in .net coreUsing multiple DbContext as context boundariesUsing ASP.NET Identity for login and registrationUsing the angular modules to create lazy loaded routes.Using Automapper in ASP.NET CoreBuilding a great looking UI using BootstrapMaking reusable form components using Angular Reactive formsPaging, Sorting, Searching and FilteringUsing Redis to store the shopping basketCreating orders from the shopping basketAccepting payments via Stripe using the new EU standards for 3D securePublishing the application to LinuxMany more things as wellTools you need for this courseIn this course all the lessons are demonstrated using Visual Studio Code, a free cross platform code editor.   You can of course use any IDE you like and any Operating system you like… as long as it’s Windows, Linux or Mac.   Is this course for you?This course is very practical, about 90%+ of the lessons will involve you coding along with me on this project.  If you are the type of person who gets the most out of learning by doing, then this course is definitely for you.    Important: If you have never coded before and you want to learn .Net and Angular you would be better starting with my other .Net Core and Angular course before this one.On this course we will build an example E-commerce store, completely from scratch using the DotNet CLI and the Angular CLI to help us get started.  All you will need to get started is a computer with your favourite operating system, and a passion for learning how to build an application using ASP.NET Core and Angular.  


Section 1: Introduction

Lecture 1 Introduction

Lecture 2 Setting up the developer environment

Lecture 3 Setting up VS Code for C# development

Lecture 4 Where to get the source code and course assets

Section 2: API Basics

Lecture 5 Introduction

Lecture 6 Creating the Web API project

Lecture 7 Running the API using the DotNet CLI

Lecture 8 Reviewing the Web API startup files

Lecture 9 Adding our first API Controller

Lecture 10 Adding a C# Entity class

Lecture 11 Setting up Entity Framework

Lecture 12 Adding a connection string

Lecture 13 Adding an Entity Framework migration

Lecture 14 Updating the database

Lecture 15 Reading the data from the Database in the API

Lecture 16 Postman Collections

Lecture 17 Creating the additional projects

Lecture 18 Saving our project into source control using Git and GitHub

Lecture 19 Summary of section 2

Section 3: API Architecture

Lecture 20 Introduction

Lecture 21 The Repository Pattern

Lecture 22 Adding a Repository and Interface

Lecture 23 Adding the repository methods

Lecture 24 Extending the products entity and creating related entities

Lecture 25 Creating a new migration for the entities

Lecture 26 Configuring the migrations

Lecture 27 Applying the migrations and creating the Database at app startup

Lecture 28 Adding Seed data

Lecture 29 Adding the code to get the product brands and types

Lecture 30 Eager loading of navigation properties

Lecture 31 Summary of section 3

Section 4: API Generic Repository

Lecture 32 Introduction

Lecture 33 Creating a Generic repository and interface

Lecture 34 Implementing the methods in the Generic repository

Lecture 35 Introduction to the specification pattern

Lecture 36 Creating a specification class

Lecture 37 Creating a specification evaluator

Lecture 38 Implementing the repository with specification methods

Lecture 39 Using the specification methods in the controller

Lecture 40 Getting a single product with specification

Lecture 41 Using the Debugger to view the spec pattern in action

Lecture 42 Shaping the data to return with DTOs

Lecture 43 Adding AutoMapper to the API project

Lecture 44 Configuring AutoMapper profiles

Lecture 45 Adding a Custom Value Resolver for AutoMapper

Lecture 46 Serving static content from the API

Lecture 47 Summary of section 4

Section 5: API Error Handling

Lecture 48 Introduction

Lecture 49 Creating a test controller for errors

Lecture 50 Creating a consistent error response from the API

Lecture 51 Adding a not found endpoint error handler

Lecture 52 Creating Exception handler middleware

Lecture 53 Improving the validation error responses

Lecture 54 Adding Swagger for documenting our API

Lecture 55 Improving the swagger documentation

Lecture 56 Cleaning up the Startup class

Lecture 57 Summary of section 5

Section 6: API Paging, Filtering, Sorting & Searching

Lecture 58 Introduction

Lecture 59 Adding a sorting specification class

Lecture 60 Adding a sorting specification part 2

Lecture 61 Working around the decimal problem in Sqlite

Lecture 62 Adding filtering functionality

Lecture 63 Adding Pagination Part 1

Lecture 64 Adding Pagination Part 2

Lecture 65 Adding Pagination Part 3

Lecture 66 Adding the search functionality

Lecture 67 Adding CORS Support to the API

Lecture 68 Summary of section 6

Section 7: Client – Angular setup

Lecture 69 Introduction

Lecture 70 Setting up the developer environment for Angular

Lecture 71 Creating the Angular project

Lecture 72 Reviewing the Angular project files in the template

Lecture 73 Setting up Angular to use HTTPS

Lecture 74 Adding bootstrap and font-awesome

Lecture 75 Adding VS Code extensions for Angular

Section 8: Client – Angular Basics

Lecture 76 Introduction

Lecture 77 Adding a Nav Bar component

Lecture 78 Adding the NavBar HTML code

Lecture 79 Styling the nav bar

Lecture 80 Intro to the Http Client Module

Lecture 81 Observables

Lecture 82 Intro to Typescript

Lecture 83 Typescript Demo

Lecture 84 Creating a products interface

Lecture 85 Summary of section 8

Section 9: Client – Building the UI for our shop

Lecture 86 Introduction

Lecture 87 Organising our files and folders

Lecture 88 Intro to Angular services

Lecture 89 Consuming services in the component

Lecture 90 Designing the shop page

Lecture 91 Adding a child component for the product items

Lecture 92 Passing down data to child components

Lecture 93 Adding the product filters

Lecture 94 Adding the filter functionality

Lecture 95 Hooking up the filter to the HTML

Lecture 96 Adding the sort functionality

Lecture 97 Adding the pagination functionality

Lecture 98 Adding the pagination functionality part 2

Lecture 99 Adding the pagination functionality part 3

Lecture 100 Adding a pagination header

Lecture 101 Making the pagination component a shared component

Lecture 102 Pagination and Output properties

Lecture 103 Adding the search functionality

Lecture 104 Resolving the Bug!

Lecture 105 Summary of section 9

Section 10: Client – Routing

Lecture 106 Introduction

Lecture 107 Creating additional components to route to

Lecture 108 Creating the routes

Lecture 109 Setting up the nav links

Lecture 110 Making the links active

Lecture 111 Getting an individual product

Lecture 112 Adding the product detail page

Lecture 113 Lazy loading angular modules

Lecture 114 Summary of section 10

Section 11: Client – Error handling

Lecture 115 Introduction

Lecture 116 Creating an error component for testing the error responses

Lecture 117 Creating additional error components

Lecture 118 Using the Http Interceptor to catch errors

Lecture 119 Adding toast notifications

Lecture 120 Handling validation errrors

Lecture 121 Improving the internal server error component

Lecture 122 Summary of section 11

Section 12: Client – Pazzazz

Lecture 123 Introduction

Lecture 124 Adding a section header

Lecture 125 Adding breadcrumbs

Lecture 126 Using the breadcrumb service

Lecture 127 Setting the section header title from the breadcrumb service

Lecture 128 Styling the product items

Lecture 129 Changing the bootstrap theme

Lecture 130 Adding loading indicators

Lecture 131 Cleaning up loading issues

Lecture 132 Adding the home page content

Lecture 133 Summary of section 12

Section 13: API – Basket

Lecture 134 Introduction

Lecture 135 Setting up Redis

Lecture 136 Setting up the basket class

Lecture 137 Creating a basket repository interface

Lecture 138 Implementing the basket repository

Lecture 139 Adding the basket controller

Lecture 140 Installing Redis with Docker

Lecture 141 Installing Redis on a Mac

Lecture 142 Installing Redis on Windows

Lecture 143 Testing the basket functionality

Lecture 144 Summary of section 13

Section 14: Client – Basket

Lecture 145 Introduction

Lecture 146 Creating the basket module

Lecture 147 Creating the basket types

Lecture 148 Basket service methods

Lecture 149 Adding an item to the basket service method

Lecture 150 Adding the add item to basket in the component method

Lecture 151 Persisting the basket on startup

Lecture 152 Displaying the basket item count in the nav bar

Lecture 153 Styling the basket page

Lecture 154 Adding the basket totals to the service

Lecture 155 Creating the order summary component

Lecture 156 Adding the increment and decrement functionality

Lecture 157 Adding the basket component functions

Lecture 158 Hooking up the product detail component to the basket

Lecture 159 Adding the checkout module

Lecture 160 Summary of section 14

Section 15: API – Identity

Lecture 161 Introduction

Lecture 162 Setting up the identity packages

Lecture 163 Setting up the identity classes

Lecture 164 Adding the IdentityDbContext

Lecture 165 Adding a new migration

Lecture 166 Seeding identity data

Lecture 167 Adding the Startup services for identity

Lecture 168 Adding identity to program class

Lecture 169 Adding an Account controller

Lecture 170 Registering a user

Lecture 171 Adding a token generation service

Lecture 172 Setting up identity to use the token

Lecture 173 Testing the token

Lecture 174 Troubleshooting auth issues

Lecture 175 Adding additional account methods

Lecture 176 Adding user manager extension methods

Lecture 177 Adding another Dto for the user

Lecture 178 Summary of section 15

Section 16: API – Validation

Lecture 179 Introduction

Lecture 180 .Net core error responses

Lecture 181 Model validation

Lecture 182 Checking for duplicate email addresses

Lecture 183 Validating the basket

Lecture 184 Updating swagger config for identity

Lecture 185 Summary of section 16

Section 17: Client – Identity

Lecture 186 Introduction

Lecture 187 Creating the account module

Lecture 188 Creating the account service methods

Lecture 189 Creating the login form

Lecture 190 Angular forms introduction

Lecture 191 Using reactive forms in Angular

Lecture 192 Submitting data to the server

Lecture 193 Updating the nav bar for the logged in user

Lecture 194 Persisting the login

Lecture 195 Adding a dropdown to the navbar

Lecture 196 Form Validation in Angular

Lecture 197 Displaying validation errors

Lecture 198 Creating a reusable text input

Lecture 199 Reusable text input template

Lecture 200 Creating a register form

Lecture 201 Dealing with modelstate errors

Lecture 202 Async validation

Lecture 203 Improving the async validator

Lecture 204 Creating an auth guard

Lecture 205 Using the replay subject

Lecture 206 Summary of section 17

Section 18: API – Orders

Lecture 207 Introduction

Lecture 208 Creating the order aggregate part 1

Lecture 209 Creating the order aggregate part 2

Lecture 210 Configuring the order entities

Lecture 211 Store context update and seeding delivery methods

Lecture 212 Creating the order migration

Lecture 213 Creating an order service

Lecture 214 Implementing the create order method

Lecture 215 Creating the order controller

Lecture 216 Debugging the order method

Lecture 217 Introducing the Unit of work

Lecture 218 Implementing the Unit of work

Lecture 219 Updating the generic repository

Lecture 220 Refactoring the Order service to use the Unit of work

Lecture 221 Using the debugger to view the order creation

Lecture 222 Implementing the Order get methods

Lecture 223 Order controller get methods

Lecture 224 Testing the order controller get methods

Lecture 225 Shaping the order data

Lecture 226 AutoMapper config for orders

Lecture 227 Another AutoMapper value resolver

Lecture 228 Summary of section 18

Section 19: Client – Checkout

Lecture 229 Introduction

Lecture 230 Checkout page layout

Lecture 231 Creating a stepper component

Lecture 232 Setting up the stepper component

Lecture 233 Creating the checkout components

Lecture 234 Adding the checkout form

Lecture 235 Creating the address form

Lecture 236 Creating the delivery form

Lecture 237 Delivery method template

Lecture 238 Using the Http interceptor to send the token

Lecture 239 Making the basket summary shared

Lecture 240 Checkout review component

Lecture 241 Adding the forward back buttons for the stepper

Lecture 242 Using the form status to mark the step complete

Lecture 243 Populating the address form from API

Lecture 244 Letting the user save the address

Lecture 245 Updating the shipping price

Lecture 246 Creating the order interface

Lecture 247 Order submission

Lecture 248 Problem solution and redirect to success

Lecture 249 Summary of section 19

Section 20: Client – Order Module

Lecture 250 Introduction

Section 21: Taking Payments

Lecture 251 Introduction

Lecture 252 PCI DSS

Lecture 253 Strong Customer Authentication

Lecture 254 Setting up stripe

Lecture 255 Creating the payment service and interface

Lecture 256 Implementing the payment intent

Lecture 257 Creating the payment controller

Lecture 258 Updating the client basket

Lecture 259 Adding the payment intent function

Lecture 260 Persisting the shipping price

Lecture 261 Implementing stripe elements

Lecture 262 Adding stripe elements to the components

Lecture 263 Displaying card validation errors

Lecture 264 Using the app stepper as an input property

Lecture 265 Submitting the payment

Lecture 266 Testing card failures

Lecture 267 Tying the payment intent to the order

Lecture 268 Making the submission a better experience

Lecture 269 Loading indicators

Lecture 270 Enabling linear mode

Lecture 271 Stripe validation

Lecture 272 Webhooks

Lecture 273 Updating the payments service

Lecture 274 Testing our webhooks with the stripe CLI

Lecture 275 Summary of section 21

Section 22: Performance

Lecture 276 Introduction

Lecture 277 Setting up caching on the API

Lecture 278 Creating a cache attribute class

Lecture 279 Testing the caching

Lecture 280 Caching on the client part 1

Lecture 281 Caching on the client part 2

Lecture 282 Caching on the client part 3

Lecture 283 Pre-publishing adjustments

Lecture 284 Summary of section 22

Section 23: Publishing

Lecture 285 Introduction

Lecture 286 Angular build configuration

Lecture 287 Creating Angular production build

Lecture 288 Installing PostgreSQL

Lecture 289 Switching DB Servers

Lecture 290 Switching to the production database

Lecture 291 Pre deployment work

Lecture 292 Deploying app to Linux server part 1

Lecture 293 Deploying app to Linux part 2

Lecture 294 Getting an HTTPS certificate from Lets encrypt

Lecture 295 End of course summary

Section 24: Bonus – Updating project to .Net 5 and Angular 11

Lecture 296 Updating .Net project from .Net Core 3.1 to .Net 5.0

Lecture 297 Updating Angular project from Angular v9 to Angular v11

Section 25: Bonus – Updating project to .Net 6, Angular 12 and Bootstrap 5

Lecture 298 Updating .Net project from .Net 5 to .Net 6

Lecture 299 .Net 6 Project changes and new features

Lecture 300 Updating from Angular 11 to Angular 12

Lecture 301 Updating from Bootstrap 4 to Bootstrap 5

Section 26: Bonus – Updating project to .Net 7, Angular 15 and Bootstrap 5

Lecture 302 Updating the .Net projects to .Net 7

Lecture 303 Update to .Net 7 Minimal hosting model

Lecture 304 Update to Angular 15

Lecture 305 Update to Bootstrap 5

Lecture 306 Basket Service Improvements – section 14 onwards

Lecture 307 Basket component update – section 14-19

Lecture 308 Basket component update – section 19 onwards

Lecture 309 Product-Details component update

Lecture 310 Enabling strict mode in Angular (optional)

Section 27: Legacy – Publishing to a LAMP server using MySQL (.Net Core 3.1 only)

Lecture 311 Installing MySQL – Legacy

Lecture 312 Switching DB Servers – Legacy

Lecture 313 Switching to the production database – Legacy

Lecture 314 Pre deployment work – Legacy

Lecture 315 Setting up a linux server part 1 – Legacy

Lecture 316 Setting up a linux server part 2 – Legacy

Lecture 317 Getting an HTTPS certificate from Lets Encrypt – Legacy

Beginner and intermediate developers who want to enhance their knowledge of .Net and Angular who have some coding experience,Beginner and intermediate developers who wish to learn how to build an e-commerce style of site

Course Information:

Udemy | English | 34h 37m | 16.96 GB
Created by: Neil Cummings

You Can See More Courses in the Business >> Greetings from CourseDown.com

New Courses

Scroll to Top