Complete Intro to React, v3 (feat. Redux, Router & Flow)

Complete Intro to React, v3 (feat. Redux, Router & Flow)

English | MP4 | AVC 1920×1080 | AAC 48KHz 2ch | 14h 18m | 5.58 GB

Learn how to build real world applications with React! Much more than an intro, you’ll not only learn React, you’ll also learn how to work with a proven set of powerful tools in the React ecosystem to build scalable, real-world applications. Learn to piece together a proven set of tools, adding each tool as you need them, including React Router v4 for paging, Jest for testing, Redux for state management, ESLint and Flow for code quality …and much more!

Table of Contents

Complete Introduction to React v3
1 Introduction
2 Yarn Dependency Manager
3 Simple React Components
4 React Paradigm
5 Factories & Props

Tools
6 Prettier
7 ESLint
8 ESLint and SublimeText
9 webpack and Babel
10 Configuring webpack
11 Configuring Babel
12 Setting Up webpack.config.js File
13 Running webpack from npm

React
14 JSXwebm
15 Starting a Web App
16 Setting up devServer

Routing, Props, & State Management
17 React Router
18 HashRouter
19 BrowserRouter
20 Loading JSON Data
21 Makng a ShowCard Component
22 PropTypes
23 Using the Spread Operator in JSX
24 Key Prop
25 styled-components
26 One-Way Data Flow
27 Q&A – Key and styled-components
28 Managing State
29 transform-class-properties
30 Filtering
31 Q&A – Nested Arrays, ES6, & More

Testing React
32 Snapshot Testing with Jest
33 Configuring and Running Jest
34 Shallow testing with Enzyme
35 Testing the Number of ShowCards
36 Testing the Search Field
37 Thoughts on Testing
38 test Coverage with Istanbul

Hot Module Replacement
39 Introducing Hot Module Replacement
40 Setting up HMR

Flow
41 Introducing Flow
42 Setting up Flow
43 Applying Flow
44 Defining flow-typed
45 Fixing flow-typed Definitions

Data in React
46 URL Parameters
47 Sharing State & Updating the Search Components
48 Finishing the Details Component
49 Creating a Header Component
50 Conditional Display Logic Part 1
51 Conditional Display Logic Part 2
52 React Lifecycle Methods
53 componentDidMount() & AJAX Requests
54 Showcard Link
55 Wrapper and Q&A
56 React Development Tools
57 React Performance Tools
58 Q&A – Defining Components, & More

Redux
59 Introducing Redux
60 Setting up Redux
61 Connect Redux to React
62 Landing Interact with Store
63 Dispatching Actions to Redux
64 Redux Review
65 Search Submit Event
66 Using Redux in the Search Component
67 Using redux in the Header Component
68 Q&A – Object and Props, Dispatch, & More
69 Q&A – Recap
70 Refactor Redux for Flow
71 Refactor Reducers
72 Redux DevTools
73 Q&A – Coding Issue, State, & More

Async Redux
74 Middleware & Thanks
75 Setting Up Middleware & Thunks in Redux
76 Async Functions
77 Adding Async Actions to the Details Component
78 Q&A – Async with Redux

Testing Redux
79 Updating Snapshot
80 Dispatching Actions
81 Testing Reducers
82 Testing actionCreators
83 Testing Thunk
84 Q&A – Tests and Databases

Universal Rendering
85 Why Use Univarsal Rendering _
86 Separating the Client and Server Code
87 Implementing Server-Side Rendering
88 Running the Node Server
89 Fixing HMR

Webpack Code-Splitting and Async Routing
90 Code Splitting with Webpack
91 Async Routing
92 Setting Up Import
93 Creating a Landing Bundle
94 Creating Search and Details Bundles
95 Building for Production
96 Preact

Wrapping Up Introduction to React v3
97 Final Q&A and Wrapping Up