Make an E-Commerce Website with Blazor WebAssembly in .NET 6

Make an E-Commerce Website with Blazor WebAssembly in .NET 6, available at $84.99, has an average rating of 4.58, with 198 lectures, based on 1733 reviews, and has 9466 subscribers.

You will learn about Build a full stack Blazor WebAssembly application by the example of an E-Commerce Website Create a Walking Skeleton with .NET, Blazor WebAssembly, a Web API, Entity Framework Core & SQL Server right at the beginning Implement Best Practices with Generics, Data-Transfer-Objects (DTOs) and the Repository Pattern Build several features of an E-Commerce App, like Search, Pagination, Featured Products, a Cart (local & database), Orders and many more Implement Authentication with JSON Web Tokens (JWT) Use Role-Based Authorization for Administrators & Customers Use Code-First Migration with Entity Framework Core & SQL Server Implement Payment with Stripe Checkout providing Credit Card, Apple Pay & Google Pay Create a Custom Layout for your Blazor WebAssembly Application Implement Administration Features with all CRUD operations to Create, Read, Update & Delete your Products This course is ideal for individuals who are C# and .NET developers who want to improve their skills and learn to build a full stack Blazor WebAssembly project or Beginner Blazor WebAssembly Developers who already have a little experience with Blazor and want to deepen their knowledge or Aspiring .NET developers who want to get the skills that might lead to more .NET & Blazor job opportunities It is particularly useful for C# and .NET developers who want to improve their skills and learn to build a full stack Blazor WebAssembly project or Beginner Blazor WebAssembly Developers who already have a little experience with Blazor and want to deepen their knowledge or Aspiring .NET developers who want to get the skills that might lead to more .NET & Blazor job opportunities.

Enroll now: Make an E-Commerce Website with Blazor WebAssembly in .NET 6

Summary

Title: Make an E-Commerce Website with Blazor WebAssembly in .NET 6

Price: $84.99

Average Rating: 4.58

Number of Lectures: 198

Number of Published Lectures: 198

Number of Curriculum Items: 198

Number of Published Curriculum Objects: 198

Original Price: $199.99

Quality Status: approved

Status: Live

What You Will Learn

Build a full stack Blazor WebAssembly application by the example of an E-Commerce Website

Create a Walking Skeleton with .NET, Blazor WebAssembly, a Web API, Entity Framework Core & SQL Server right at the beginning

Implement Best Practices with Generics, Data-Transfer-Objects (DTOs) and the Repository Pattern

Build several features of an E-Commerce App, like Search, Pagination, Featured Products, a Cart (local & database), Orders and many more

Implement Authentication with JSON Web Tokens (JWT)

Use Role-Based Authorization for Administrators & Customers

Use Code-First Migration with Entity Framework Core & SQL Server

Implement Payment with Stripe Checkout providing Credit Card, Apple Pay & Google Pay

Create a Custom Layout for your Blazor WebAssembly Application

Implement Administration Features with all CRUD operations to Create, Read, Update & Delete your Products

Who Should Attend

C# and .NET developers who want to improve their skills and learn to build a full stack Blazor WebAssembly project

Beginner Blazor WebAssembly Developers who already have a little experience with Blazor and want to deepen their knowledge

Aspiring .NET developers who want to get the skills that might lead to more .NET & Blazor job opportunities

Target Audiences

C# and .NET developers who want to improve their skills and learn to build a full stack Blazor WebAssembly project

Beginner Blazor WebAssembly Developers who already have a little experience with Blazor and want to deepen their knowledge

Aspiring .NET developers who want to get the skills that might lead to more .NET & Blazor job opportunities

Welcome to the Blazor WebAssembly E-Commerce Course!

In this online course, we’re going to build an e-commerce web application with .NET 6& Blazor WebAssembly.

We’ll cover the complete stack, meaning Blazor for the client, a Web API for the back end web service, and Entity Framework Core with SQL Server Express for the database.

The course starts with a walking skeleton. This means, right at the beginning of this course, and in just a few hours you learn how to build a running full-stack web application with all the mentioned frameworks and technologies.

So, after this section, you won’t use any mock data, for instance. You will already make calls to the web service, grab data from the SQL Server and return the results back to the Blazor WebAssembly client.

On top of that, we will introduce best practices to that walking skeleton. For instance, we don’t want to use fat controllers. Instead, we’ll use the repository pattern together with dependency injection.

After that, we build a huge part of the e-commerce application. This section is all about the products your users can buy in your shop, it’s about categories, product variants, a search bar, pagination, a basic cart, and so on.

With all these implementations you learn lots of features of Blazor WebAssembly, together with the Web API and also relationships between entitiesand how to manage them with Entity Framework Core and SQL Server.

