Firebase: fast protoyping 🔥

Date: 04.02.2021

When working on a new project, having to build separate frontend and backend system can delay progress significantly. Although the architecture will be cleaner (Separaton of Concerns) and not be a single monolith (especially when using a micro service architecture), having to build several systems including deploying each of them can be tedious. This also includes managing databases and hostong the final product.

Building on top of Firebase can ease the pain of having a database (Firestore) and how to host the system. In addition, Firebase also offers Functions, that allow to execute code without having to manage hardware. This for example can be used to run a background application.

When I got aware of Firebase and the ease of using it in a React Webapp via: React Firebase Hooks, I decided to give it a try for a refreshed Readlist App. This time building all the logic in React instead of having a dedicated backend system. In order to not allow unintended access, I used Firestore Security Rules to restrict access to the readlists created.

The drawback of this approach is that all logic lives in the frontend. E.g when loading all lists of a user, the frontend needs to be aware that a user can bei either the owner of a readlist or a collaborator. This required having 2 separate calls in the frontend to retrieve all readlists and merging the results. With a dedicated backend this logic would reside there, thus sparing the frontend from having to know about this distinction (Separaton of Concerns).

The positive effect however was, that I could prgress much faster than having to build separate systems. The effort for setting up the webapp was minimal and accessing the database with the security rules was done is a second (setting up the rules took a bit longer, but as the DB and the rules are tightly coupled it was frictionless). By not having the focus on separate systems, I could immediately work on a new feature and deliver it from the UI to the DB in one go. No redeployments or whatsoever needed.

Firebase also had an easy integration of using authentication providers such as Google, Facebook and others. It allows for an easy authentication setup to identify users.

The current state of the project can be found: https://readlist-6d595.web.app/. It is by far not completed yet UI-wise. However it supports all the intended functionality: creating new readlists, sharing with others and adding items to the readlist.

Happy coding ✌️