Hasty Treat - What is SvelteKit?

Syntax - Tasty Web Development Treats

In this Hasty Treat, Scott and Wes talk about SvelteKit — what it is and why you might want to use it.

Sanity - Sponsor

Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax.

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

03:28 - What is it?

• Total platform for building Svelte apps
• Built in Vite.js
  • Includes all of the Vite goodness but it hides behind the scenes for the most part
• Host anywhere

05:16 - Is it CSR, SSR, SSG, WTF?!

• All of the above. Uses adapters to control the output:

kit: { // hydrate the element in src/app.html target: '#svelte', adapter: adapter() }

09:45 - What you get out of the box

• File-based routing
• API routes
• Layouts and layout resets
• Fancy file titles [slug] __layout
• Code splitting & preloading
• PostCSS
• TypeScript support

17:03 - Neat small things

• Glob import
• https://github.com/svelte-add/svelte-add

Links

• SvelteKit
• Next.js
• Gatsby.js
• Sapper
• tailwindcss
• @chriscoyier

Tweet us your tasty treats!

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets