Svelte & Django CRUD App 2 - Svelte Events / Manipulating the Store / Svelte Layouts

Playlist ▶️: https://www.youtube.com/playlist?list=PL-2EBeDYMIbQ2lx2wgi9cplRAd_EEorIS

Github: https://github.com/bugbytes-io/svelte-django-video

In this video, we extend the previous example and show how to work with DOM events in Svelte (click, submit, etc). We will see how we can integrate event handlers with our Svelte Store, and update the items in the store.

We'll also learn how to use Svelte Layouts, by defining +layout.svelte files in our routes. Finally, we'll add Bootstrap to the app and add some basic styling at the end of the video.

☕️ 𝗕𝘂𝘆 𝗺𝗲 𝗮 𝗰𝗼𝗳𝗳𝗲𝗲:
To support the channel and encourage new videos, please consider buying me a coffee here:
https://ko-fi.com/bugbytes

📌 𝗖𝗵𝗮𝗽𝘁𝗲𝗿𝘀:
00:00 Intro
02:22 Adding objects to Svelte Store
07:08 Creating Form Component in Svelte
10:34 Form Submit handler and event modifiers in Svelte
14:54 Redirecting after submit with goto() function
18:30 Defining page structure with +layout.svelte file
25:30 Styling the app pages

▶️ Full Playlist:
https://www.youtube.com/playlist?list=PL-2EBeDYMIbQ2lx2wgi9cplRAd_EEorIS

𝗦𝗼𝗰𝗶𝗮𝗹 𝗠𝗲𝗱𝗶𝗮:
📖 Blog: https://bugbytes.io/posts/
👾 Github: https://github.com/bugbytes-io/svelte-django-video
🐦 Twitter: https://twitter.com/bugbytesio

📚 𝗙𝘂𝗿𝘁𝗵𝗲𝗿 𝗿𝗲𝗮𝗱𝗶𝗻𝗴 𝗮𝗻𝗱 𝗶𝗻𝗳𝗼𝗿𝗺𝗮𝘁𝗶𝗼𝗻:
Github: https://github.com/bugbytes-io/svelte-django-video
Svelte Store: https://svelte.dev/docs/svelte-store
Svelte Event Modifiers: https://learn.svelte.dev/tutorial/event-modifiers
SvelteKit goto() function: https://kit.svelte.dev/docs/modules#$app-navigation-goto
Svelte Project Structure: https://kit.svelte.dev/docs/project-structure
Svelte Layouts: https://learn.svelte.dev/tutorial/layouts
Svelte Server Routes: https://kit.svelte.dev/docs/routing#server

#python #django #webdevelopment #svelte #sveltejs

Видео Svelte & Django CRUD App 2 - Svelte Events / Manipulating the Store / Svelte Layouts канала BugBytes