Useful Snippets

Welcome!


This blog is used to collect useful snippets related to Linux, PHP, MySQL and more. Feel free to post comments with improvements or questions!

Are your smart devices spying on you? Make better purchasing choices and find products that respect your privacy at Unwanted.cloud

RSS Latest posts from my personal blog


Most viewed posts


Subscribe to RSS feed


Chat application using SvelteKit + Firebase

Stanislav KhromovStanislav Khromov

If you are interested in integrating SvelteKit with Firebase, have a look at the one-source chat application linked below.

Once you load the page, the Firebase SDK will trigger on the client and sign you in anonymously. You will get a random name (via the unique-names-generator package) and avatar (via dicebear/avatars). These are persistent and based on your unique Firebase identifier.

CSR, SSR, WTH? If you look inside +page.ts you will find that we set export const ssr = false;. This means we are disabling server side rendering on root route of the app which contains the chat.

The reason for this is that the Firebase SDK is adopted for the client side, it’s not meant to be run on the server.

If you want to create pages based on data in Firebase with Server Side Rendering you should use the Admin SDK which is adapted to run under Node. Keep in mind that you should always use the +page.server.ts file in this case, so that your code only runs on the server.

Repo https://github.com/khromov/firebase-sveltekit-chat

Demo https://f-kit-chat.vercel.app/

Screenshot:

Chat screenshot

Web Developer at Aftonbladet (Schibsted Media Group)
Any opinions on this blog are my own and do not reflect the views of my employer.
LinkedIn
Twitter
WordPress.org Profile
Visit my other blog

Comments 0
There are currently no comments.