Firebase Techtalk
October 18, 2019
Today I gave a tech talk to my colleagues at NewOrbit.
This was the first tech talk I have ever done, but I was really excited about doing it for the experience.
My talk was on Google’s Firebase and how I have used it in personal projects outside of my work at NewOrbit. But I also wanted to start a conversation about how we might be able to utilize Firebase at NewOrbit for reasons I will go into further down.
The talk consisted of me giving a presentation about what it is and what it does which I will include at the bottom of this post, but the second part of my talk, was the interactive part. I created a small app which the team could fork and put their own Firebase Config into allowing them to quickly interact with some of Firebase’s features and get a feel for how easy it is to get started.
This very basic app using Typescript and React (using hooks) can be easily wired up to any firebase account (details of how to do this can be found in the README of the repo) and upon running the app you can immediately see how authentication can be used to stop unauthorized access and how the subscription to a firestore collection works.
This subscription is one of the biggest selling points of Firebase for me. It allows you to listen for changes to a collection of documents so if you have a list of data on screen on one device and you make changes on another device, the changes will be updated and rendered almost immediately on the first device.
You can find the repo here
Firebase is a part of the offerings from the Google Cloud Platform (GCP).
It can be used as a “backend” when you want to get an idea up and running quickly.
It takes away some steps in creating an app service because you don’t have to worry about implementing authentication, API, or a database. You can just get on with creating a beautiful app that does something.
This is particularly useful for prototyping as you can make something that can demo functionality really quickly.
Apps that are prototyped using this can easily be refactored to use other services later, once the Customer has agreed to the project.
These are just some of the features available in Firebase…
I needed to create something quickly.
I needed somewhere to store data for my React app and wanted to host this as cheaply as possible (with Firebase I am able to do this completely free of charge)
I didn’t want to spend hours of my time re-inventing the wheel for a small app with only a handful of users.
So one of the biggest selling points of Firebase is the fact that it allows you to set up something super quickly and easily.
It’s really great for providing a simple app with a simple API to demo front end capabilities and sell a project to a potential… it’s a lot easier for a customer to buy into something they can see.
When you need to build a commercial app with the ability to scale it’s probably best to use something like we do with Azure.
There are obvious drawbacks to being on the free tier with limits, although moving to a higher tier plan can solve this…
It’s ideal if you are happy being in the GCP world, but it’s not the best to integrate with other service so if you need more capabilities than it has to offer, it’s probably best to choose something else.
Someone asked me, whilst we talking about Firebase, why should he choose this over MongoDB or something else… and my answer to this is the fact that Firebase offers a lot more than just a document database but this alongside the authentication service with lots of options, functions (which run off of express and you can even use them to create your own express applications which can be run using Firebase functions) fantastic support for Android and iOS development (if mobile is your thing) and web with a comprehensive Javascript SDK to interact with the services.
Also other things that I haven’t even tried yet are the analytics and ML capabilities…
All this, plus the fact that it’s Google and y’know Google are massive and we use Big Tech technology like Facebook’s React all the time.
To use Firebase in a React app all you need to do is add the following code to initialise it.
By exporting the auth and db objects as I have done at the bottom, you can use them anywhere in your app.
This hook creates a subscription to a collection meaning it is actively listening to the collection for changes, if a document is added, removed or changed while this listener is active the data object returned from this hook will be updated automagically.
If you are running the app on 2 different devices and you change something on the first, those changes are reflected on the second device almost immediately.
Sean Barnard, software developer at Innovyze.