Learn to build an e-commerce store with .Net, React & Redux
- Descripción
- Currículum
- Reseñas
***The course has been refreshed in February 2023 to use .Net 7, React 18 and React Router 6***
Do you want to learn how to build a real world application using .Net, React and Redux? In this course we start from nothing and build a proof of concept E-Commerce store using these frameworks/libraries.
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 environment
-
Creating a .Net WebAPI application using the dotnet CLI
-
Creating a client side front-end React single page application for the stores user interface
-
Using Entity Framework to write code that queries and updates the database
-
Using ASP.NET Identity for login and registration
-
Using React Router to navigate between routes on the client
-
Using Automapper.
-
Building a great looking UI using Material Design
-
Making reusable form components using React hook form
-
Paging, Sorting, Searching and Filtering
-
Creating orders from the shopping basket
-
Accepting payments via Stripe using the new EU standards for 3D secure
-
Publishing the application to Heroku
-
Many more things as well
Tools you need for this course
In 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: This course is aimed at beginners but there is an expectation you have written some code before – it is not suitable for those who have never coded before.
On this course we will build an example E-commerce store, completely from scratch using the DotNet CLI tool and the Create-React-App tool 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 .Net and React.




![Machine Learning A-Z™: AI, Python & R + ChatGPT Bonus [2023]](https://digitales360.com/wp-content/uploads/2023/04/950390_270f_3-150x150.jpg)

-
5Section 2 IntroductionVideo lesson
-
6Creating the .Net solution and API projectVideo lesson
-
7Adding VS Code extensionsVideo lesson
-
8What’s in the Web API templateVideo lesson
-
9Creating a new C# class for the ProductVideo lesson
-
10What is Entity FrameworkVideo lesson
-
11Adding the DbContext classVideo lesson
-
12Creating an Entity Framework MigrationVideo lesson
-
13Creating a class to seed data into the databaseVideo lesson
-
14Using the Program.cs class to migrate and seed the data on app startupVideo lesson
-
15Creating an API controller to return a list of productsVideo lesson
-
16Using async methods when querying a database.Video lesson
-
17Saving our code into source controlVideo lesson
-
18Summary of section 2Video lesson
-
19Section 3 IntroductionVideo lesson
-
20Creating the react applicationVideo lesson
-
21What's in the React templateVideo lesson
-
22React component basicsVideo lesson
-
23Using react hooks - useStateVideo lesson
-
24Using react hooks - useEffectVideo lesson
-
25Adding CORS configuration to the APIVideo lesson
-
26Typescript vs javascript in ReactVideo lesson
-
27Adding a Typescript interface for the productVideo lesson
-
28File and folder organisationVideo lesson
-
29Adding React componentsVideo lesson
-
30Adding the Material UI styling frameworkVideo lesson
-
31Adding components for the ProductList and CardVideo lesson
-
32Installing and using React dev toolsVideo lesson
-
33Adding an AppBarVideo lesson
-
34Adding cards for our individual productsVideo lesson
-
35Styling the product cardVideo lesson
-
36Using Material UI ThemeVideo lesson
-
37Challenge solution and setting bg colorVideo lesson
-
38Section 3 SummaryVideo lesson
-
39Section 4 IntroductionVideo lesson
-
40Setting up React RouterVideo lesson
-
41Adding Nav Links to the AppBarVideo lesson
-
42Stying the nav barVideo lesson
-
43Fetching a product on component loadVideo lesson
-
44Adding the product detail page contentVideo lesson
-
45Summary of section 4Video lesson
-
46Section 5 IntroductionVideo lesson
-
47Setting up an error controllerVideo lesson
-
48Adding exception handling middlewareVideo lesson
-
49Centralising the axios requestsVideo lesson
-
50Creating a react component to test the error responsesVideo lesson
-
51Using Axios interceptorsVideo lesson
-
52Adding toast notificationsVideo lesson
-
53Handling validation errorsVideo lesson
-
54Creating a server error componentVideo lesson
-
55Creating a not found componentVideo lesson
-
56Adding a delay and loading indicators to the appVideo lesson
-
57Using the dotnet debugging toolVideo lesson
-
58Using the react debuggerVideo lesson
-
59Section 5 summaryVideo lesson
-
60Section 6 introductionVideo lesson
-
61Creating the basket entityVideo lesson
-
62EF RelationshipsVideo lesson
-
63Create a basket controllerVideo lesson
-
64Add basket item endpoint logicVideo lesson
-
65Using the debugger to check the add item logicVideo lesson
-
66Shaping the data to returnVideo lesson
-
67Removing an item from the basketVideo lesson
-
68Using CreatedAtRouteVideo lesson
-
69Adding the axios methods for the basketVideo lesson
-
70Creating a basket componentVideo lesson
-
71Styling the basket page with a tableVideo lesson
-
72Using React context to centralise stateVideo lesson
-
73App initialisation - fetching the basket on app startVideo lesson
-
74Updating the header with the basket item countVideo lesson
-
75Adding the remove item functionalityVideo lesson
-
76Adding specific loading indicators for the buttonsVideo lesson
-
77Challenge - Basket SummaryVideo lesson
-
78Challenge - SolutionVideo lesson
-
79Updating the product detail component to add items to cart part 1Video lesson
-
80Updating the product detail component to add items to cart part 2Video lesson
-
81Adding a checkout pageVideo lesson
-
82Section 6 SummaryVideo lesson
