angular-material-firebase-seed

Seed for angular CLI application with Material Design and Firebase as a backend.

This project was generated with Angular CLI

Set up development environment

• We recommend Visual Studio Code for code editing
• Install Node.js
• Install git

In Command Prompt run:

npm install -g @angular/cli
git config --global user.email "you@example.com"
git config --global user.name "Your Name"

Navigate to your working folder and run:

git clone https://github.com/Azmo/angular-material-firebase-seed.git

Go inside angular-material-firebase-seed folder and run

npm install
ng build 

Create new app on Facebook

Get:

• App ID
• App secret
• OAuth redirect URI

Set up project on Firebase

• Create new project on Firebase
• Go to Firebase console -> Authentication -> SIGN-IN METHOD (https://console.firebase.google.com/project/{PROJECT-NAME}/authentication/providers) and enable Google and Facebook Providers

Update project name and settings

• Update app name in the package.json file
• Update project names in the .firebaserc file
• Update project name in the .angular-cli.json
• Go to general project settings on Firebase console (https://console.firebase.google.com/project/{PROJECT-NAME}/settings/general/) click "Add Firebase to your web app", copy config and update firebaseConfig variable in app.module.ts
• Search and replace all "seed" words in the project

Firebase

We use Firebase for hosting, backend and database. How to deploy Angular CLI apps to Firebase

Deploy to Firebase

• npm install -g firebase-tools
• firebase login
• firebase init
• ng build -prod
• firebase deploy -P dev

Material Design

We use Angular Material to develop UI following Material design guidelines Material icons

Responsive layout

Angular Flex Layout Layout Demos

CI/CD

We use Travis CI for continuous integration and deployment to Firebase. Travis CI Firebase Deployment

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.