React for visual learners
4.3 (66 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
669 students enrolled
Wishlisted Wishlist

Please confirm that you want to add React for visual learners to your Wishlist.

Add to Wishlist

React for visual learners

Learn React and Redux from the ground up with a mixture of code and whiteboard-style drawings on the core concepts.
4.3 (66 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
669 students enrolled
Created by Hendrik Swanepoel
Last updated 7/2016
Current price: $10 Original price: $20 Discount: 50% off
5 hours left at this price!
30-Day Money-Back Guarantee
  • 3.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Build react apps for the web
  • Manage state with redux
  • Call the server (AJAX) through redux actions
  • Use material-ui to style react apps
  • Get a job as a react front-end developer
  • Use ES2015 and ES2016
View Curriculum
  • A basic understanding of JavaScript
  • Should have git, nodejs, and npm installed

Learn the core concepts that you will need in order to work on a real-world project in React and Redux. 

Build a working app using React and Redux in less than 4 hours guided by white-board diagrams when the going gets tough. 

  • JavaScript 2015/2016
  • React fundamentals
  • React components and properties
  • Unidirectional data flow with Redux
  • State mutation instead of overwriting
  • Retrieve and store data using AJAX 
  • Beautiful components using Material-UI
  • Component design patterns
  • React-Redux container components

Be in demand with this hot skill 

React skills are in high demand. With this course you will learn everything you need to know in order to start working on a React project, including the internals of how React updates and why it's so performant. You will be able to hold your own in conversations about the benefits of React, and why certain things work the way they do. 

Not only will this help you in your current job, or help you secure a job as a React developer, it will also expose you to the concepts that are ubiquitous in front-end development, concepts that translates well to other frameworks like Angular. 

Content and Overview

This course is totally suitable to beginners with some JavaScript experience. We skip over all the boring environmental stuff, because you can get all that from boilerplate projects on the web, including the git repository for this course. 

The way you'll get going is by cloning a git repository and running a few commands on the command line. You have safe checkpoints in this git repository which you can work from for each lesson, meaning even if you veer off in a direction, you can follow along with the exact same code again with an easy git command. 

Because you won't mess around too much to get an environment going, you'll be able to get to the nitty gritty of React within minutes. In fact, you'll have your first React component rendered in the browser within a matter of minutes! 

You'll build an app similar to hackernews, where you can add links and people can vote on it. The starter git repository gives you a backend environment, so that you can practice network access using React and Redux against a real world HTTP server. 

You will first be introduced to React, and build some simple components. We'll then go over some component design pointers, and how the data flows from one component to the next. 

You will be coding features all the time, and along the way you will move the code base over from pure React to using Redux for data-flow. 

In the end you'll know what a container component is, you will know why you need to mutate state, you will write action creators, reducers, and a bunch of components! 

Oh, and you'll make your app look appealing quite early on in the project by pulling in a wonderful React component library called Material-UI. 

What you'll get in this course

  • 3.5 jam-packed hours of video content especially crafted to minimise the time you need to spend in order to master the core concepts 
  • A git repository that helps you get your environment set up in no time
  • Safe checkpoint branches in the repository that you can check out to follow along with exactly the same code for each lesson
  • Loads of white-board drawings that will make you master even the most challenging concepts of React and Redux 

Who is the target audience?
  • This course is meant for people who learn in a visual manner, who would like to quickly grasp the core concepts of React and Redux in under 4 hours. This course is probably not for you if you want to see every single feature of React and Redux being used and explained. It's also not for you if you if you've never written a line of code.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
26 Lectures
Component design patterns
5 Lectures 54:59
Container and Presentation components

Component state


Styling your components

Handling user events to add behavior
Use Redux to manage state and data flow
5 Lectures 53:19

Your first Redux code

Your first react-redux container component - conceptual

React-redux container component in code

Loading data from the server
Fleshing out the app with Redux
9 Lectures 01:15:19
Switch topics through the Redux loop

The NavigationContainer component

The LinkListContainer component

Adding an authentication Dialog

A simple form

Adding links part 1

Adding links part 2

Adding voting behavior on links

Displaying the login prompt on demand
1 Lecture 00:30
Thank you
About the Instructor
Hendrik Swanepoel
4.3 Average rating
66 Reviews
669 Students
1 Course
Old bearded programmer

In his day job Hendrik is a software architect in Cape Town, South Africa. For a large part of his career he worked with .NET, but the last few years he spent most of his time with JavaScript.

Hendrik has been an architect or technical lead on various projects over the last 15 years and has loads of experience in teaching difficult concepts to fellow developers.