README

Angular social login buttons

simple npm package to display and sign in via social login buttons.
Signin with Google, Linkedin, Facebook

👉 live demo

Install

npm
npm install --save angular-social-login-buttons
yarn
yarn add angular-social-login-buttons

Import

add in top of the body tag in index.html the facebook sdk and google sdk like the below image Alt text

or in raw version:

....

in app.module.ts

import the AngularSocialLoginButtonsModule module and provide your clientId for the google
or linkedin

Alt text

import { AngularSocialLoginButtonsModule, AngularSocialLoginButtonsService } from 'angular-social-login-buttons';

// Configs
export function getAuthServiceConfigs() {
  const config = new AngularSocialLoginButtonsService();
  config.addGoogle('your-google-client-id');
  config.addLinkedin('your-linkedin-client-id');
  return config;
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    AngularSocialLoginButtonsModule,
    ....
  ],
  providers: [ {provide: AngularSocialLoginButtonsService,
                useFactory: getAuthServiceConfigs}
              ],
  bootstrap: [AppComponent]
})

Usage

to use the facebook Signin button add in your html file
<lib-fb-login></lib-fb-login>
to use the google Signin button add in your html file
<lib-google-login></lib-google-login>
to use the linkedin Signin button add in your html file
<lib-linkedin-login></lib-linkedin-login>

Example

An example using the angular-social-login-buttons package is in the github repo. repo

Contribution

I welcome issues and pull requests on pr

Author

Juda Buchahda
-Github

Usage no npm install needed!