My winter of hacking on Firebase with Google products and APIs
As a developer advocate with the Firebase team, I have the pleasure of traveling around the world to speak at developer events. In particular, I’ve had a lot of fun running hackathons for GDG DevFest events. Up until recently, I’ve not been involved with hackathons so much, but these events inspired me! Seeing the projects that people come up with in such short amount of time led me to spend some of my own weekends to learn new technologies and apply that by actually building something.
Since I’m with the Firebase team, I already know Firebase products very well. But there are other Google products and APIs that are new to to me, and I wanted to see if and how they work with Firebase. (Spoiler: they do very well!)
Note: The embedded tweets here have animated GIFs showing the action — be sure to click to watch them! Also click through to the tweets to get the source code in a Gist.
Firebase + Android Things
As a long time Android developer, Android Things is a natural fit for my expertise. It’s basically running a modified Android on IoT devices to keep them connected to each other, and cloud services. Firebase products are a really good fit for keeping apps connected, so I’ve always been curious to see how well that could work.
In November, the entire Firebase team took a week to hold an internal hackathon. With the help of my coworker Arthur, we built a “Firebase doorbell”. The idea was to use Android Things to build a connected doorbell with a companion app that lets homeowners provide access to their residence after someone “rings” the doorbell. Play the GIF in this tweet to see it in action:
I’m still tinkering with this one, and it’s going to be the subject of a talk I’m doing at another DevFest.
Firebase + G Suite Sheets
During the DevFest hackathon in Hamburg, my coworker Rachel noticed that the system that was established for submitting and judging projects was potentially confusing and cumbersome for the participants. She came up with a Sheets-based scoring system, and contemplated ways to automate much of the process by connecting Sheets to Firebase. This got me thinking about how you might actually write code to do that! So, I threw together this demo that shows how you can copy data from Firebase Realtime Database into a sheet automatically with Cloud Functions (written in TypeScript, another thing I’m learning):
It was incredibly fun to both write and play with! It also got me thinking more seriously about what it means to have a UI for your application. Your app may not need a traditional mobile UI at all. Maybe gluing together existing products with cloud services is easier and more effective!
Firebase + Android Architecture Components
When Android Architecture Components were fully released in November, I was really impressed with LiveData and ViewModel, and their ability to help you handle the Android Activity lifecycle much more effectively and efficiently. After building a simple Android app that’s connected to Firebase Realtime Database, I went through a series of code refactorings to integrate LiveData and ViewModel into that app. It turns out that the realtime nature of the database works very well with what lifecycle-aware Architecture Components offers. They even offer a framework that makes it easy to implement some significant boosts in performance. I ended up writing a three-part blog series about my findings on the Firebase Blog:
Firebase + Cloud Vision API
I spent some time over the holiday weekend to learn about the Google Cloud Vision APIs. They let you write code to do things like detect text and objects in pictures. I was interested in the label detection API to see how well it could pick up holiday-themed objects in a series of pictures. Here’s a web page I put together, backed by Firebase services and Cloud Functions, that lets you drag an image into it for detection:
Also in this project, I learned the HTML drag and drop API. It’s been a long time since I’ve done serious web development (2009!), so it was nice to pick up on some of the stuff that’s new on that front.
Firebase + Dialogflow + Cloud Translation API
Chatbots and assistants seem to be very popular these days, and Dialogflow makes it really easy to put one together, especially if you use Cloud Functions for Firebase to implement the fulfillment hook. I though it might be fun to implement a bot that does language translation with the Cloud Translation API, and hook it up through Slack. Here’s how it went:
This was was neat to me because the final product felt very powerful — and it ran fast!
No project idea is too small to start learning new stuff. My weekend hack projects have been about 100 lines of code or less. There’s a ton of services out there that make app development a breeze these days, so get out there and build stuff with them! Then tweet me at @CodingDoug on twitter and let me know what you build. If you build anything with Firebase and want to tweet about it, be sure to use the hashtag #BuiltWithFirebase.