Recently a new client asked to redesign an old application that was built around 2010. They want to rebuild the application with modern technology and, before they started developing, asked me to look at the current UX/UI. The budget and time were limited, so I focused on the quick-wins. The application helps doctors to appoint hospitals rooms/beds to patients. The doctor can make an event for a room that will ‘host’ a patient for a certain date. Below is the old agenda-view with example-data of such events.

The main functionalities of the current system for this screen are:

• Switching between…

In my last story, I described how to implement an authentication system with Sapper and Firebase Auth on the client-side. An alternative way is to use server-side sessions with the help of Firebase Admin and the Firebase REST API. Before I show you some code, a little background story about the idea behind this authentication flow.

0. Overview & explanation

Developing an authentication system with Firebase can be done in two ways: handling the session client-side or make it use your own session-based back-end. Some advantages of using Back-End only are:

• No front-end bloat (saving precious KB's…)
• Secure (when done right). The user won't…

While it's great to work with Firebase and Sapper separately, joining these two can be a bit of a hassle. It took me a few days to figure out how to implement an authentication system with Firebase and Sapper which met the following criteria:

• No flash of content (due to redirects or page protections).
• Protected routes are still available when an authenticated user refreshes the page.
• SSR (server-side rendering) still works when the firebase token expires and refreshes.

This tutorial will be barebone and quick since I myself don't like long fancy tutorials. So strap in and learn with me.

Step 0: Sapper installation

…