This course is for experienced React developers wanting to become even more proficient. You will build upon your existing React knowledge. After this course you will build even better components and applications.
Duration: 2 days
- Learn how to create even better React components.
- Use Storybook to build and test your components in isolation.
- Understand the pros and cons of different ways to handle cross cutting concerns like Context, higher order components or render props.
- Add proper error boundaries to your React application.
- Find and fix performance problems in a React application using Chrome browser tooling, Profile, PureComponents, getDerivedStateFromProps and memoization.
- Enable pre-rendering or server-side rendering of your React application.
Six months of web development using React.
A basic knowledge of using NPM packages.
A basic knowledge of WebPack with Babel.
- Building Better React Components
There are many best practices for building React components. You can build applications without following these best practices if you want. Yet you will find that you are a lot more effective if you do follow some proven design principles. In this module you will learn how to build better React components. These components are easier to test and more reliable. You will also learn about some of the more specialized React component classes such as Fragment and StrictMode.
- Unit Testing
Most developers write unit tests for their code. With React that means writing unit tests for the React components you are writing. In this module you will learn how to use Jest to write good and maintainable unit tests. You will use Airbnb’s Enzyme to help create better unit tests. You will also learn how to use snapshot testing effectively.
- Dealing with cross cutting concerns
Every application or library has to deal with cross-cutting concerns. In this module you will learn how to deal with these cross-cutting concerns. You will learn how to use various techniques such as Higher Order Components and Render Props. These provide extra functionality or data to other components. You will also learn how to share functionality throughout the component tree using the React Context API. Finally, you will learn how to do proper error handling in your application using React error boundaries.
- Performance tuning of React applications
Even though React is really fast it’s still possible to run into performance issues. In this module you will learn how to track these down using the Chrome profiler, Profile components and various other tools. Then you will learn various techniques to fix performance problems such as using PureComponents, getDerivedStateFromProps or memoization. We will also take a look at specialized components libraries such as react-virtualized.
- Using Storybook to develop components
Developing and testing individual components as part of a larger application can be tedious. Often you need to take extra steps to get the component into a specific state. In this module you will learn how to leverage Storybook to make component development easier. When done properly this makes the whole feedback cycle much shorter resulting in better and faster development.
- Server-side Rendering