Building Applications with Angular, Firebase, and AngularFire

AngularFire is a simple and elegant API for using Firebase in Angular applications. This course will teach you the fundamentals of working with AngularFire, as you build a complete, functioning app from start to finish.
Course info
Rating
(42)
Level
Intermediate
Updated
Apr 6, 2016
Duration
2h 37m
Table of contents
Description
Course info
Rating
(42)
Level
Intermediate
Updated
Apr 6, 2016
Duration
2h 37m
Description

Firebase is a real-time NoSQL Backend as a Service. Angular is the most popular front end MVC framework. Put the two together and you've got magic. AngularFire was written by the Firebase team to create a simple and elegant API for using Firebase in your Angular applications. It makes authentication a breeze, and allows amazing three-way data binding. By the end of this course, you'll have created a fully functional app, and be ready to start developing an app of your own using Angular, Firebase, and AngularFire.

About the author
About the author

Joe has been a web developer for the last 13 of his 16+ years as a professional developer. He has specialized in front end and middle tier development . Although his greatest love is writing code, he also enjoys teaching and speaking about code.

More from the author
Angular Fundamentals
Intermediate
9h 35m
Feb 1, 2019
Angular Crash Course
Intermediate
58m
Nov 1, 2018
Unit Testing in Angular
Beginner
3h 20m
Sep 6, 2018
More courses by Joe Eames
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hey everybody. I'm Joe Eames and welcome to my course Building Applications with Angular, Firebase, and AngularFire. I am a developer and conference organizer and I'm super excited to present this course to you. Firebase is a blazing fast, real-time, no SQL backend as a service. Angular is an amazing framework and AngularFire brings the two of them together with a smooth and elegant API. In this course we're going to learn how to build applications with AngularFire by building a real app and seeing how to apply it in a realistic scenario. While we're at it we'll learn real how-to's of using AngularFire in your applications, and also we'll learn all the basics we'll need to use Firebase as well. The major topics we're going to cover are authentication with Firebase, reading & writing list data with the Firebase array service, and reading & writing non list data with the Firebase object service. By the time we're through you'll be confident in hooking up your Angular applications to a Firebase back end. Before starting the course you should be familiar with JavaScript and Angular. Although don't worry, you're not going to have to be an expert. I hope you'll join me on this journey to learn AngularFire with the Building Applications with Angular, Firebase, and AngularFire course at Pluralsight.

Firebase Basics
In this module we're going to look at some of the basics of Firebase. This will be a fairly quick introduction. If you're interested in learning more about these topics my course on the fundamentals of Firebase is a great place to get a deeper look into Firebase itself. I'm going to mention this fact a few times throughout this section, that my course on Firebase has a lot more information. So don't feel like I'm a broken record, there just happens to be a lot of things that we're only going to touch on briefly in this course, that is covered in a lot more depth in my Firebase Fundamentals course. The agenda for this section is as follows, after this introduction we'll look at how to manager a Firebase application, we'll learn the basics of the Management Console, how to manually add and change data and how to navigate around. Then we'll learn how data works and Firebase. Firebase has a few unique things you'll want to learn about how it handles data. Lastly, we'll learn the basics of how Firebase handles security, and the essentials of how you can manager security in your Firebase. It's a good idea to look at a typical architecture for an application that uses Firebase as its data store. Although you can have just a client and Firebase as the backend, with all but the most simple of applications you'll want to have a server. And there will be logic you'll want running on that server and even though most of your data access may be directly between your client and your Firebase, there will definitely be some needs for your server to access Firebase as well. The application we'll build, won't deal at all with the server. But it's not a terribly difficult task to do, once you learn Firebase. One last thing I want to cover in this section is the word Firebase and how it's used. Firebase is often referred to as the service that is provided for users, as in "I'm going to sign up for Firebase". But the way it should be used and the way you'll often hear me use it is as a synonym for a data store in the Firebase service, as in "We'll write that to our Firebase". In this way it's used just like the word database, so keep this in mind.

Authentication
In this module we're going to implement login for our users. This is quite easy with AngularFire as you'll see. We'll start off by implementing anonymous authentication, but since that's not an authentication method that suits most applications, we'll also implement OAuth authentication. After that, we'll learn how to get the authentication status of the current user, next we'll learn how to log out users, and finally we'll learn about protecting routes so that users can't see specific routes until they're logged in. There are four ways to authenticate with Firebase. First there's anonymous authentication, which is convenient, but also means that users can't be tracked from one session to the next. There's the typical username and password authentication. Then there's OAuth, which has quite a few flavors such as Facebook, Twitter, and others. Finally there's custom authentication, which is useful in scenarios where your application already handles authentication and you need Firebase to meet your specific needs. With each of these methods, the setup and implementation is fairly easy, which is another great feature of Firebase. If you're following along, you've got to configure the authentication methods you want to support in your Firebase. So let's go on to the management console and we'll go down to the Login and Auth tab and then from here we're going to start by enabling anonymous authentication, so let's click on the word anonymous, and all you have to do is check this check box. Next we'll go over to the Facebook tab and we're going to check this check box as well and then at that point you've actually got to go in and create a Facebook application and get an app ID and a secret key. I won't walk you through this process, but instead if you simply go to this URL, then you can follow the process. It's got a few steps, but it's relatively straightforward. Once you've done that, just copy your app ID and your app secret into these two boxes down here. Now that we have that configured, we're ready to actually start authenticating our users.