Getting Started with React using Hooks and REST API
4.7 (95 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5,266 students enrolled

Getting Started with React using Hooks and REST API

Learn how to use React, Function and Class Components, Props, State Hook, Callback Hook, Effect Hook, Fetch and Promises
4.7 (95 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
5,266 students enrolled
Created by Eric Greene
Last updated 1/2020
English
English [Auto-generated]
Current price: $20.99 Original price: $29.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 5.5 hours on-demand video
  • 2 articles
  • 3 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • How to program React web applications line-by-line. We will code every line together so you KNOW how it works.
  • Learn the details of JSX, what it is, and what it is not
  • Focus on Building React Skills (no distractions, no silly games, no shiny stuff), just relevant, useful and critical React skills
  • How to setup a new React project and what development tools are used to code a React application
  • How to code React components with a focus on best practices
  • Use hooks including the state, callback, effect and ref hooks
  • Learn about the thinking patterns developers go through when building a React application
  • Learn how to incorporate a REST service into a React Application (without Redux Thunk/Saga)
  • No throwing up of pre-coded examples which only confuse students, we build everything together.
  • This course is designed for you to finish and improve your React coding today!
Course content
Expand all 21 lectures 05:36:29
+ Getting Started
3 lectures 01:10:33

This video presents and overview of the Getting Started with React course.

Preview 03:02

This video explores the tools which will be used to do React development in the Getting Started with React course.

Preview 20:46

In this video you will create your first component, learn about JSX, and explored ES2015 modules.

Preview 46:45

Take this short quiz to assess your progress with the course!

Getting Started Review
4 questions
+ Building Components
4 lectures 02:12:44

In this video, component props will be explained and demonstrated. An important part of this video is an explanation and warning about the proper and improper use props.

Component Props
38:43

This video will present managing component state using hooks.

Component State with Hooks
28:21

This video will explore how to take a large component and break it down into smaller parts following best practices and React's rules for props. Both data and functions will be passed as props from a parent component to a child. Also, the overall application state will be managed in the top-level component.

Decomposing Components
25:46

This video will explore how to create a table with an editable row. The creation and use of a custom hook will be explored as well as how to add conditional logic to a JSX expression tree. Additional discussion of defining state is conducted as well.

Editable Table
39:54

Take this short quiz to assess your progress with the course!

Building Components Review
7 questions
+ Going Deeper with Components
4 lectures 01:01:09

This video will explore two common enhancements to improve performance and usability using the Callback hook and Ref hook, respectively.

Improving Performance and Usability
21:30

This video will explore how to create a class-based component. While class-based components are now taking a back seat to functional components with hooks, there is still a lot of React code written with class-based components so this video shows how to convert a functional hooks-based component to a class-based component.

Class-based Components
11:28

This video will demonstrate how to incorporate REST services into the application. It will include the use of the Effect hook.

Integrating REST Services
27:49

Take this short quiz to assess your progress with the course!

Going Deeper with Components Review
4 questions

Here are the final code files for the project created in this course.

Final Code Files
00:22
+ Exploring React Lifecycle Methods
9 lectures 43:22

After reviewing and running this code, the student will have a deeper understanding of working with React class-based component lifecycle methods and their hooks-based equivalent used in functional components.

In-Depth Demo of Class-based Components and Functional Components using Hooks
00:14

Demonstrate how to extract the Lifecycle-Methods.zip, install the packages for the project and how to run it.

Setup Demonstration Project
01:42

Explore the tools which will be used to explore the demonstrations including discussion about Google Chrome's developer tools.

Using Google Performance Tools
03:13

Explore the class-based component render method and the functional component method.

Component Rendering
06:57

Explore the mounting and unmounting of class-based components. For functional components with hooks, the use of Effect Hook as it relates to mounting and unmounting is explored.

Component Mounting and Unmounting
06:49

Explore the state in class-based and functional components. For functional components, the state hook is explored.

Component State
04:31

Explores handling the updating of components. A deep look at the updating of state and the painting of the web browser is explored.

Component Updating
10:14

Explore setting up error boundaries with class-based components.

Component Error Handling
02:35

Explores pure class-based components and the memo function for functional components.

Component Optimization
07:07
+ Bonus Material
1 lecture 28:40

Many React developers are hesitant to embrace hooks. They know how to use classes and stick with them. Nevertheless, React Hooks are awesome and should be used! Check out this video for an apples-to-apples comparison on managing state with classes, hooks and even a custom hook.

Comparison between Class-based State, the State Hook, and a Custom Hook
28:40
Requirements
  • Strong Desire to Learn and Master React
  • Knowledge of basic JavaScript and basic web development is a plus!
Description

NEW! I have added a new project and videos which will explore React class-based component lifecycle methods and their functional components using hooks equivalent. The project and its heavily commented source code are available for download now!

Remember when you enroll in the course, you get access to all of the content forever including new content which is added as time goes along...

CHECKOUT the "Hello World" Video for Free! I put 45 mins of React teaching up here for free (Free Preview) so you can see if my teaching style and content is right for you!

IMPORTANT: There are many courses for you to choose from when learning about React. Most of those courses do not focus on React, they are unfocused bootcamp style courses where a thousand topics are covered and the "biggest projects ever" are undertaken. This course, Getting Started with React, is not like that by design. Most React developers need training on the core aspects of React not endless related library APIs and so-called big projects. In-person, I teach experienced React developers almost everyday and most of them lack the fundamental skills needed to build React applications correctly. This course walks through, step-by-step, how to build React components the right way by focusing on React (not a 1000 other topics) and exploring/explaining best practices. Beware of 40 hour courses which most students never finish and contain topics you will never need. Instead focus on this shorter, more focused course which you can finish in a day and employ your new skills in your work tomorrow (or even tonight)!

In this course, Getting Started with React, professional React Trainer, Eric Greene, will walk you through the essentials of building React web applications. This content is the same content (plus some extras) that he covers in his Introduction to React courses which he delivers around the world to companies from the Fortune 100 to Silicon Valley tech startups. The course is delivered as 100% live coding with occasional diagrams. No boring content slides, just real coding all the way through. The focus of the course is on the core knowledge and techniques of React so that the students gain mastery of the topic without being distracted by unrelated or secondary side topics.

Throughout the course Eric highlights particularly challenging areas where his students over the years have gotten stuck when learning Redux. He then explains and demonstrates what is really happening to help the student overcome those difficulties. The emphasis in the course is best practices and patterns with a goal of learning important conceptual ideas. This is not a course about the React API, its a course about using the React API properly to build great web applications!

As part of the course presentation, Eric will share with you the correct and incorrect thought processes which many developers go through to build React components. The goal is not mastery of the React API, but mastery of correctly using the React API. Building component trees which follow best practices and patterns is at the heart of great React programming. Eric's goal is to help you avoid common pitfalls and incorrect coding approaches which feel easy in the moment, but end up leading to lots of problems down the road. Eric will explain the proper use of props and component state and the importance of mastering the communication of data between components in the component tree. As part of that discussion important topics such as prop types, default props, custom hooks (for reusable state management), etc... are covered in great detail.

As Eric says in his classes, "learning React is only hard because it's new to the student not because it's actually hard". Learn React the right way, and take the mystery and hardness out of coding React applications today.

Who this course is for:
  • Programmers who are new to React
  • Programmers who have used React for 9 months or less
  • Programmers who want to learn about React Hooks
  • Programmers who want to learn more about using JavaScript to code React Components
  • Programmers looking to advance in their React Programming careers
  • Programmers who want to deepen their JavaScript skills