Rich Harris - SvelteSnaps
Rich Harris builds an Instagram clone, showcasing the different features of SvelteKit.
Rich Harris - SvelteSnaps
Rich Harris builds an Instagram clone, showcasing the different features of SvelteKit.
Share with the biggest community of Svelte enthusiasts in the world
Welcome to Svelte Society, homepage for everything Svelte. Find what you're looking for in the navigation above!
Support Svelte Society and get your company featured here. Contact us
Rich Harris builds an Instagram clone, showcasing the different features of SvelteKit.
Rich Harris builds an Instagram clone, showcasing the different features of SvelteKit.
0:00 Introduction 0:47 Changelog - SvelteKit v1.19.0 7:26 Quick facts - New Discord roles, and ‘recommendations’ tag for the #ecosystem forum channel 8:20 Community Showcase & Microtalks - How to choose a UI Library 28:22 This week in discussions - international keyboard layouts, usage of quotes in Prettier, roadmap.sh 38:30 This week in Q&A - breakpoint debugging in SvelteKit using VSCode and browser dev tools
0:00 Introduction 0:47 Changelog - SvelteKit v1.19.0 7:26 Quick facts - New Discord roles, and ‘recommendations’ tag for the #ecosystem forum channel 8:20 Community Showcase & Microtalks - How to choose a UI Library 28:22 This week in discussions - international keyboard layouts, usage of quotes in Prettier, roadmap.sh 38:30 This week in Q&A - breakpoint debugging in SvelteKit using VSCode and browser dev tools
Inlang: a solution for internationalization in SvelteKit projects. The SDK and its tools simplify setup, language negotiation, and content management. This approach automates i18n processes, offering a user-friendly experience for developers and translators.
Inlang: a solution for internationalization in SvelteKit projects. The SDK and its tools simplify setup, language negotiation, and content management. This approach automates i18n processes, offering a user-friendly experience for developers and translators.
Talking about how we started to build SvelteLab for the first Svelte Hack, how we worked, what tools we picked and how it all came together.
Talking about how we started to build SvelteLab for the first Svelte Hack, how we worked, what tools we picked and how it all came together.
Rapidly build interactive 3D apps for the web with Threlte 6. Let’s dive into the incredibly powerful new API design, the brand new Plugin API, a practical workflow for utilizing glTF files and additional enhancements that streamline the development of immersive 3D experiences in Svelte.
Rapidly build interactive 3D apps for the web with Threlte 6. Let’s dive into the incredibly powerful new API design, the brand new Plugin API, a practical workflow for utilizing glTF files and additional enhancements that streamline the development of immersive 3D experiences in Svelte.
This is a short introduction of the talk2svelte library which provides voice recognition and voice synthesis for Svelte, thanks to the Web Speech API. It allows to interact with a Svelte site by voice, like navigating or clicking on elements.
This is a short introduction of the talk2svelte library which provides voice recognition and voice synthesis for Svelte, thanks to the Web Speech API. It allows to interact with a Svelte site by voice, like navigating or clicking on elements.
0:00 Introduction 0:36 Changelog - SvelteKit v1.17.0-1.18.0, adapter-vercel 3.0.0 12:47 Quick facts - Rich Harris on Learning with Jason, accessible HTML tables, CSS nesting
0:00 Introduction 0:36 Changelog - SvelteKit v1.17.0-1.18.0, adapter-vercel 3.0.0 12:47 Quick facts - Rich Harris on Learning with Jason, accessible HTML tables, CSS nesting
At Stylitics, we ship Javascript Widgets to some of the largest e-commerce sites in the world. In this talk we'll explore why we choose Svelte to build our products, and what we've learned from maintain one of the most visited Svelte apps in the world.
At Stylitics, we ship Javascript Widgets to some of the largest e-commerce sites in the world. In this talk we'll explore why we choose Svelte to build our products, and what we've learned from maintain one of the most visited Svelte apps in the world.
Learn how to harness the power of Svelte and SvelteKit to create elegant AI driven experiences. Svelte Stores, Streaming endpoints, and Python endpoints (through preprocessors), are magic you can only find in Svelte.
Learn how to harness the power of Svelte and SvelteKit to create elegant AI driven experiences. Svelte Stores, Streaming endpoints, and Python endpoints (through preprocessors), are magic you can only find in Svelte.
Skeleton allows you to create adaptive, accessible design systems for your web apps using Tailwind’s flexible utility classes paired with Svelte’s powerful component architecture. Generate customized, responsive, and reactive interfaces for projects of any scope or scale.
Skeleton allows you to create adaptive, accessible design systems for your web apps using Tailwind’s flexible utility classes paired with Svelte’s powerful component architecture. Generate customized, responsive, and reactive interfaces for projects of any scope or scale.
I will talk about Superforms, the forms library for SvelteKit that handles validation, error handling, data coercion and so much more, all while staying true to the Svelte+Kit principles.
I will talk about Superforms, the forms library for SvelteKit that handles validation, error handling, data coercion and so much more, all while staying true to the Svelte+Kit principles.
- ZenStack aims to reduce repetitive tasks in software development by generating APIs and enforcing access control policies, making it easier to build applications. - SvelteLab is a supercharged REPL for Svelte and SvelteKit, which includes features like GitHub integration, dark mode, and code formatting. - Integrating 3D experiences into Svelte using libraries like Threlte and Spline, with a demo showcasing the creation of a 3D scene in Spline and its integration into a Svelte application.
- ZenStack aims to reduce repetitive tasks in software development by generating APIs and enforcing access control policies, making it easier to build applications. - SvelteLab is a supercharged REPL for Svelte and SvelteKit, which includes features like GitHub integration, dark mode, and code formatting. - Integrating 3D experiences into Svelte using libraries like Threlte and Spline, with a demo showcasing the creation of a 3D scene in Spline and its integration into a Svelte application.
Grischa Erbe (creator of Threlte) helps us design and build a badge for the new website.
Grischa Erbe (creator of Threlte) helps us design and build a badge for the new website.
0:00 Introduction 0:25 Changelog - SvelteKit v1.16.1-1.16.3, Svelte 3.59.1 6:19 Quick facts - accessible navigation with aria-current 21:00 Community Showcase - (none) 21:03 This week in discussions - Svelte 4.0 changelog preview 24:49 This week in Q&A - How to detect with JS is available, [not] using stores in your back-end, more accessible navigation with JS detection
0:00 Introduction 0:25 Changelog - SvelteKit v1.16.1-1.16.3, Svelte 3.59.1 6:19 Quick facts - accessible navigation with aria-current 21:00 Community Showcase - (none) 21:03 This week in discussions - Svelte 4.0 changelog preview 24:49 This week in Q&A - How to detect with JS is available, [not] using stores in your back-end, more accessible navigation with JS detection
Minimal SvelteKit template with a perfect set-up for WindiCSS and Flowbite
Minimal SvelteKit template with a perfect set-up for WindiCSS and Flowbite
How Svelte reduces boilerplate, enabling developers to focus on application-specific functionality.
How Svelte reduces boilerplate, enabling developers to focus on application-specific functionality.
How to replace Svelte’s built-in flip and crossfade animations with view transitions, as well as the pros of cons of each approach.
How to replace Svelte’s built-in flip and crossfade animations with view transitions, as well as the pros of cons of each approach.
Update about Svelte Inspector.
0:00 Introduction 0:36 Changelog - SvelteKit v1.15.10-1.16.0 7:46 Quick facts - secret environment variables, reactive statement lifecycle, media query range syntax 17:25 Community Showcase - custom stores with karimfromjordan 39:22 This week in discussions - Host providers that sell a developer experience 40:39 This week in Q&A - range syntax is available in Svelte 3.59.0
0:00 Introduction 0:36 Changelog - SvelteKit v1.15.10-1.16.0 7:46 Quick facts - secret environment variables, reactive statement lifecycle, media query range syntax 17:25 Community Showcase - custom stores with karimfromjordan 39:22 This week in discussions - Host providers that sell a developer experience 40:39 This week in Q&A - range syntax is available in Svelte 3.59.0
00:00 Prelude 10:08 Start 12:37 Get your keyboard out of your way with Svelte 18:21 Hacking SvelteLab 31:46 Skeleton - a powerful UI toolkit for Svelte + Tailwind 37:33 Svelte at Scale 1:03:30 Svelte, do you hear me? 1:10:15 Threlte 6 1:33:29 Svelte Inspector Update 1:45:20 Hackathon Presentation 2:12:07 Break Starts 2:31:50 Break Ends 2:35:46 Superforms! 3:00:23 Intelligent Svelte: Unleashing AI with Reactivity 3:09:20 Sveltekit and i18n - let's finally solve this never ending story 3:19:35 Supercharge your app's animation with View Transitions 3:32:38 Rich Harris 3:56:17 Outro and thank you to everyone!
00:00 Prelude 10:08 Start 12:37 Get your keyboard out of your way with Svelte 18:21 Hacking SvelteLab 31:46 Skeleton - a powerful UI toolkit for Svelte + Tailwind 37:33 Svelte at Scale 1:03:30 Svelte, do you hear me? 1:10:15 Threlte 6 1:33:29 Svelte Inspector Update 1:45:20 Hackathon Presentation 2:12:07 Break Starts 2:31:50 Break Ends 2:35:46 Superforms! 3:00:23 Intelligent Svelte: Unleashing AI with Reactivity 3:09:20 Sveltekit and i18n - let's finally solve this never ending story 3:19:35 Supercharge your app's animation with View Transitions 3:32:38 Rich Harris 3:56:17 Outro and thank you to everyone!
An AI primer for developers covering the evolution of models, modalities such as image and text generation, and practical applications. Swyx's personal journey into AI, opportunities for builders, and considerations of potential societal risks from advanced AI.
An AI primer for developers covering the evolution of models, modalities such as image and text generation, and practical applications. Swyx's personal journey into AI, opportunities for builders, and considerations of potential societal risks from advanced AI.
Simon 'dummdidumm'' joins us to talk about recent developments in the Svelte and Kit repos.
Simon 'dummdidumm'' joins us to talk about recent developments in the Svelte and Kit repos.
0:00 Introduction 0:28 Changelog - SvelteKit v1.15.8 and 1.15.9 1:56 Quick facts - colour contrast overview 9:57 Community Showcase - container query use cases with Michael Leahy 17:23 This week in discussions - Use svelte-check, maintain high-quality repositories 21:06 This week in Q&A - Global types, reusable types, where to place components, how to add path aliases
0:00 Introduction 0:28 Changelog - SvelteKit v1.15.8 and 1.15.9 1:56 Quick facts - colour contrast overview 9:57 Community Showcase - container query use cases with Michael Leahy 17:23 This week in discussions - Use svelte-check, maintain high-quality repositories 21:06 This week in Q&A - Global types, reusable types, where to place components, how to add path aliases
- Bert Bankson discusses creating animations and interactive elements using Svelte and SvelteKit. - Matthias presents on data visualization using Svelte, showcasing projects from Der Spiegel.
- Bert Bankson discusses creating animations and interactive elements using Svelte and SvelteKit. - Matthias presents on data visualization using Svelte, showcasing projects from Der Spiegel.
The video explains skip links, which are used to improve web navigation efficiency. Skip links allow users to jump directly to the main content or other key sections of a webpage when using a keyboard or screen reader.
The video explains skip links, which are used to improve web navigation efficiency. Skip links allow users to jump directly to the main content or other key sections of a webpage when using a keyboard or screen reader.
This week’s topics: 0:00 Introduction 0:35 Changelog - SvelteKit v1.15.6-1.15.7 2:52 Quick facts - skip links 9:28 Community Showcase - (none) 9:44 This week in discussions - Node 20 single executable, Pretty TypeScript errors, “Hot takes on the web” by Rich Harris, Vite 4.3 17:35 This week in Q&A - SvelteKit Error handling and logging, optional parameters, static asset handling
This week’s topics: 0:00 Introduction 0:35 Changelog - SvelteKit v1.15.6-1.15.7 2:52 Quick facts - skip links 9:28 Community Showcase - (none) 9:44 This week in discussions - Node 20 single executable, Pretty TypeScript errors, “Hot takes on the web” by Rich Harris, Vite 4.3 17:35 This week in Q&A - SvelteKit Error handling and logging, optional parameters, static asset handling
0:00 Introduction 0:41 Changelog - SvelteKit v1.15.1-1.15.5 4:03 Quick facts - learn.svelte.dev, svelte stores do not persist data, non-null assertions, accessible buttons 19:46 Community Showcase - SvelteLab 31:23 This week in discussions - What is progressive enhancement? 40:13 This week in Q&A - Using setContext, context=module, and stores to solve stateful toggle groups
0:00 Introduction 0:41 Changelog - SvelteKit v1.15.1-1.15.5 4:03 Quick facts - learn.svelte.dev, svelte stores do not persist data, non-null assertions, accessible buttons 19:46 Community Showcase - SvelteLab 31:23 This week in discussions - What is progressive enhancement? 40:13 This week in Q&A - Using setContext, context=module, and stores to solve stateful toggle groups
Transform html asset relative path. Works with snowpack & webpack 5.
Transform html asset relative path. Works with snowpack & webpack 5.
GitHub repository: enyo/use-vest
Rich joins us to talk about recent developments in the Svelte and Kit repos.
Rich joins us to talk about recent developments in the Svelte and Kit repos.