Build a Reactive Search Filter with Svelte
If you find my content useful and want to support the channel, consider contributing a coffee ☕: https://hbyt.us/coffee
In this video, I demonstrate how to add reactive search and filtering functionality to your Svelte application.
SvelteKit is a framework for building modern, high-performance, browser-based applications. It was developed by the team behind the popular Svelte framework and is powered by Svelte. Unlike other JavaScript frameworks, it doesn't use a virtual DOM or deliver a bloated and slow application.
⭐ Starting Code
StackBlitz: https://stackblitz.com/github/huntaby...
GitHub: https://github.com/huntabyte/svelte-s...
📁 Final Source Code
StackBlitz: https://stackblitz.com/github/huntaby...
GitHub: https://github.com/huntabyte/svelte-s...
📚 Resources Mentioned:
DummyJSON: https://dummyjson.com
🚀 Become a channel member: https://hbyt.us/join
💬 Discord: https://hbyt.us/discord
🐦 Twitter: https://hbyt.us/twitter
🖥️ Setup Stuff: https://hbyt.us/gear
🔖 Chapters:
00:00 - What we're building
00:32 - Determining Search Properties
01:40 - Make Data Searchable
03:00 - Setup Search Store
05:55 - Search Handler
08:30 - Store Subscription
10:00 - Search Input Functionality
12:30 - Make TypeScript Happy
15:30 - Wrapping it up
📃 Topics Covered:
Svelte Stores
Search with Svelte
Filtering with Svelte
How to search with Svelte
How to filter data with Svelte
How to use Svelte Stores
Reactive Search Svelte
Search bar in Svelte
What is SvelteKit?
SvelteKit Search
SvelteKit Tips
Svelte Tips
__________________________________________
(Affiliate links may be included in this description. If you choose to purchase a product from one of those links, I may receive a small commission at no cost to you. Thank you for supporting the channel!)