Complete guide to building an app with .Net Core and React

Udemy

Gain hands-on experience with the application development process by utilizing the functionalities of ASP.NET, Mobs, React, and others.

Online

₹ 3499

particular

details

                                    Medium of instructions
                                    English

                                    Mode of learning
                                    Self study

                                    Mode of Delivery
                                    Video and Text Based

Introduction

Course introduction
Setting up the developer environment
VS Code extensions
Source code and Resources used on this course

Walking Skeleton Part 1 - API

Introduction
Creating the .Net projects and references
Changes to the .Net 6 hosting model
Reviewing the project files and startup
The API controller and using postman
Creating a domain entity
Adding an Entity Framework Db Context
Creating an Entity Framework code first migration
Creating the database
Seeding data to the Database
Adding an API controller
Saving changes into source control
Summary of Section 2

Walking Skeleton Part 2 - Client

Introduction
Creating the React project
Reviewing the React project files
Why React?
React Components
Typescript concepts
Typescript demo
Using Typescript with React
React dev tools
Fetching data from the API
CORS Policy
Semantic UI React
Summary of section 3

Creating a CRUD application using the CQRS + Mediator pattern

Introduction
Clean Architecture
CQRS
Creating our first Query handler
Thin controllers in the API
Adding a Details handler
Adding a Create handler
Adding an Edit handler
Adding AutoMapper
06:21
Adding a Delete handler
Startup class housekeeping
Cancellation tokens
Using the debugger in VS Code
Summary of section 4

Creating a CRUD application in React

Introduction
Folder structure in React
Adding an Activity interface
Adding a Nav bar
Adding some style to the nav bar
Creating an activity dashboard
Creating an activity list
Creating a details view
Creating an Activity form
Selecting an activity to view
Displaying the create/edit form
Editing an activity and form basics in React
Handle create and edit submission
Using a GUID for the activity id
Deleting an activity
Summary of section 5

Axios

Introduction
Setting up axios
Axios types
Adding loading indicators
Posting data to the server
Deleting activity on the server
Summary of section 6

MobX

Introduction
What is MobX?
Setting up MobX
MobX actions
Refactoring the app to use MobX
MobX strict mode
Selecting an Activity using MobX
Creating an Activity using MobX
Deleting an activity using MobX
Using a Javascript map object to store the activities
Summary of section 7

Routing

Introduction
Installing React Router
Adding routes
Adding nav links
Adding a details link
Getting an individual activity
Using route parameters
Adding the edit activity route
Adding a key to the route
Redirect after submission
Moving the home page outside of nav
Cleaning up unused code
Summary of section 8

Styling the User Interface

Introduction
Styling the activity list
Grouping the activities by date
Styling the list items
Activity details page
Populating the detailed components
Adding the activity filter component
Styling the home page
Summary of section 9

Error handling

Introduction
Validation with data annotations
Fluent Validation
Handling API Error responses
Handling API Error responses part 2
Handling API Error responses part 3
Handling API Error responses part 4
Handling exceptions
Preparing for setting up error handling in the client app
Using an interceptor to handle API error responses
Adding a not found component
Handling 400 errors
Handling 500 errors on the client
Handling the validation error from an invalid GUID
Summary of section 10

Forms

Introduction
Setting up Formik
Formik with less code
Validation in Formik
Creating a reusable text input
Creating a reusable text area
Creating a reusable select input
Creating a reusable date input
The date strategy
Using Date-FNS
Hooking up the form submission to Formik
Summary of section 11

Identity

Introduction
Adding a user entity
Adding an IdentityDbContext
Configuring Identity in the Startup class
Adding seed users
Creating the user DTOs
Adding an account controller
JSON Web Tokens
Creating a token service
Authenticating to the app
Storing secrets in development
Creating an auth policy
Registering new users
Validating the registration of users
Getting the current user
Summary of section 12

Client side login and registration

