Project Setup
Loading "Preparing for a Custom Design"
Run locally for transcripts
Before putting our designer hat on, we need to take a few steps to make sure our project is set up for success.
Writing unstyled HTML
We'll start by writing completely unstyled markup, so we have a working baseline. A document that makes sense, even if it was completely unstyled.
Technically, we'll be π writing JSX.
But the output in the browser will be HTML.
Configuring the Tailwind theme
The Figma design uses some colors, fonts and breakpoints that are not part of the π default Tailwind theme.
We need to configure those.
Remember: we're going for a "Pixel Perfect" recreation here.
So let's sweat the details from the get go, and align our Tailwind theme with the design decisions made in Figma.