Understand How Data Flows Through SvelteKit

Learn how data weaves and flows in your SvelteKit app.

👉️ Support

▶️ YouTube Membership

🔴 Patreon

👉️ Links:

SvelteKit Data Flow

👉️ Uses:

👉️ Socials:

🔖 Timestamps

0:00 Intro
0:37 What Each File Related To Routing Does
3:20 Going Through My Setup
4:09 Understanding The Order In Which Things Run
7:03 SvelteKit Does Server-Side Rendering (SSR) And Client-Side Routing (CSR)
9:34 How Data Is Passed Through Routes
13:01 Accessing Parent Layout Data
14:25 $app/stores
18:54 Adding Custom Data To A Request
20:32 Standalone Endpoints
21:38 Form Actions
23:44 SvelteKit Data Flow Cheat Sheet
25:28 Outro

#svelte #sveltejs #dataflow

[noaudiochannel]

The amount of value in your content is crazy. It feels like I am always learning something new in these videos. Keep these videos coming.

[SaidElnaffar]

This is a GEM video -- each second in this video counts!!!! It should be part of the official documenation of SvelteKit!

[rickhoro]

Brilliant presentation of data flow in svelte. I have trouble with your videos because you move so fast, lol! I have to run them at .75X speed, but I will use this as a reference if I have to review this in the future. Thank you for doing this and providing the code so we can play with it ourselves.

[BeepBloopNoop]

Great content as usual! Laying it out in digestible formats AND an article to read for more review. Premium stuff here!

[AakashGoplani]

I am still finding it hard to understand role of +[file].server.ts and +[file].ts (where file -> page / layout).

+[file].server.ts => executes codes on server side which means if I have any logic that I want to server-side render, I'll pick this file. This much is clear to me.

+[file].ts => executes code on both server and client. I don't understand purpose of this file. If I want certain piece of logic to execute on server, I will use +[file].server.ts & if I want that logic to execute on client side, I could use any of svelte life-cycle hook. This would save me from repeatedly checking if (browser) { .. }

Can anyone help me clear this thought process.

[kazagi]

i spend a tons of time to find how the data flow is but i dont understand that clearly and bommm u made it in 25mins . Thank u <3

[simonnice]

I love Svelte and Sveltekit. I work with it daily and I can't imagine a stack without it.

[simonphumin]

Thank you so much for this video. Especially the explanation what every file does is sooo crucial to understand when getting into Svelte & SvelteKit.

[Allformyequine]

I love you are reviewing things that confuse or trip people up when developing with SvelteKit!! You rock! Keep them coming!

[alrojohnmercado]

Can you please do the Prisma Postgresql and supabase storage to image upload and fetching

[danibri]

Very good video !! Continue like this 🔝🔝

[rod]

Head spinning but very helpful - thanks!

[fleq]

This is my favorite video so far for sure. I tested this myself to learn, because understanding this is essential imo to develop properly. Helped me clear up a lot of doubts I still had. Thank you!

[RodrigoDAgostino]

I’m honestly really grateful to you for all the effort you put in your content. It’s amazing how you find ways to put complicated things in very simple terms and illustrate them in a very friendly way :) Just don’t rush so much! xD

[suvrotica]

Love your stuff. Did you see vercel has new storage option. Could you make a video on that.

[funnynews]

The heart of sveltekit in this video, SPA and SSR all here, thank you so much!

[phoneywheeze]

still didnt understand use:enhance. Maybe a comparison video that illustrates with and without use:enhance would help!

[omomer]

So what about if you are doing a get request inside your svelte component, is it the very last thing thst will run?

[marcosissler]

Hey @JoyofCode! I have a new project in Svelte that is still in V1.0 and new, not so big. Do you think is a good practice to use TS in the project? I am not using at this moment. But as the project get bigger, I can see now, maybe is a good one to change it to TS use.

[marcosissler]

Amazing content. I was working with Svelte and now it's like a new a refresh. I finally understand how data works and pass throw the layers. Love Svelte even more. You can construct applications really fast. Simple ones.