Integrating Storybook with SvelteKit
Brittney will work on getting storybook integrated with SvelteKit.
Integrating Storybook with SvelteKit
Brittney will work on getting storybook integrated with 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
Brittney will work on getting storybook integrated with SvelteKit.
Brittney will work on getting storybook integrated with SvelteKit.
A Svelte component which uses the CDNs to serve responsive images.
A Svelte component which uses the CDNs to serve responsive images.
- NFT Marketplace with Svelte and Magic - Build reliable Svelte applications using Cypress - Building a custom elements library for videochat with Svelte's Web Components support
- NFT Marketplace with Svelte and Magic - Build reliable Svelte applications using Cypress - Building a custom elements library for videochat with Svelte's Web Components support
Join GHOST for our Second Svelte Sirens event as she shows you the magic of Routify in Svelte Kit. Take a look at the links below to find out more about Routify, Svelte Kit, Svelte Sirens, and GHOST!
Join GHOST for our Second Svelte Sirens event as she shows you the magic of Routify in Svelte Kit. Take a look at the links below to find out more about Routify, Svelte Kit, Svelte Sirens, and GHOST!
A powerful Svelte wrapper component around the CodeSandbox editor embed.
A powerful Svelte wrapper component around the CodeSandbox editor embed.
Dominik G's video, part 2 of 'Sveltable Vector Graphics,' explores optimizing SVG icon components using the Svelte preprocessor.
Dominik G's video, part 2 of 'Sveltable Vector Graphics,' explores optimizing SVG icon components using the Svelte preprocessor.
Talks: - Routify 3 (Jakob Rosenberg and GHOST/Willow) - SvelteKit and the Content Layer (Scott Spence) (A brief look at the history of content on the web and beyond and how SvelteKit can leverage the technology where we are now) - Sveltable Vector Graphics Part 2 (Dominikg) - Our Journey in bringing Svelte to enterprise
Talks: - Routify 3 (Jakob Rosenberg and GHOST/Willow) - SvelteKit and the Content Layer (Scott Spence) (A brief look at the history of content on the web and beyond and how SvelteKit can leverage the technology where we are now) - Sveltable Vector Graphics Part 2 (Dominikg) - Our Journey in bringing Svelte to enterprise
Rich Harris opens Svelte Summit with a short discussion and highlights some key moments and happenings throughout the years. Enjoy!
Rich Harris opens Svelte Summit with a short discussion and highlights some key moments and happenings throughout the years. Enjoy!
SEO health is a crucial, yet often-overlooked aspect of our web applications' success. It can be the difference between pet-project and an extra source of income! This presentation will cover the core SEO basics every developer should know and introduce some tooling to help ensure your projects are setup for success.
SEO health is a crucial, yet often-overlooked aspect of our web applications' success. It can be the difference between pet-project and an extra source of income! This presentation will cover the core SEO basics every developer should know and introduce some tooling to help ensure your projects are setup for success.
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.
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.
When Svelte came on the scene in 2016 it was fully embraced by Itslearning for all frontend. With every new Svelte version parts got rewritten, so let's compare the same page, doing the same thing over the three Svelte versions.
When Svelte came on the scene in 2016 it was fully embraced by Itslearning for all frontend. With every new Svelte version parts got rewritten, so let's compare the same page, doing the same thing over the three Svelte versions.
SvelteKit gives developers the ability to do more with less. Less code, less energy, and consequently less time. More so, it gives you all the SEO benefits of single-page applications with client-side routing for almost instant navigation. Talk about the best of both worlds. With the techniques we'll discuss in this talk, you'll learn how to get the best of SvelteKit and unlock the superpowers you never knew you had
SvelteKit gives developers the ability to do more with less. Less code, less energy, and consequently less time. More so, it gives you all the SEO benefits of single-page applications with client-side routing for almost instant navigation. Talk about the best of both worlds. With the techniques we'll discuss in this talk, you'll learn how to get the best of SvelteKit and unlock the superpowers you never knew you had
Talks: - Intro to SvelteKit (Ekene Eze, Netlify) - Test Driven Development with Svelte (Basar BK) - SEO for Developers (Nick Reese, Luke Edwards) - 5 years of Svelte at Itslearning (Stéphane Vanraes, Bouvet)
Talks: - Intro to SvelteKit (Ekene Eze, Netlify) - Test Driven Development with Svelte (Basar BK) - SEO for Developers (Nick Reese, Luke Edwards) - 5 years of Svelte at Itslearning (Stéphane Vanraes, Bouvet)
The other side of SvelteKit
After failing to learn React, Svelte swooped in to rescue my frontend learning journey by allowing me to build things fast. Its syntax was simple and its mental model intuitive. Though there is much gnashing of teeth over web development neophytes skipping the fundamentals and going straight to frameworks, I will make the case for why starting Svelte helped changed the arc of my career.
After failing to learn React, Svelte swooped in to rescue my frontend learning journey by allowing me to build things fast. Its syntax was simple and its mental model intuitive. Though there is much gnashing of teeth over web development neophytes skipping the fundamentals and going straight to frameworks, I will make the case for why starting Svelte helped changed the arc of my career.
We rewrote our entire platform on Svelte. In this talk, I'll cover the practical techniques, lessons learned and tips and tricks for anyone considering a move.
We rewrote our entire platform on Svelte. In this talk, I'll cover the practical techniques, lessons learned and tips and tricks for anyone considering a move.
Learn about what a design system is, how to structure your code, and the SvelteKit package command.
Learn about what a design system is, how to structure your code, and the SvelteKit package command.
Plenti is a free and open source static site generator for Svelte. Its simple design makes it great for beginners who are trying to break into tech, but it's also powerful and extremely fast for devs who need to be hyper-focused on being productive. Plenti takes care of common things you need for building websites, including connecting your Svelte components to a data source, client routing, hydrating to a single page app (SPA), and creating HTML fallbacks for each page to improve performance and SEO.
Plenti is a free and open source static site generator for Svelte. Its simple design makes it great for beginners who are trying to break into tech, but it's also powerful and extremely fast for devs who need to be hyper-focused on being productive. Plenti takes care of common things you need for building websites, including connecting your Svelte components to a data source, client routing, hydrating to a single page app (SPA), and creating HTML fallbacks for each page to improve performance and SEO.
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.
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.
Excited to use Svelte, but stuck maintaining a huge React or PHP application? You don't have to rewrite your whole application to get started using Svelte! In this session you'll learn some techniques for adding Svelte to any web project. You'll also see how to reuse your existing JavaScript widgets inside your Svelte components, whether they are React components, or even ancient jQuery plugins!
Excited to use Svelte, but stuck maintaining a huge React or PHP application? You don't have to rewrite your whole application to get started using Svelte! In this session you'll learn some techniques for adding Svelte to any web project. You'll also see how to reuse your existing JavaScript widgets inside your Svelte components, whether they are React components, or even ancient jQuery plugins!
A fresh take on icon libraries.
A fresh take on icon libraries.
Vest is a powerful form validation framework inspired by the syntax and style of unit testing libraries like Mocha or Jest. It uses their declarative structure and makes it easy to write complex form validations that are also easy to read and maintain.
Vest is a powerful form validation framework inspired by the syntax and style of unit testing libraries like Mocha or Jest. It uses their declarative structure and makes it easy to write complex form validations that are also easy to read and maintain.
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.
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.
In this talk I'll show you how you can use Primo (an open-source desktop app) to quickly build interactive, easily editable websites using Svelte. In the process I'll demonstrate how Svelte's powerful features enable both Primo's component-driven development & lean, accessible, fast-loading static sites.
In this talk I'll show you how you can use Primo (an open-source desktop app) to quickly build interactive, easily editable websites using Svelte. In the process I'll demonstrate how Svelte's powerful features enable both Primo's component-driven development & lean, accessible, fast-loading static sites.
With no boilerplate code and little Svelte-specific syntax, Svelte feels just like vanilla JavaScript, making it a great framework for beginners to easily pick up. While it is beginner friendly, it does not sacrifice any best practices or features. In fact, Svelte can do everything other popular frameworks can do and more. Because of this, it is more than just a good starting point for beginners.
With no boilerplate code and little Svelte-specific syntax, Svelte feels just like vanilla JavaScript, making it a great framework for beginners to easily pick up. While it is beginner friendly, it does not sacrifice any best practices or features. In fact, Svelte can do everything other popular frameworks can do and more. Because of this, it is more than just a good starting point for beginners.
This talk is focused on a better understanding of Svelte's reactivity. We will do this from an "observer perspective" - by visualizing it first-hand (right in your application)!
This talk is focused on a better understanding of Svelte's reactivity. We will do this from an "observer perspective" - by visualizing it first-hand (right in your application)!
In this talk, we'll discuss how we can let content creators keep the excellent editorial workflows that WordPress provides, while leveraging Svelte on the frontend to provide a phenomenal user experience.
In this talk, we'll discuss how we can let content creators keep the excellent editorial workflows that WordPress provides, while leveraging Svelte on the frontend to provide a phenomenal user experience.
Svelte includes built-in animations that makes it easy to slide, scale, and fly elements in and out of the DOM. However, you need to be careful to not trigger motion sickness in your users. I will go over which Svelte transitions could cause accessibility issues and how to respect user motion preferences when using them.
Svelte includes built-in animations that makes it easy to slide, scale, and fly elements in and out of the DOM. However, you need to be careful to not trigger motion sickness in your users. I will go over which Svelte transitions could cause accessibility issues and how to respect user motion preferences when using them.
0:00 Prelude 20:00 Start 29:00 Where Do I Begin? 38:00 Documentation 42:55 Svelte's Reactivity 1:12:34 primo - building and managing static sites 1:21:54 Guillermo Rauch - Vercel + Svelte 1:32:30 Svelte transitions and accessibility 1:43:06 Custom Svelte stores 1:49:30 Headless WP and SvelteKit 2:17:15 Islands architecture and Jamstack 3:16:35 Scott Tolinski - From React to Svelte 3:50:45 Svelte Sirens 3:56:00 Rich Harris discusses creating libraries with SvelteKit 4:07:18 State Machine meets Svelte component (svelte-fsm) 4:21:50 Small steps lead to big leaps 4:32:30 Coding with Jesse 4:59:00 Plenti, a minimalist JAMstack framework and Theming 5:07:00 Kevin, Robert, Rich 5:08:55 Svelte and Vest Form Validation Framework 5:30:04 Icon libraries
0:00 Prelude 20:00 Start 29:00 Where Do I Begin? 38:00 Documentation 42:55 Svelte's Reactivity 1:12:34 primo - building and managing static sites 1:21:54 Guillermo Rauch - Vercel + Svelte 1:32:30 Svelte transitions and accessibility 1:43:06 Custom Svelte stores 1:49:30 Headless WP and SvelteKit 2:17:15 Islands architecture and Jamstack 3:16:35 Scott Tolinski - From React to Svelte 3:50:45 Svelte Sirens 3:56:00 Rich Harris discusses creating libraries with SvelteKit 4:07:18 State Machine meets Svelte component (svelte-fsm) 4:21:50 Small steps lead to big leaps 4:32:30 Coding with Jesse 4:59:00 Plenti, a minimalist JAMstack framework and Theming 5:07:00 Kevin, Robert, Rich 5:08:55 Svelte and Vest Form Validation Framework 5:30:04 Icon libraries
2:46:48 - Svelte Can Compile and so can you! 2:54:48 - Svelte Without the JavaScript (Full talk) 3:22:49 - Design Ñgineering 3:50:52 - Quiz time!! 4:07:43 - Compile for accessibility with Svelte 4:17:34 - Reactive Forms 4:29:57 - Building the Next Generation of Low Code with Svelte (Full talk) 4:55:54 - Zwoosh YEAHHH Shabam! 🤯 Whimsy in motion (Full talk) 5:18:21 - An update on SvelteKit 5:49:34 - End notes and Discord Stage hangout!
2:46:48 - Svelte Can Compile and so can you! 2:54:48 - Svelte Without the JavaScript (Full talk) 3:22:49 - Design Ñgineering 3:50:52 - Quiz time!! 4:07:43 - Compile for accessibility with Svelte 4:17:34 - Reactive Forms 4:29:57 - Building the Next Generation of Low Code with Svelte (Full talk) 4:55:54 - Zwoosh YEAHHH Shabam! 🤯 Whimsy in motion (Full talk) 5:18:21 - An update on SvelteKit 5:49:34 - End notes and Discord Stage hangout!