Build svelte components with test first aproach by using Jest and the Svelte Testing Library. We will see how we can query elements, how we can interact with them and also how we can replace external service without mocking.

01:24 Changelog - SvelteKit 1.27.2 02:12 Quick facts & Announcements - Normalizing events 06:02 Community Showcase - Svelte Pilot by Fenix 16:27 Discussions - Choosing a database 27:52 Q&A - How to write a preprocessor

01:15 Changelog - SvelteKit 1.27.3-1.27.4; Svelte 4.2.3 03:41 Quick facts & Announcements 08:09 Community Showcase - CanIKit by Tom 19:11 Q&A - How to close a modal with background click

A Svelte and SvelteKit changelog update covering CSS parsing improvements and request handling fixes. A community showcase of "Sals," a functional reactive alternative to Svelte stores with better async and error handling. A guide to configuring Vitest for browser-like environments to properly test Svelte components' `onMount` lifecycle hook.

Svelte updates and a showcase by Eno on a new component called Svelte Cartesian. The episode starts with a changelog covering various fixes and improvements in Svelte, including event handler changes, input value handling, and CSS pruning. Eno then presents Svelte Cartesian, a tool for visual regression testing that helps render all combinations of a component's props for testing purposes.

Recent updates and features in Svelte and SvelteKit, with a focus on Storybook for Svelte Part 3: Testing

Brittney Postma of CodingCat.dev shows us how to create a store with Svelte and setting it to local storage so that it persists through refresh!

Custom stores can be used to wrap transforming data to and from storage mechanisms, either inside the browser or outside. Here we demonstrate a couple of fun transforms that have practical and real-world use.

Finite state machines provide an elegant, powerful approach for modeling complex behavior, and are ideally suited to many UI components. Alas, existing JavaScript FSM implementations feel verbose and bloated alongside Svelte's elegant, minimalist syntax. No more! svelte-fsm is the Svelte-esque FSM library. Discover the joy and benefits of using svelte-fsm to manage your components' state.

Routify 3 preview and walkthrough — app creation via CLI, plugin usage (Index By Name), Pico CSS integration, page ordering, and route metadata concepts. Build-time metadata generation, API data fetching (e.g., GitHub), Markdown-to-HTML conversion, dynamic routes and imports for SSR, navigation and multi-router features, and router state persistence.

Maurice de Beyer on building reliable Svelte applications using Cypress and test-driven development.

If you are building a Single-Page App (SPA), you will likely need a router for your app. With the lack of an official router for Svelte 3, there's quite a few options, so which one should you pick? In this talk, we'll look at the two different kinds of routers (based on the History API or based on the page's hash), how they differ, and when you should pick which. We'll also go through a demo of implementing routing for a Svelte 3 SPA using svelte-spa-router.

Using Playwright for end-to-end testing in SvelteKit applications

Authentication Server-Side Rendered Single-Page Apps can be difficult. Antony looks to break down the simplest possible way of providing full SSR compatible authentication with JWT

Routify offers a great developer experience to build the routes for your Svelte app.