Updated Cookies Notice - you'll see this message only once.

We use cookies and similar technology on this website, which helps us to know a little bit about you and how you use our website. This improves the browsing experience for you and enables us to tailor better products and services to you and others. Cookies are stored locally on your computer or mobile device.
To accept cookies continue browsing as normal or go to the Cookies Notice for more information and to set your preferences.

You have to add this courses into your profile.

Learn By Building Real World Projects

React - The Complete Guide (incl Hooks, React Router, Redux)

With React 16 tutorial, you can build basic to advanced complex UIs. You can also learn popular libraries like react-router and redux, and much more.

  • |
  •   Lectures: 365
  • |
  •   Videos: 31.5 hours
  • |
  •   Level: All
  • |
  •   Language: English
  • |
  •   Last Updated: 11/2017

  • Instructor : Eduonix Learning Solutions

Check Out Some of Our Other Popular Courses

This course is fully up-to-date with the latest version of React (16.8) and includes the newly introduced React Hooks feature!


What's this course about?

Learn React or dive deeper into it. Learn the theory, solve assignments, practice in demo projects and build one big application which is improved throughout the course: The Burger Builder!

More details please!

JavaScript is the major driver of modern web applications since it's the only programming language which runs in the browser and hence allows you to provide highly reactive apps. You'll be able to achieve mobile-app like user experiences in the web.

But using JavaScript can be challenging - it quickly becomes overwhelming to create a nice web app with vanilla JavaScript and jQuery only.

React to the rescue! 

React is all about components - basically custom HTML elements - with which you can quickly build amazing and powerful web apps. Just build a component once, configure it to your needs, dynamically pass data into it (or listen to your own events!) and re-use it as often as needed.

Need to display a list of users in your app? It's as simple as creating a "User" component and outputting it as often as needed.

This course will start at the very basics and explain what exactly React is and how you may use it (and for which kind of apps). Thereafter, we'll go all the way from basic to advanced. We'll not just scratch the surface but dive deeply into React as well as popular libraries like react-router and Redux. 

By the end of the course, you can build amazing React (single page) applications!

A detailed list with the course content can be found below.

67 Module Introduction
68 A Better Project Structure
69 Splitting an App Into Components
70 Comparing Stateless and Stateful Components
71 Class-based vs Functional Components
72 Class Component Lifecycle Overview
73 Component Creation Lifecycle in Action
74 Component Update Lifecycle (for props Changes)
75 Component Update Lifecycle (for state Changes)
76 Using useEffect() in Functional Components
77 Controlling the useEffect() Behavior
78 Cleaning up with Lifecycle Hooks & useEffect()
79 Cleanup Work with useEffect() - Ex
80 Using shouldComponentUpdate for Optimization
81 Optimizing Functional Components with React.memo()
82 When should you optimize?
83 PureComponents instead of shouldComponentUpdate
84 How React Updates the DOM
85 Rendering Adjacent JSX Elements
86 Using React.Fragment
87 Higher Order Components (HOC) - Introduction
88 Another Form of HOCs
89 Passing Unknown Props
90 Setting State Correctly
91 Using PropTypes
92 Using Refs
93 Refs with React Hooks
94 Understanding Prop Chain Problems
95 Using the Context API
96 contextType & useContext()
97 Wrap Up
98 [LEGACY] Splitting an App Into Components
99 [LEGACY] Comparing Stateless and Stateful Components
100 [LEGACY] Understanding the Component Lifecycle
101 [LEGACY] Converting Stateless to Stateful Components
102 LEGACY] Component Creation Lifecycle in Action
103 [LEGACY] Component Updating Lifecycle Hooks
104 [LEGACY] Component Updating Lifecycle in Action
105 [LEGACY] Updating Lifecycle Hooks (Triggered by State Changes)
106 [LEGACY] Performance Gains with PureComponents
107 [LEGACY] How React Updates the App & Component Tree
108 [LEGACY] Understanding React's DOM Updating Strategy
109 [LEGACY] Returning Adjacent Elements (React 16+)
110 [LEGACY] Understanding Higher Order Components (HOCs)
111 [LEGACY] A Different Approach to HOCs
112 [LEGACY] Passing Unknown Props
113 [LEGACY] Using setState Correctly
114 [LEGACY] Validating Props
115 [LEGACY] Using References ("ref")
116 [LEGACY] More on the React ref API (16.3)
117 [LEGACY] The Context API (React 16.3)
118 [LEGACY] More on the Context API (16.6)
119 [LEGACY] Updated Lifecycle Hooks (React 16.3)
120 [LEGACY] The "memo" Method (16.4)
121 [LEGACY] Wrap Up