Josh Justice

Extracting a React Component

Josh Justice | Jun 18, 2018

How to extract a child component out of an existing parent component in React?

Sometimes we don’t realize we should make a custom child component until it’s too late. In this screencast, we'll teach you how to extract a React component from an app.

For the More Curious...

Components & Props - React Cypress Documentation

Subscribers Only

Transcripts are for subscribers. Create an account today to access our collection of screencasts, skill packs, and more.

Subscribers Only

Project files are only available for subscribers. Create an account today to access our collection of screencasts, skill packs, and more.

Need Help?

If you get stuck, try starting a discussion with Big Nerd Ranch experts in the community tab.

Related Screencasts

Explore other screencasts related to this topic.

Rails APIs (Part 1) - Getting Past the CRUD

8 minutes

In this screencast, we'll show you how to create a web service for tracking todos and we'll continue to build on this application throughout the rest of the series.

Rails APIs (Part 6) - Authorization Rules

7 minutes

In a previous video we set up authentication for our Rails API, so that only logged in users can make changes. But sometimes more sophisticated rules are needed. In this screencast, we'll learn how to successfully add authorization to our API.

Rails APIs (Part 5) - Associations and Nested Routes

5 minutes

In this screencast, we’ll use the Doorkeeper gem makes it easy to add authentication to Rails APIs using the OAuth 2 standard.

Rails APIs (Part 2) - Deploying

6 minutes

Whether you are building a prototype or a business critical product, Heroku makes it easy to deploy and scale web applications. If you’ve never run a production web application before this might sound intimidating, but don’t worry—we’re going to use Heroku, a platform that makes deploying apps incredibly easy. But first we have a little preparation to do.

Rails APIs (Part 7) - Testing Web Services

8 minutes

In a previous screencasts, we built out a simple but full-featured web service. We have several tables of related data, validation, default values, and authorization. This is great, but it’s also starting to get complex enough that we might break something! Luckily, Rails’ testing support is second-to-none. In this screencast, we'll learn how to set up automated testing for our Rails web service.

Optimizing Caching in React

7 minutes

In this screencast, we’ll look at how to speed up you React app by allowing browsers to cache your code as long as possible. By the end of the video you’ll be able to configure Webpack to minimize how often a user needs to re-download your JavaScript Bundles.