Introduction
Creating a login form
Creating the interfaces and methods
Creating a user store
Displaying errors in the form
Setting the token upon login
Updating the home page and nav bar
Persisting the login
Sending up the token with the request
Adding Modals
Adding the register form
Handling validation errors in the register form
Summary of section 13

Entity Framework Relationships

Introduction
Configuring the new relationship
Adding an infrastructure project
Updating the create activity handler
Testing the create activity
Loading related data
Shaping the related data
Configuring AutoMapper profiles
Adding the attendance handler
Adding a custom auth policy
Resolving the bug with with the edit handler
Updating the seed data
Summary of section 14

Feature - Client side attendance

Introduction
Adding the attendees component
Updating the details component
Conditionally rendering the buttons
Adding the store methods to attend
Updating the create and edit methods
Adding a cancel activity method
Adding a popover for attendees
Summary of section 15

Client image upload

Introduction
Creating a profile page
Adding a profile header
Adding the profile content
Getting the profile data
Getting the profile data part 2
Displaying the photos
Conditionally rendering the photo widget
Creating a photo upload widget
Adding a Dropzone
Styling the Dropzone
Adding a react cropper
Adding the photo upload method
Setting the main photo
Deleting photos
Summary of section 17

Challenge

Challenge introduction

SignalR

Introduction
Setting up the comment entity
Adding a comment DTO and mapping
Adding the create handler
Adding a list handler
Adding a SignalR Hub
Authenticating to SignalR
Adding SignalR to the client
Connecting to the hub
Sending comments
Adding validation and fix issues
Resolving UTC dates
Summary of section 19

Followers / Following feature

Introduction
Adding a join entity
Adding a handler for following
Adding the controller
Update the profile class
Return a list of followers
Adding the following property to the mapping configuration
Updating the other handlers with the following property
Adding the UI for followers
Adding methods to follow and unfollow
Making the follow button a component
Getting a list of followings
Using MobX Reactions
Summary of section 20

Paging, Sorting and Filtering

Introduction
Adding a PagedList class
Adding application layer pagination logic
Adding a pagination header
Adding client side pagination
Adding pagination parameters
Adding vertical paging
Adding infinite scrolling
Adding filtering in the API
Client side filtering
Updating the filter component
Adding placeholders
Adding a user profile activities component + challenge
Challenge solution
Summary of section 21

Finishing touches and publishing

Introduction
Adding Scroll to top for our routes
Adding private routes
Prepping the client app for production
Building the production build of the react app
Running the client app on the dotnet Kestrel server
Adding PostGresQL
Switching to PostGresQL
Setting up Heroku
Deploying the app to Heroku
Security tightening
Content security policies
End of course summary

Bonus section - Identity Cookbook

Introduction
Setting up Facebook login
Connecting Heroku to GitHub
Adding the Facebook JS SDK
Configuring the API endpoint
Debugging the Facebook info
Facebook login finishing touches
Redeploying the app to Heroku
Introduction to Refresh Tokens
Adding the Refresh token domain entity
Updating the JWT token parameters
Updating the account controller
Testing in Postman
Client side configuration
Testing the refresh token in the client
Redeploying the app to Heroku
Introduction to Email verification
Setting up SendGrid
Require a confirmed email to sign in
Updating the register method
Adding the confirm email endpoint
Testing in Postman
Setting up the client for email confirmation
Adding a verify email component
Finishing up and testing
Redeploying the app to Heroku

Updating to .Net 6

Updating the project to use .Net 6
.Net 6 new features and how to update the project to use them
Updating the client packages

Legacy content

Where to find the legacy content

Popular Courses

Popular Platforms

Popular Searches

Complete guide to building an app with .Net Core and React

Online

₹ 3499

Quick Facts

Course overview

The highlights

Program offerings

Course and certificate fees

Fees information

certificate availability

certificate providing authority

Who it is for

What you will learn

The syllabus