ReactAdvanced#patterns

What are higher-order components (HOCs)?

A function that takes a component and returns an enhanced component, used to share cross-cutting behaviour. Hooks have largely replaced HOCs, but they still appear in older codebases and libraries.

Example
function withAuth(Comp) {
  return props => useAuth().user ? <Comp {...props} /> : <Login />;
}

Related Questions

1
ReactAdvanced#patterns#dom

What are React portals?

Open
2
ReactAdvanced#performance

How do you optimise performance in a React app?

Open
3
ReactAdvanced#ssr#seo

What is the difference between client-side and server-side rendering?

Open