Page views:
watch.json
files sorted out.After making the Hack Penn recap site, I feel like I finally understand Theme UI & MDX now. It's an incredible DX, where I don't feel like I'm writing the same boilerplate code over & over like I do with styled-components/DS/my previous stack. You can't go back.
I love how with MDX, your content is separated from your code. Makes it so much more approachable, too.
One interesting thing is the sx
object for styling props.
Initially it looks like a downgrade—why not use first-class props like in DS?
(Historical note: this is actually a switch back to how Rebass v0 did it with inline styles!
I was in 8th/9th grade when that happened.)
But once you're using it, the sx
object prop is so much better. The syntax is easier to type & format
than JSX props, & mostly, it gives you an escape hatch. Need to do a weird selector or psuedoelement or
make a little change to a tag inside? You don't need to graduate to a full-on styled-component at the
top of the file with two lines of code in it, & do the awkward balancing act between attrs
,
defaultProps
, & JSX props, you can just open up sx={{ }}
& make the change right there. It encourages
a much healthier balance of components—you can easily recognize when a component is getting unweildy in
your MDX & move it over to a JS file to be resuable.
Before Theme UI, I was feeling kinda done building Gatsby + DS sites. I've made like a dozen, & maintained hackclub.com, 2019.hackpenn.com, hackhappyvalley.com, statehigh.hackclub.com, & so many others. It's not a bad library, but I was getting tired of a lot of little patterns I didn't love.
With MDX & Next.js/Gatsby & Theme UI, I've got something new, & it feels distinctly better. It's going to be awhile before this catches on, if it ever becoems at all popular, but in the meantime, like I said about Next.js, it makes me want to build things. That's when you know you've got a really incredible stack.