Full Stack React Bootcamp with .NET API [2023] [10 Projects]
- Descripción
- Currículum
- Reseñas
This course will be hands on course which will give you practical exposure to React with over 25 assignments and 10 projects. We will start with all the basic fundamentals along with advance concepts and related topic to make you proficient as a React.js developer.
We will be building backend in .NET API and consume all of that using React.js. You are not required to build the API. That section is skippable, since I will be hosting the API online which can be used for the course. But I do teach and deploy API in the course.
My Goal with this course is simple – being a .NET developer as technology evolves we have to adapt with front end frameworks. I want one course that will focus on making a backend developer give solid experience in React.js in a manner that is easy to understand and provides extensive depth to master the fundamentals and advance concepts in React.js
This will be hands on bootcamp which will take you from zero to hero in React JS!
This course contains two modules
-
Beginner’s Guide to React (Build 8 projects)
-
Real world project using React and .NET API
In the first module we will build 8 small projects to understand basic fundamentals of React, Redux Toolkit and Hooks. Once we understand all the foundation, we will be building a complete real world restaurant website, where customers can place order using their credit card, track the status and admin can view/manage orders.
This will be the only course you will need to learn and master React JS and we will be integrating .NET API’s.
We will be building 10 projects in this course. Along with a completed Restaurant website with payment integration!
-
14
Setup basic HTML and add React CDN -
15
First React Code
-
16
Assignment 1 - Writing first React Code
-
17
Creating Element and rendering in React
-
18
What is JSX?
-
19
Better way to create React Projects
-
20
Create Project
-
21
Run the Project
-
22
CleanUp Project
-
23
Make project functional again
-
24
First React Component
-
25
Assignment 2 - React Component
-
26
Assignment 3 - Parent Child Component
-
27
Assignment 3 Solution - Parent Child Component
-
28
Rules of JSX
-
29
Work with styles
-
30
Adding Bootstrap Classes
-
31
Work with Classes Part 1
-
32
Variable in JSX
-
33
Assignment 3 - Adding Const
-
34
Assignment 3 Solution - Adding Const
-
35
HTML Element in JSX
-
36
Student Component
-
37
Export and Import Component
-
38
Assignment 4 - Separating Student Component
-
39
Assignment 4 Solution - Separating Student Component
-
40
Props and Components
-
41
Install third party libraries and Images
-
42
Import Image and Header Design
-
43
Footer and Main Body Component
-
44
Assignment 5 - Fix Error and Designing
-
45
Passing Components as Children
-
46
Final Hierarchy
-
47
Arrow Function
-
48
functional vs class components
-
49
Class Components
-
50
Assignment 6 - Convert MainBody to Class Component
-
51
Create CountOPedia
-
52
Assignment 7 Solution - Setup CountOPedia
-
53
Counter Application Buttons
-
54
Click Events
-
55
Setting and Retrieving State
-
56
Demo - React State
-
57
State Summary
-
58
New SetState Syntax
-
59
CountoPedia UI
-
60
Random play and Reset Button
-
61
Assignment 8 - Game Status and Last Play
-
62
Assignment 8 Solution - Game Status and Last Play
-
63
Create Project - ContactOPedia
-
64
Add Components
-
65
Skeleton of Components
-
66
Add Contact UI
-
67
Favorite and General Contact State
-
68
Individual Contact UI
-
69
Look and Feel ContactOPedia
-
70
Add Contact Handler
-
71
Add Contact in Action
-
72
Add Validations
-
73
Display Validation and Success Notification
-
74
Toggle Favorites
-
75
Assignment 10 - Delete Contact
-
76
Assignment 10 Solution - Delete Contact
-
77
Add Random User to Contact List
-
78
Axios Call
-
79
Demo - Adding Random Contact
-
80
Assignment 11 - Remove All Contact
-
81
Assignment 11 Solution - Remove all Contact
-
82
Which Contact has to be updated
-
83
Toggle UI Based on Update
-
84
Cancel Button in Action
-
85
Update Contact- Part 1
-
86
Update Contact - Part 2
