Netlify buys Gatsby

Welcome friends.

In today’s issue, we’ve got SvelteKit’s trademark battle, a Beatles tribute to SSR, and hard lessons from my hot yoga class.

Welcome to #158.

---

Netlify buys Gatsby

I was proud of myself for working ahead and starting to write today’s story earlier in the week than usual, but then BAM — I had to scrap the whole thing because Netlify decided to acquire Gatsby yesterday. (This is what I get for not procrastinating.)

But enough about me, let’s go down to the players on the field to see what they’re saying:

• Netlify is really excited about incorporating Gatsby’s new Valhalla Content Hub — a centralized data layer that makes it easier for enterprises to manage content across multiple sources via a unified GraphQL API. This fits well into Netlify’s own product roadmap, which is focused on building and enabling “composable architectures.” I’m not exactly sure what that means, but that’s mostly because I’m still trying to figure out what Jamstack means.

• Gatsby is also drinking that composable architecture Kool-Aid. They’re “excited” to plug their cloud goodies into Netlify’s platform and expand their reach beyond Gatsby sites. The acquisition will also allow the team to refocus more of their efforts on the Gatsby framework, rather than the Gatsby business.

But when deals like this go down, it’s also helpful to take a closer look at what they’re kind of saying without *technically* saying:

• Netlify is (probably) excited to inject Gatsby Cloud’s enterprise and mid-market customers straight into its veins. Even if it’s a bit artificial, this instant revenue growth could be helpful for Netlify as it looks to raise more investor money in a challenging macro environment. Gatsby also gives Netlify one more jewel in its OSS crown, alongside SolidJS and Eleventy.

• Gatsby was (probably) starting to run out of money and (probably) getting a little tired. They’ve been at it now for 8 years with usage from the last few starting to drop off. This acquisition was (probably) an all-stock deal (which means Gatsby was paid with Netlify stock, not cash) — but it still should help give their investors and team a mostly soft landing.

Bottom Line: Given the current climate, we’ll probably see more deals like this for VC-backed OSS startups in 2023, but we can’t overlook Gatsby’s massive impact on the React ecosystem. Since Kyle Matthews (🫶) first hacked together v0 of the framework in a week back in 2015, the Gatsby npm package has been downloaded over 85 million times and over 4,000 people have made commits in gatsbyjs/gatsby.

I’m sure the team will continue innovating while at Netlify — but it’s worth pointing out that Gatsby wasn’t just another flash-in-the-pan OSS startup that raised a couple million bucks and decided to wind down two years later, when the founders decided they weren’t having fun anymore. Gatsby was one of the first breakthrough OSS projects built on React, it pioneered the early days of React frameworks, and it was instrumental in the early growth of React itself. Thanks for everything, old sport.

---

Last call for the React Data Grid MacBook Pro Giveaway 🚨

The React Data Grid team is giving away a brand new, 14-inch MacBook Pro M2 to one Bytes reader who stars their GitHub repo before Feb. 4th. That’s all you need to do — like NSYNC says, “No strings attached.”

And the good news is, they’re definitely worth the star. The RDG team has been *obsessed* with building the world’s best data grid for years now, and we think they nailed it:

• It’s pure React, not just a wrapper — so it won’t be janky inside your codebase.

• Extensive virtualization gives you great performance.

• There’s tons of functionality baked in, so you won’t have to build anything from scratch.

But even if you don’t care about any of that, and you hate data grids, and you think jQuery is still way better than React — it doesn’t matter. Just star the repo between now and Feb. 4th, and you’ll still be entered to win the $2,000 MacBook Pro.

⭐ Enter to win.

---

Have a job you want to fill?

---

If you wanted to implement an ESPN style effect where you dim all the list elements that aren’t being hovered, how would you do that only using CSS?

<ul>
  <li>NBA</li>
  <li>NFL</li>
  <li>NCAAF</li>
  <li>MLB</li>
  <li>NCAAM</li>
  <li>NHL</li>
</ul>

---

1. Jotai just released v2 of its “bottom-up approach” to global React state management. Unfortunately, some people don’t appreciate a bottom-up approach to certain activities — which I learned the hard way during my last hot yoga class.

2. Courier built an out of the box notification service that manages templates and routing logic for multiple providers like Twilio, SendGrid, APNs, FCM, and Slack. See for yourself, and never build a notification service again. [sponsored]

3. Dave Farley gave a 40-minute talk titled, Taking Back Software Engineering. It’s a great talk, but I was expecting more puns about a certain underrated emo band.

4. Last year, the Riffle Research Project team wrote an interesting article on Building data-centric apps with a reactive relational database that’s worth highlighting. I was slightly more excited when I thought they were called the Ruffle Research Project — but only because those Sour Cream and Cheddar chips represent about 40% of my core childhood memories.

5. Justin Ridgewell and Chengzhong Wu successfully advanced the Async Context proposal to Stage 1 for inclusion in the JS Spec. It still has a long way to go, but this would let you propagate state throughout a potentially async callstack.

6. Andy Jiang wrote a nice article on the Deno Blog called Back to the SSR. Yes, that’s a play on The Beatles song, and yes, the cover image is a cute illustration of two Deno dinos dressed up like Paul McCartney and Ringo Starr. But the article itself also does a good job sharing the evolution of how we’ve rendered websites over the years.

7. Adam Rackis wrote about Caching Data in SvelteKit. Are we sure that some sketchy men’s weight-loss supplement company doesn’t already own the trademark to “SvelteKit”?

8. RedwoodJS v4 just launched with a New Auth API and Enhanced GraphQL Security. My sources tell me that it has not been acquired by Netlify – yet.

---

If you wanted to implement an ESPN style effect where you dim all the list elements that aren’t being hovered, how would you do that only using CSS?

<ul>
  <li>NBA</li>
  <li>NFL</li>
  <li>NCAAF</li>
  <li>MLB</li>
  <li>NCAAM</li>
  <li>NHL</li>
</ul>

Using the new :has selector in CSS, we can use the general sibling selector and a :hover pseudo-selector to target the elements before and after in just 3 lines of css.

See it in action here.

ul {
  display: flex;
  gap: 8px;
}

li {
  display: block;
  cursor: pointer;
  transition: opacity 0.3s ease-in-out;
}

li:has(~ li:hover),
li:hover ~ li {
  opacity: 0.5;
}

Shoutout to Stephanie Eckles who wrote a fantastic article covering the :has selector.