After that, we dive into authentication with JSON web tokens.

You will learn how to register users, log them in and create JSON web tokens (JWT) to authenticate your users, set the token in the default HTTP request header, utilize the famous [Authorize] attribute to secure your Web API, and add a page for the users’ profile so that they can change their password, for instance.

The next section is all about the cart and orders. Until this point, you’ve already implemented a cart, but it only works offline. So now it’s time to store the products of the cart in the database and also implement the final order and an overview of the order history.

But one thing will still be missing, and that’s an option to checkout and pay for your order. We cover that with the next section and use Stripe to do that. This means, your users can pay with a credit card, Google Pay and Apple Pay. Additionally, we’ll continue with a smaller section where we implement the option to add a delivery address.

And after that, it’s time for the big administration dashboard. Everything you’ve learned so far comes together in this section.

We utilize lots of features of Blazor WebAssembly, we build several CRUD operations for our entities – meaning an administrator should be able to create, read, update and delete all products, categories, and product variants – and to know if the user is allowed to do all that, we introduce role-based authorization.

As you can see, there’s a lot to learn!

Here’s an overview of what you will learn in this course:

Introduction

– Install the .NET 6 Framework & Visual Studio 2022

– Get the source code from GitHub

Full Stack Foundations – Building a Walking Skeleton

– Create a Blazor WebAssembly ASP.NET Core Hosted Project

– Debug your project

– Learn about the new Hot Reload feature of .NET 6 & Visual Studio 2022

– Create Razor Components & utilize CSS Isolation

– Implement a Web API Controller & test it with SwaggerUI

– Install & use SQL Server Express and Entity Framework Core 6

– Utilize Code-First Migrations with EF Core 6 & Seed Data programmatically

– Create a Git repository and push your code to GitHub

Adding & Using Best Practices

– Implement a Service Response with Generics

– Use the Repository Pattern and Dependency Injection

– Create Services for the client and the service

It’s all about Products – Blazor WebAssembly in Action

– Add more models & entities to your web application like categories, variants, and more

– Use several features of EF Core 6 like composite primary keys, more migrations & relationships

– Utilize several built-in components of Blazor WebAssembly

– Realize a search feature & pagination

– Implement a custom layout

– Add a cart using the local storage to your application

Let’s add Users – Authentication with JSON Web Tokens

– Implement user registration & login

– Use data annotations & validation

– Introduce the user model

– Add token authentication with JSON Web Tokens (JWT)

– Implement a custom AuthenticationStateProvider

– Add a return URL to the login

– Utilize the [Authorize]attribute

Let’s buy some Products – Cart & Orders

– Store the cart of a user in the database

– Use the HttpContextAccessor to access the user in the services

– Store the orders in the database

– View an order history

– Utilize the authentication state of the user

Ka-Ching! – Payment with Stripe Checkout

– Introduce Stripe

– Use Stripe Checkout for payments

– Fulfill an Order with WebHooks

– Enable a shipping address in Stripe Checkout

Where are you from? – Add a Delivery Address

– Add an address model with a new migration

– Create a shared component for the cart and the user profile page

We need more stuff! – Admin Dashboard

– Introduce role-based authorization on the client & the server

– Extend your models

– Create several administration pages

– Implement CRUD operations (create, read, update, delete) for your entities

If you don’t know me yet from YouTube or my other courses on Udemy, my name is Patrick God, I’m going to be your instructor for this course. I’m a web developer for over a decade now, I have worked for big corporations and small teams, as an employee and a contractor and I just love to see the way Microsoft is going with .NET & Blazor and how important these technologies get day by day.

So far, I’ve created 10 courses on Udemy about .NET (Core), Blazor WebAssembly, single-page applications, Angular, and DevOps – with a total of more than 60.000 students and countless 5-Star reviews.

If you’re still not sure if this course is right for you, there’s a 30-day money-back guarantee. So, feel free to check it out and get your money back if it’s just not for you. No questions asked.

Apart from that, you can always ask questions in the Q&A sections that the community (including me) is happy to answer and you also get the complete source code, if there happens to be a problem with that.

Are you ready?

I’m looking forward to seeing you in the course!

Course Curriculum

Chapter 1: Introduction

Lecture 1: Course Overview

Lecture 2: Install .NET & Visual Studio

Lecture 3: GitHub Repository

Chapter 2: Full Stack Foundations – Building a Walking Skeleton

Lecture 1: Introduction

Lecture 2: Create the Blazor WebAssembly Project

Lecture 3: Solution Overview

Lecture 4: Debug the Project

Lecture 5: Trust the Dev Certificate

