React Tips



Published May 2017

Bite size lessons on Facebooks JavaScript UI library, React.

You’ve heard the hype. Everyone and their cat is talking about React.js, the JavaScript UI Library from Facebook. That’s because it takes a dramatically different approach to building UIs, an approach that is showing up in competing frameworks like Ember and Angular.

This mini course is a gentle introduction to the most fundamental and practical parts of React. You’ll get an excellent, hands-on experience in building React components from the ground up.

In our second lesson, we’ll wrap up with a beautiful, functional, lap-counting stopwatch which you can build in just 30 minutes. Don’t believe me? I’ll prove it. React.js makes it easy to build interactive UIs with very little code. Get ready to build stateful UIs with React.js including state-management, conditional rendering, and capturing time.

What you'll learn

  • Learn React basics
  • Build a stopwatch with React
  • Closed captions available
Meet your instructor
Michael Chan

Michael is obsessed with teaching. He designs at Planning Center Online, organizes Full Stack Talks in San Diego, and teaches React.js at SitePoint. He thinks his wife and two ridiculous kids are super great. Also ramen.

Lesson 1: React Tips
Free Getting Started with React 5:35
Introducing the One-Way Data Flow with React 5:15
Using Props to Pass Data in React 5:13
An Introduction to Component States in React 5:13
Understanding React Events 4:56
Controlled Components vs Uncontrolled Components in React 5:37
Using map() to Create Lists in React 5:22
Using Webpack to Transform JSX 8:10
Lesson 2: Building a Stopwatch with React
Capturing Time 8:31
Conditional Rendering 4:50
Adding a Lap Logger 7:10
Using className to Add Style 7:18

Leave a Review