Build Web Apps with React JS and Flux (2015)

MP4 | AVC 938kbps | English | 1152x720 | 60fps | 10 hours | AAC stereo 61kbps | 3.45 GB

Genre: Video Training

Master the fundamentals of React as you develop applications supported by Flux, React Router, Gulp, and Browserify. Mastering React can get you a position in web development or help you build that personal project you've been dreaming of. It's a skill that will put you more in demand in the modern web development industry, especially with the release of Flux and ReactNative. This course will get you up and running quickly, and teach you the core knowledge you need to deeply understand and build React components. We'll start by mastering the fundamentals of React, including JSX, “props", “state", and eventing. Source code is provided for each lecture, so you will always stay up-to-date with the course pacing.

If you are new to React, or if you've been working to learn it but sometimes feel like you still don't quite 'get it', this is the React course for you! To learn React you have to understand it.

Learn how to use React's custom markup language, JSX, to clean up your Javascript code.

Learn the process of converting JSX to raw Javascript on the fly in your browser.

Master the process of breaking down a complex component into many smaller, interchangeable components.

Grasp the difference between “props" and “state" and when to use each.

Learn how to construct your own automated build process using Gulp and Browserify to automatically prepare your React code for deployment.

Use Bootstrap to get awesome-looking components.

I've built the course that I would have wanted to take when I was learning React. A course that explains the concepts and how they're implemented in the best order for you to learn and deeply understand them.

Section 1 - Start Here - Dive In!

Lecture 1: Introduction

Lecture 2: Link to Github Repository

Lecture 3: JSX Markup In Our Views

Lecture 4: First Application - Basic Building Blocks

Lecture 5: First Application - Creating a React Class

Lecture 6: First Application - Showing Content

Section 2 - Intermediate Concepts

Lecture 7: Exploring Props - Customizing Views

Lecture 8: Exporing Props - Wiring Up Our Data

Lecture 9: Composition - Views Within Views

Lecture 10: Composition - Props Selection

Lecture 11: Lists

Section 3 - Tooling

Lecture 12: Tooling - Breaking Up Our Code

Lecture 13: Tooling - Applying NPM

Lecture 14: Tooling - Exporting Code

Lecture 15: Tooling - Gulpfile

Lecture 16: Tooling - Final Refactor

Section 4 - State and Events

Lecture 17: Exploring State and Events - Purpose of State

Lecture 18: Exploring State and Events - State Applied

Lecture 19: Exploring State and Events - Bringing Button Back

Lecture 20: Exploring State and Events - Adding Content

Lecture 21: Exploring State and Events - Toggling Visibility

Lecture 22: Exploring State and Events - Selecting Items

Section 5 - Working with Remote Data on Firebase

Lecture 23: Firebase - Building From a New Start

Lecture 24: Firebase - Firebase Signup and Integration

Lecture 25: Firebase - Building Our Application Architecture

Lecture 26: Firebase - Hooking Up Our Remote Datastore

Lecture 27: Firebase - Scaffolding the Header

Lecture 28: Firebase - Handling Form Inputs

Lecture 29: Firebase - Pushing Data to Firebase

Lecture 30: Firebase - Rendering a List of Items

Lecture 31: Firebase - Waiting on Data Before Rendering

Lecture 32: Firebase - Building Item Components

Lecture 33: Firebase - Updating Data to the Remote Datastore

Lecture 34: Firebase - Debugging Firebase Update

Lecture 35: Firebase - Allowing Editing and Undoing

Lecture 36: Firebase - Saving Edits

Lecture 37: Firebase - Bulk Delete Data

Section 6 - Flux and React Router

Lecture 38: Project Overview

Lecture 39: Imgur API Overview

Lecture 40: Imgur API in Detail

Lecture 41: React Router Demo

Lecture 42: Nesting Routes

Lecture 43: Refactor to Separate Rendering and Routing

Lecture 44: In-App Navigation

Section 7 - Flux - Downwards Data Flow

Lecture 45: Implementing Fetch

Lecture 46: Working with Fetch's Promise

Lecture 47: Display a List of Topics

Lecture 48: Fetching Data Naively

Lecture 49: Working With Stores

Lecture 50: Triggering Changes From a Store

Lecture 51: Working with Actions

Lecture 52: Recap of Flux Data Fetching

Lecture 53: Routing with Parameters

Lecture 54: Matching Parameters

Lecture 55: Rendering Topics in the Header

Lecture 56: React Router Helpers

Lecture 57: Implementing Image Store

Section 8 - Combining Flux and React Router

Lecture 58: Refetching Data on Rerender

Lecture 59: Scaffolding Image Previews

Lecture 60: Filtering Image Data

Lecture 61: Playing Videos on Mouseover

Lecture 62: Showing a Play Button for Each Image

Lecture 63: Adding an Image Stats Overlay

Lecture 64: Scaffolding Image Detail

Lecture 65: Fetching Single Records from a Store

Lecture 66: Fetching Single Records from a Store Continued

Lecture 67: Rendering an Image Detail

Lecture 68: Actions With Multiple Methods

Lecture 69: Listening to Many Changes in a Component

Lecture 70: CSS Animations

Lecture 71: Closing Comments and Next Steps