Advanced: SSR styles encapsulated in a Higher-Order Component

[lucasconstantino]

⚠️ Warning

The changes contained in this PR are considered advanced, and won't be part of the final application. We'll leave it here as a reference and for learning purposes.

---

This PR intends to showcase two things:

1. Real world use case of a HOC (Higher-Order Component)
2. How to use HOCs to decouple concerns

The idea here is we abstract away the whole styles SSR logic – which was copied from Next.js' official styled-components example – out of the _document.tsx page. The intention is to isolate the complexity of this styles SSR process, and make our custom Document as simple as possible, with only application concerns and not low-level SSR concerns.

Besides that, having the styles SSR encapsulated allows the Document to embark other eventual getInitialProps needs that might become necessary, without us having to mingle the complexity of multiple different concerns.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
frontend-academy-2022	✅ Ready (Inspect)	Visit Preview	Jun 13, 2022 at 1:47PM (UTC)