271

August 3rd, 2020 ×

Hasty Treat - Upgrading Next.js Syntax Site

or

In this Hasty Treat, Scott and Wes talk about their experience upgrading Syntax.fm and some of the site's big changes.

LogRocket - Sponsor

LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.

Show Notes

02:26 - The old Syntax site

  • Next.js
  • Custom server for
    • API - shows, Latest shows, sick picks
    • On-demand page builds
    • Custom routing

06:41 - The new Syntax site

  • Next.js has solved those things now, no need for a custom server.
    • API Routes
    • On-demand page builds: SSG with Next.js. It's a server, but caches the page builds. Releasing the shows happens with revalidation. It's statically generated like Gatsby, but you can also choose
    • Custom routing is now done with [pages]
  • Very fast to load
  • Very fast to build
  • Very fast to deploy
  • It's now a "dynamic static site"
  • Zeit Now 1 to "Vercel"
  • Huge thanks to Tim Neutkens and Luis Alvarez from Vercel for making it happen.

13:23 - Why not:

  • Gatsby
    • Entire site would need to be regenerated exactly at 9am eastern
    • API of the site would need to be done with something else like Netlify Functions - not nearly as nice as Next API routes
  • Sapper

Tweet us your tasty treats!

Share

Play / pause the audio
Minimize / expand the player
Mute / unmute the audio
Seek backward 30 seconds
Seek forward 30 seconds
Increase playback rate
Decrease playback rate
Show / hide this window