React Fundamentals

  • 48 Lessons
  • 287 Minutes
  • Updated 48 days ago

This course is guaranteed to be up to date.

The modularity of the React ecosystem is extremely powerful for building applications. However, it makes learning React a nightmare when first starting out. To even get a React app up and running, you need the right combination of React, Webpack, and Babel. In this course we'll start from a blank folder and we'll build an application that encompasses everything you need to get started building production ready applications with React (including Routing and Ajax requests). With an average rating of 9.3/10 from 2,945 reviews, this could be the most popular and highest rated way to learn React. Recently updated and compatible with React 16.3.

Pre-Requisites

Experience with the web platform (HTML, CSS, JavaScript) will help, but if you're coming from a different programming language, it isn't required. If you're a complete beginner, this course may be a struggle but you're welcome to try it out.
Sign Up

What you'll learn

  • NPM

  • JavaScript

    Array.map
    Array.filter
    Array.reduce
    Pure Functions
    this
    .call
    .apply
    .bind
  • React (v16.3)

    Imperative vs Declarative
    Composition
    Unidirectional Dataflow
    JSX
    Virtual DOM
    ES6 Classes
    state
    props
    children
    prop-types package
    createElement
    functional setState
    Lifecycle Hooks
    Container vs Presentational Components
    Stateless Functional Components
    Synthetic Events
    Private Stateless Functional Components
  • Webpack 4

    Configuration
    HTMLWebpackPluginConfig
    Loaders
  • Hosting

    Building for Production
    Deployment

Who is this course for?

  • Mid to Sr level back-end developers who are new to JavaScript but want to learn about React as quickly as possible.
  • Bootcamp graduates who are confident in the fundamentals of JavaScript and want to become more employable by learning React.
  • Angular developers who want to learn about why React is gaining popularity.
  • Developers who are frustrated with the disjointed approach to learning React and want a linear, coherent path.
  • jQuery or Backbone developers who want to learn a more declarative, component based approach to building UIs.
  • Native mobile developers who want to see what all the hype around React is about.
  • Front end developers wanting to modernize their skillset in order to get a raise or apply for another job.
Sign Up

Course Outline

  • Intro to the React Ecosystem

    Welcome
    Introduction to the React Ecosystem Video
    Introduction to React Quiz
    (Bonus Text) Imperative vs Declarative Programming
  • Setting up your first React component with NPM, Babel, and Webpack

    Intro to Text Sections
    NPM
    Webpack 4 for React
    First React Component
    Video: Babel, Webpack, and React
    (Bonus Text) React Elements vs React Components
    Quiz: Npm, Babel, and Webpack
  • Dataflow with Props

    Dataflow with Props in React
    Practicing Props
    Solution - Props
    Creating lists in React with .map and .filter
    Practicing .map and .filter
    Solution - .map and .filter
  • Pure Functions. f(d)=v. Props and Nesting React Components.

    Building UIs with Pure Functions and Function Composition in React
    Introduction to PropTypes
    Video: Validating Components with PropTypes
    Quiz: Pure Functions and Props
  • The "this" keyword + Managing and Updating State

    Video: The "this" Keyword Pt1: Intro and Implicit Binding
    Video: The "this" Keyword Pt2: Explicit binding with .call, .apply, and .bind
    Video: The "this" keyword Pt3: The "new" and "window" binding
    Video: Managing and Updating Component State
    Quiz: The "this" keyword
  • Stateless Functional Components

    Stateless Functional Components in React
    Video: Stateless Functional Components
    Private Components in React
    (Bonus Text) Functional Components vs Stateless Functional Components vs Stateless Components
  • Life Cycle Events + Ajax

    React Life Cycle Events
    Video: Making Ajax Requests in React
    Quiz: Lifecycle Events
  • React Router V4

    Intro to React Router V4
    Video: Adding React Router to our Application
  • Forms and Encapsulation in React

    Video: Forms and Encapsulation in React
  • Dynamic Rendering + Query Params

    Video: Dynamic Rendering + Query Params
  • Axios, Promises, and the Github API

    .reduce
    Video: Axios, Promises, and the Github API
  • Composition vs props.children

    props.children in React
    Video: Composition vs props.children
  • Building a Highly Reusable React Component

    Defaulting props with defaultProps
    Video: Building a Highly Reusable Component
    Quiz: Building a Highly Reusable React Component
  • Building for Production + Hosting

    Video: Building for Production + Hosting
    My Favorite Things
    Next Steps

