- Library's Components
- Supported Providers
- Supported Processes and Actions
- Supported Angular Guards
- Peer Dependencies
- Installation
- testing
<ng-register>
standalone registration component to create new accounts<ng-login-email-password>
standalone login component with email & password<ng-login-google>
standalone login component with the google provider<ng-user-settings>
standalone user settings component<ng-admin-settings>
standalone admin settings component, for implementation click here<ng-create-group>
standalone create group component<ng-group-list>
standalone group list of current logged in user<ng-group-settings>
standalone group settings component of given group<ng-group-users-settings>
standalone user settings of given group
for an complete guide of the files go click here
- email and password (traditional)
- sign up
- sign in
- sign out
- delete user's account
- Impersonate a user (admin only)
- firestore sync
LoggedInGuard
used to protect angular routes from unauthenticated users (with fallback routes viaNgxAuthFirebaseUIConfig
)AdminAuthGuard
used to protect angular routes from non admin users (with fallback routes viaNgxAuthFirebaseUIConfig
)
"peerDependencies": {
"@angular/common": "^8.2.0",
"@angular/core": "^8.2.0",
"@angular/router": "^8.2.10",
"@angular/fire": "^5.2.1",
"@angular/material": "8.2.3",
"firebase": "^6.6.2",
"rxjs": "~6.4.0"
}
Install all of the above dependencies with npm Install the library with npm
npm install ng-usermanagement
Once you have installed the library you need to import the module into the main module.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
// Import the library
import { NgUserManagementModule } from 'ng-usermanagement';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
const firebaseConfig = {
authGuardLoggedInURL: "[fallback Url]" // Fallback to this url if the user isn't logged in
firebaseConfig: {
apiKey: "[Project Key]",
authDomain: "[Project Id].firebaseapp.com",
databaseURL: "https://[Project Id].firebaseio.com",
projectId: "[Project Id]",
storageBucket: "[Project Id].appspot.com",
messagingSenderId: "[messageSender Id]",
appId: "[App Id]"
}
};
const inputValidationConfig = {
required: 'Required',
email: 'Invalid email address',
verifyPassword: 'Verify your password',
}
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
BrowserAnimationsModule,
NgUserManagementModule.forRoot(firebaseConfig, inputValidationConfig),
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Copy and paste the firebase cloud functions into your cloud functions folder. If the folder doens't exist yet run the following command.
firebase init functions
copy the following cloud functions here
deploy the cloud functions with the following command.
firebase deploy --only functions
Copy and paste the firestore rules into your firestore rules file. If the file doesn't exist yet run the following command.
firebase init firestore
copy the following firestore rules here
deploy the firestore rules with the following command.
firebase deploy --only firestore:rules
ng serve
npm run build:testConfig
npx cypress open
ng test ng-usermanagement
Build the library.
ng build ng-usermanagement
navigate to the dist folder cd dist/ng-usermanagement
cd dist/ng-usermanagement
npm publish
Build the compodoc file & serve it for testing if needed
npm run compodoc
npm run compodoc:serve
Copy and paste the files in documentation into the public folder. Run the deploy command to firebase
firebase deploy --only hosting