RealTime-Todo-App-SvelteKit-Firebase-Example Svelte Themes

Realtime Todo App Sveltekit Firebase Example

A low effort (HTML-wise) example app to help me (and you) understand firebase and how it works in sveltekit

Firebase (Firestore) + SvelteKit RealTime Todo List App Example

This is a small, low-effort project to understand what firebase is, how it works and how you can use it in sveltekit. Of course, this is a very bare bones implementation but the key ideas and syntax is there.

Hopefully this helps someone out there cause god knows the docs suck balls and are outdated from what I could tell. In this app, you will see how you can implement real-time data flow with onSnapshot while also mainting proper UI state and eliminating any flickering or whatever issues may pop up.

The "tricky" part of Firebase is that it's designed for the client to use, NOT the server. If you tried to have a server-side only file do Firebase stuff (like me), then you didn't understand this fact. But mistakes are part of the learning process. Feel free to look at the code or even write it down yourself if you are also struggling with understanding some of these concepts/tools.

As for setting up Firebase: You can follow the steps they give you and you will be fine. When creating your database, you should do so in test mode and not production mode. Test mode has no security afaik, but it's obviously the way to go for prototypes or just learning the tool. Good luck.

This was created with vite and I highly recommend it. In case you weren't using it already, you are missing out to say the least!

Top categories

Loading Svelte Themes