What devs are saying

I've already taken dozens of on-line courses, in a huge variety of formats. But the way that Tyler guide this course is really impressive. I was able to jump from beginner to experienced in React much more faster then I ever thought that would be possible. This course really worth the effort and money invested.

This is hands down the best introduction to React on the web. It was 100% worth the money!!

I haven't seen anyone do what Tyler has done in terms of understanding the pains I'm going through and not only talking in terms I can understand but designing a course that mixes different mediums like text, video, personal project and outside reading.

I'm new to web development and I found React, Webpack, and deployment to be incredibly intimidating. This course was amazingly easy to follow, completely holistic for in it's approach to what a developer needs to know, and modularized in such a way that I was never overwhelmed. Code-along tutorials are usually hard for me to keep up with and often lead to long derailments for trouble-shooting. This tutorial was so smooth: I loved it! Many, many thanks for this. I'm so excited to use what I learned for future projects.

By far the most engaging, in-depth and well thought out React course. This is an university-quality undertaking and I sincerely appreciate the time, effort and passion gone into sharing knowledge for the betterment of the dev community.

Tyler's course is easily the best I could find for those brand new to React- like me! The fact that he assumes almost no prior knowledge of the React environment truly distinguishes this course from most other online resources. If you're just getting started with React and are looking for hands-on, high-quality instruction, look no further.

I found this course incredibly good. The instructor makes sure anyone can understands what's going on, not assuming you have a strong background. I am really thankful that there's someone willing to spend all this time in putting this together and sharing their knowledge with randoms. I am sure Tyler is a great programmer but he is also a great teacher.

This is not only the best React course I have seen, but one of the best laid out courses I've ever taken. It's a perfect mix of explanation, example, practice and project work all moving at a great pace. Highly recommend!

I have spent the past 6 months or so banging my head against my desk trying to level up on my JS/Web App skills and this course was nothing but 'Aha!!' moments. I strongly recommend putting in the time and keep revisiting items you might not understand that Tyler brings up because they will eventually make sense. I can't wait to start kicking work in it's butt!

I thought I knew React pretty well until I did the fundamentals course. It's the best resource I've come across to learn how to use React and use it efficiently and effectively. I've learned some new tricks but more importantly, I've learned to think in React. I highly recommend this program to anyone wanting to learn React. Tyler does an amazing job at presenting and demonstrating how to solve real problems while building real applications.

The best react tutorial on the Internet, by far! Very well structured, 100% accurate and adequately paced. Thank you!

This is one of the best online programming language courses I've ever done. Tyler was great and explained clearly where gotchas might come up. Also the app was fun to build and kept me engaged! Totally worth the time.

I have grown in my career for 40 years developing web pages inside my companies for all kinds of things. My son, and a close friend both independently told me that I should get rid of perl and start using React. Buying and taking your course was the most enlightening thing I have done since my first web search 40 years ago, when nobody even knew what the web was. Your presentation and and examples were perfect for me and I have developed several apps already. I highly recommend this course to anyone who wants to learn react web development. Very well done !

A lot of courses tend to skip over the foundations leaving you able to play around but not really sure how it actually works. Tyler does an amazing job explaining how all the pieces work from a blank canvas so you can feel confident building your own production-ready apps going forward. He's done an incredible job teaching the fundamentals of ReactJS in a fun, easy-to-follow way!

Tyler's course on React was extremely helpful to me as it was very to the point and at the same time in depth. I'll be back for more courses for sure. He has the best explanation of "this", "apply", "call", and "bind" out there.

Sign Up

The Socials

The Newsletter