Lecture 6: Hot Reload with .NET 6 & Visual Studio 2022

Lecture 7: Add the Product Model

Lecture 8: Your First Component

Lecture 9: Images dont show up? Heres why.

Lecture 10: CSS Isolation

Lecture 11: Fixing Bootstrap from .NET 5 / Bootstrap 5 CSS Fix

Lecture 12: Your First Web API Controller

Lecture 13: Call the Web API from the Client

Lecture 14: Add SwaggerUI

Lecture 15: Install SQL Server

Lecture 16: Add the ConnectionString

Lecture 17: Install Entity Framework

Lecture 18: Install Packages for Entity Framework Core, Code-First Migration & SQL Server

Lecture 19: Add the DataContext

Lecture 20: Register the DbContext & Configure SqlServer

Lecture 21: Your First Migration with Entity Framework Core

Lecture 22: Seed Data

Lecture 23: Get Products from the Database

Lecture 24: Create the GitHub Repository

Lecture 25: Summary

Chapter 3: Adding & Using Best Practices

Lecture 1: Introduction

Lecture 2: Implement a Service Response with Generics

Lecture 3: Using Services with Dependency Injection

Lecture 4: Add the ProductService to the Client

Lecture 5: Use the ProductService in the ProductList Component

Lecture 6: Summary

Chapter 4: Its all about Products – Blazor WebAssembly in Action

Lecture 1: Introduction

Lecture 2: Show Product Details with Page Parameters

Lecture 3: Get a Single Product from the Server

Lecture 4: Get a Single Product on the Client

Lecture 5: Little CSS Fix

Lecture 6: Introducing Categories

Lecture 7: Add Category Seeding & Migration

Lecture 8: Seed More Products

Lecture 9: Get all Categories with a new Service & Controller

Lecture 10: Add a CategoryService on the Client

Lecture 11: Display Categories in the NavMenu

Lecture 12: Get Products by Category from the Server

Lecture 13: Get Products by Category on the Client

Lecture 14: Introducing Product Variants

Lecture 15: Add a Composite Primary Key & More Seeding

Lecture 16: Add Product Variants Migration

Lecture 17: Include Product Variants & Types in the Product Service

Lecture 18: Display the Price in the ProductList Component

Lecture 19: Display the Price in the ProductDetails Component

Lecture 20: Use a Select Box for the Product Variant

Lecture 21: Introducing a Product Search Feature

Lecture 22: Search a Product on the Server

Lecture 23: Get Product Search Suggestions

Lecture 24: Add Search Methods to the Client

Lecture 25: Implement a Search via URL in the Index.razor Component

Lecture 26: Implement the Search Component

Lecture 27: Use a Custom Layout

Lecture 28: Add a Home Button

Lecture 29: Introducing Featured Products

Lecture 30: Load Featured Products

Lecture 31: Show Featured Products with a new Component

Lecture 32: Introducing Pagination & Data-Transfer-Objects (DTOs)

Lecture 33: Implement Product Search Pagination on the Server

Lecture 34: Add Pagination to the ProductService on the Client

Lecture 35: Add Pagination to the Components

Lecture 36: Introducing the Cart with the Local Storage

Lecture 37: Create a Cart Counter

Lecture 38: Add a CartItem Class

Lecture 39: Implement a CartService on the Client

Lecture 40: Implement “Add to Cart” Button in ProductDetails Component

Lecture 41: Show the Number of Items in the Cart Counter

Lecture 42: Turn Cart Items into Products on the Server

Lecture 43: Get the Cart Products on the Client

Lecture 44: Implement the Cart Page

Lecture 45: Remove an Item from the Cart

Lecture 46: Add the Quantity to Cart Models

Lecture 47: Modify the Cart Services

Lecture 48: Add Option to Update the Quantity

Lecture 49: Update the Quantity with an Input Number Field

Lecture 50: Summary

Chapter 5: Lets add Users – Authentication with JSON Web Tokens

Lecture 1: Introduction

Lecture 2: Add the UserRegister Model

Lecture 3: Create the User Registration Page (EditForm without Validation)

Lecture 4: Implement a User Menu Button

Lecture 5: Add Data Annotations for Validations

Lecture 6: Add Validation to the Registration Form

Lecture 7: Use a Validation Message instead of the Validation Summary

Lecture 8: Add a User Model for the Database

Lecture 9: Add an Authentication Service on the Server

Lecture 10: Check if a User already exists

Lecture 11: Implement the User Registration on the Server

Instructors

Patrick God
Passionate Software Developer & Teacher

Rating Distribution

1 stars: 18 votes

2 stars: 25 votes

3 stars: 95 votes

4 stars: 516 votes

5 stars: 1079 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!