Todo app with Angular2 • AngularFire2 • Firebase • OAuth • Webpack2


Module License: MIT

Added by: Sam Deering





Stars: 375

Watchers: 375

Forks: 159

Module Description

CircleCI Coverage Status

Todo app with Angular2, AngularFire2, and Firebase SDK 3

A simple Todo app example built with Angular2 and AngularFire2. The app features a Firebase backend with OAuth authentication. Try the demo at

  • Angular2 2.1.0
  • Angular2 Router 3.1.0
  • AngularFire2 2.0.0-beta.5
  • Firebase SDK 3
    • JSON Datastore
    • OAuth authentication with GitHub, Google, and Twitter
    • Hosting
  • RxJS
  • SASS
  • Typescript
  • Webpack
    • Inlines external SCSS files
    • Inlines external HTML templates
    • Bundles and minifies release builds
    • Injects style and script tags into index.html

Quick Start

$ git clone
$ cd todo-angular2-firebase
$ npm install
$ npm start

Deploying to Firebase


  • Create a free Firebase account at
  • Create a project from your Firebase account console
  • Configure the authentication providers for your Firebase project from your Firebase account console

Configure this app with your project-specific details:

// .firebaserc

  "projects": {
    "default": "your-project-id"
// src/firebase/index.ts

export const firebaseConfig = {
  apiKey: 'your api key',
  authDomain: '',
  databaseURL: '',
  storageBucket: ''

Install firebase-tools:

$ npm install -g firebase-tools

Build and deploy the app:

$ npm run build
$ firebase login
$ firebase use default
$ firebase deploy


|Script|Description| |---|---| |npm start|Start webpack development server @ localhost:3000| |npm run build|Lint, test, and build the application to ./target| |npm run lint|Lint .ts and .js files| |npm run lint:js|Lint .js files with eslint| |npm run lint:ts|Lint .ts files with tslint| |npm run server|Start express server @ localhost:3000 to serve built artifacts from ./target (must run npm run build first)| |npm test|Run unit tests with Karma and Jasmine, and generate coverage report to ./coverage| |npm run test:watch|Run unit tests with Karma and Jasmine; watch for changes to re-run tests|

Module stats last updated: 2018-01-16 16:00:06

Disclaimer: Some data on this page may have been gathered from the authors GitHub respository. If you see any mistakes or outdated information please let us know. Thanks!