React Higher Order Components
Higher Order Components ("HOC" in short) is a react application design pattern that is used to enhance components with reusable code. They enable to add functionality and behaviors to existing component classes.
Higher Order Component that checks for authentication
Let's say we have a component that should only be displayed if the user is logged in.
So we create a HOC that checks for the authentication on each render():
We then just use this Higher Order Component in our components that should be hidden from anonymous users:
Simple Higher Order Component
Let's say we want to console.log each time the component mounts:
Use this HOC in your code: