There are tons of documentation out there that supports one’s desire to learn Angular JS The superheroic framework and Firebase which is also developed and maintained by Google, but for this article, I’ll talk about the advantages and simply what it’s like developing and AngularFire (Angular + Firebase) Application.
Now let’s dive into the basics first. In creating a website we usually consider these 3 things. The Look and Feel, The Functionality, and the Storage. In development terms, these are front-end, back-end, and the database.
Nowadays we hear the word Realtime get thrown out a lot, but what does it really mean and how does it affect web development in general? Well, for a web app to be real time basically means that when a user does something, say an action or request, the web page should respond right away without having to reload the whole page. Before this was not the case, web pages would usually need to reload to reflect the changes.
With the introduction of AJAX, however, pages today are more responsive to users actions. Though many frameworks supply this feature by default none do it as good as AngularJS, which is why it is one the most popular frameworks being used today.
“Angular.js is often referred to as an MVW (Model-View-Whatever) framework and among the top benefits, for startups and mid-sized companies, people name: quick code production, easy testing of any app part and two-way data binding (changes in the backend are immediately reflected on the UI). Since release, its ecosystem has gone beyond imagination. As for now, it is reasonably called the most used JS framework for SPAs (Single-Page Applications) development and it boasts the largest community of developers.” – Hacknoon.com on top JS Frameworks to use in 2017
How awesome is that? If you’re starting out learning web development AngularJS is a good place to start because of its large community and support any questions you may have during your learning stage will definitely have an answer, trust me from experience there’s always an answer for the typical programmer questions, you just need to dig deeper if you can’t find it.
That’s about it for Angular, now moving on to Firebase. Woah! An online Database powered by Google with built-in functions that you can use to store, edit, and remove data? Including a built-in authentication system and a rule-based data storage that keeps your valuable data safe and secure? COUNT ME IN. Firebase has always amazed me with the things that it can do, with the right amount of tweaks here and there a developer can go a long way with Firebase. Out of the box, it’s simply a database that you can manage online without having to install a single thing on your computer. All you need is a Google account you’re good to go.
So we have these 2 amazing technologies working together, now it’s time to talk about how well they play together. So for a newcomer to AngularFire what would you expect? Well if the website was a show, then AngularJS would be the performers wowing the audience with their performance and firebase would be the crew behind the scenes helping the performers with their pre-stage preparations.
AngularFire makes your life easier by providing all the needed backend functions to communicate with the database, this doesn’t mean that you’re all in the clear in terms of backend though, the logic of how you would like to save your data and secure it will still be up to you.
Data binding made even better
When pulling data from firebase, you would usually assign these data to either $firebaseObject or $firebaseArray to $scopes. The great thing I love about angular is that when these data are updated in firebase they automatically update in the $scope and view as well. Making it a breeze to create chat features and on time newsfeed updates.
Makes you improve how you structure data in general
One big problem you will face when developing with AngularFire is handling the data that you store. Sometimes you would only want to get a specific set of data but because of how you structure the Database you end up getting the data in bulk and picking out the one that you need, to avoid this problem Firebase encourages you to plan ahead and make sure that your data objects are well realized and contain all its necessary information.
Awesome free storage
Firebase gives you file storage out of the box for free, although this comes with a 1gb per day limit on uploads, it’s way more than enough to get you started with exploring this functionality. Did I also mention that these files include a download link? Perfect for creating file uploads that site visitors can download.
Sign up functionality is now a breeze
There’s more to discover with AngularFire and the more time you spend with it the more you learn and improve along the way. As a web developer, you should always look for ways to improve. Working code isn’t where it ends, that’s where it begins.