React Clarified: “Thinking in React”

Name: React Clarified: “Thinking in React”
Rating: 4.5 (365 reviews)

Improve your understanding of React

Created byTom Bowden (AutoScreencast)

Last updated 8/2020

English

What you'll learn

React JS
Front-end Web Development
Mobile App Development with React Native
Desktop App Development using React & Electron

Course content

2 sections • 7 lectures • 40m total length

Introduction (S01V01)4:16
Welcome to the “React Clarified: Thinking in React” video course. This is the introduction to the course, in which we will explain who this course is for, what it is about, and how to set your environment up so that you can follow along in code.

Mockup, JSON API, & Component Hierarchy (S02V01)4:11
1. We will explain that we should start with a mockup of the UI.
2. We will show you how to break up the UI of the app into a component hierarchy.
Filterable Product Table & Search Bar (S02V02)5:59
1. We will start building a static version of “FilterableProductTable”.
2. We will build a static version of “SearchBar”.
Product Table, Row, & Category (S02V03)8:38
We will build a static version of:
1. “ProductTable”.
2. “ProductRow”.
3. “ProductCategoryRow”.
User Interface State (S02V04)4:56
1. We will identify the minimal, but complete, representation of UI state.
2. We will identify which component should own the state.
Applying State to Our App (S02V05)5:50
We will apply state to our application.
Inverse Data Flow (S02V06)6:35
We will add inverse data flow, by passing callbacks from the state source down the hierarchy to the components which respond to user input using event listeners.

Requirements

Basic HTML
Basic CSS
Basic JavaScript ES6
Basic React

Description

In this short video course, we will build a simple user interface using React, in just over 30 minutes. We will focus on how to think about building user interfaces using React.

This course is based on the excellent “Thinking in React” article on the official React documentation site. It is suited for those who learn better by following screencasts than reading documentation.

Please note that this is not a course for complete beginners. If you have dabbled in React before, but have some difficulties understanding React, then this short course is right for you.

Prerequisites:

- Basic HTML, CSS, JavaScript ES6 (especially arrow functions)

- Basics of React, including hooks (especially the “useState” hook)

Who this course is for:

Beginner to Intermediate Web Developers interested in React
Beginner to Intermediate Mobile App Developers interested in React Native
Beginner to Intermediate Desktop App Developers interested in Electron and React

React Clarified: “Thinking in React”

What you'll learn

Explore related topics

Course content

Introduction1 lecture • 4min

Learn by Doing6 lectures • 36min

Requirements

Description

Who this course is for: