Building Scalable React Apps
In this course, you will learn how to scale your React application using the ready-made React-Boilerplate stack.
What you'll learn
In this course, Building Scalable React Apps, you will remove the guesswork with the React-Boilerplate stack so that you can keep on delivering features, without needing to evolve your stack with every new addition. First, you'll learn how to use redux-saga to elegantly attach side effects to your app. Next, you'll focus on learning how to use reselect to compute values on top of your redux store. Finally, you'll learn how to design your components to keep them as simple, portable, and testable as possible. After watching this course, you'll be able to tackle large React applications alone, or with a team.
Table of contents
- Introduction 1m
- Styling the AppBar Component 6m
- Creating an Action to Toggle the Drawer Component's Visibility 3m
- Creating the Drawer Component 4m
- Adding Conditional Styling Based on State 3m
- Maintaining the Drawer's Open State on the Redux Store 4m
- Show or Hide the Drawer Component Based on State 3m
- Creating the Link Component 3m
- Styling the Link Component 5m
- Summary 1m
- Introduction 2m
- Intercepting an Action to Change the Route 3m
- Getting a Component to Display on a Child Route 3m
- Using Reselect to Access Route Parameters 3m
- Loading Data for a Component When It's Loaded by a Route 6m
- Preventing Code Injection Through Route Parameters 5m
- Redirecting to a Route Based on Server Data When the App Loads 4m
- Summary 1m
- Introduction 2m
- Getting a New Component to Show on Its Own Route 5m
- Laying out a Form 4m
- Wiring a Form with Validation 4m
- Presenting a Validation Message on a Form 4m
- Getting Form Values onto State 5m
- Navigating Back to the Previous Route 5m
- Selecting Data from Another Container Component's Part of State 5m
- Summary 1m
- Introduction 1m
- Getting the Link Form Component to Render on a Route 3m
- Fleshing out the Link Form Component 2m
- Displaying a Component in a Dialogue 3m
- Creating a New Generic Component for Text Input 4m
- Using the New Generic Text Input Component 3m
- Changing the Login Component to Use the Text Input Component 2m
- Summary 1m
- Introduction 2m
- Creating an Icon Button Component 3m
- Extending the New Icon Button Component with Style 4m
- Triggering an Action to Show the Add Route 4m
- Hooking up Validation for the Link Form 5m
- Getting an Action to Fire Containing a New Link 3m
- Saving the New Link to the Server 6m
- Showing a Newly Created Object Inside the App 4m
- Dismissing the Add Link Dialogue 3m
- Summary 3m
About the author
Hendrik kicked off his career in 2000 installing MS Outlook on PCs in coal mines throughout South Africa. Seriously. He had to wear a hard hat and everything. Luckily he got his foot into the door at a company that allowed him to play around with code. At a desk. Without a hard hat. In his day job Hendrik is a full stack coder from Cape Town, but at night he is a closet designer - meaning, a graphic designer too scared to share it with everyone, not someone that designs closets. For a large part... more