The Back End of the Front End

The Back End of the Front End

I built two movies databases. First I made a MEAN stack movies database, with Node, Express, and MongoDB as the server and database (the back end) and Angular in the browser (the front end).

Next I made a Firebase and Angular movies database. Firebase is a NoSQL cloud database. You can see that the AngularFire movies database loads data (the movie posters) faster.

What you won't notice immediately is that if other users are online, the movies they add immediately appear in your Firebase app, but not in the MEAN stack app. This is because Firebase has data binding. Changes in the browser (e.g., adding a movie) immediately update the remote database, and vice versa.

I became interested in Firebase when I built a collaborative JavaScript app for my Galvanize capstone project. I made a tic-tac-toe game with presence and WebRTC video. Users could go to the website, select from a list of available partners, open a video conferencing window, and then open a tic-tac-toe game. When I play an X in my view, my X appears in your view; and when you play an O it appears simultaneously in both views.

In contrast, the MEAN stack operates with HTTP requests. User action in the browser sends an HTTP request to the server, which translates the HTTP request into a database query, then sends the data to the browser in an HTTP response. If the user doesn't take action the back-end database has no way to send updated data to the browser. You won't see the X that I played unless you refresh your browser.

Coding with Firebase is easier. You don't have to set up Node, Express, and MongoDB, with back end routes, etc. That saves a few hours on each project, plus there's nothing to maintain and no server crashes.

On the front end the Firebase code is simpler than the MEAN stack back end code and front end code. Instead of sending HTTP requests and responses you synchronize local arrays and objects to remote arrays and objects.

You can also see that the Firebase movies database has authorization and authentication ("auth") using OAuth2 with Google, Facebook, Twitter, and GitHub, plus old-school e-mail and password login, plus anonymous login. The auth functions are provided by Firebase and are easy to implement. To do all this in the MEAN stack would take you forever. 

Firebase isn't the only server-less cloud database. RethinkDB is designed for reactive programming with data subscriptions, i.e., data that constantly changes and updates the view, such as an app showing your pizza driver's GPS positions. I'm also interested in PouchDB, which is a database that runs in the browser. IMHO, the back end of the front end is the most exciting area of software development today.

To view or add a comment, sign in

More articles by Thomas David Kehoe

Explore content categories