Skip to content

Commit 7631ab0

Browse files
committed
chore(docs): Add messagingSenderId to docs
1 parent 9c84869 commit 7631ab0

File tree

3 files changed

+40
-36
lines changed

3 files changed

+40
-36
lines changed

docs/1-install-and-setup.md

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
55
### 0. Prerequisites
66

7-
Before you start installing AngularFire2, make sure you have latest version of angular-cli installed.
7+
Before you start installing AngularFire2, make sure you have latest version of angular-cli installed.
88
To verify run the command `ng -v` and ensure you see `angular-cli: 1.x.x-beta.xx`. The lowest compatible version is `1.x.x-beta.14`.
99

1010
If not, you may need to do the following:
@@ -14,17 +14,17 @@ If not, you may need to do the following:
1414
npm uninstall -g angular-cli
1515

1616
# reinstall clean version
17-
npm install -g angular-cli
17+
npm install -g angular-cli
1818
```
1919

2020
You need the Angular CLI, typings, and TypeScript.
2121

2222
```bash
23-
npm install -g angular-cli
23+
npm install -g angular-cli
2424
# or install locally
2525
npm install angular-cli --save-dev
2626
# make sure you have typings installed
27-
npm install -g typings
27+
npm install -g typings
2828
npm install -g typescript
2929
```
3030

@@ -56,7 +56,7 @@ Now that you have a new project setup, install AngularFire 2 and Firebase from n
5656

5757
### 4. Setup @NgModule
5858

59-
Open `/src/app/app.module.ts`, inject the Firebase providers, and specify your Firebase configuration.
59+
Open `/src/app/app.module.ts`, inject the Firebase providers, and specify your Firebase configuration.
6060
This can be found in your project at [the Firebase Console](https://console.firebase.google.com):
6161

6262
```ts
@@ -70,7 +70,8 @@ export const firebaseConfig = {
7070
apiKey: '<your-key>',
7171
authDomain: '<your-project-authdomain>',
7272
databaseURL: '<your-database-URL>',
73-
storageBucket: '<your-storage-bucket>'
73+
storageBucket: '<your-storage-bucket>',
74+
messagingSenderId: '<your-messaging-sender-id>'
7475
};
7576

7677
@NgModule({
@@ -94,14 +95,14 @@ import { Component } from '@angular/core';
9495
import { AngularFire, FirebaseListObservable } from 'angularfire2';
9596

9697
@Component({
97-
98+
9899
selector: 'app-root',
99100
templateUrl: 'app.component.html',
100101
styleUrls: ['app.component.css']
101102
})
102103
export class AppComponent {
103104
constructor(af: AngularFire) {
104-
105+
105106
}
106107
}
107108

@@ -116,7 +117,7 @@ import { Component } from '@angular/core';
116117
import { AngularFire, FirebaseListObservable } from 'angularfire2';
117118

118119
@Component({
119-
120+
120121
selector: 'app-root',
121122
templateUrl: 'app.component.html',
122123
styleUrls: ['app.component.css']
@@ -164,7 +165,7 @@ If you run into this error while trying to invoke `ng serve`, open `src/tsconfig
164165
"typeRoots": [
165166
"../node_modules/@types"
166167
],
167-
168+
168169
// ADD THIS
169170
"types": [
170171
"firebase"

docs/5-user-authentication.md

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ of authentication, you can specify that ahead of time so you only need to call
77

88
## Configure application in bootstrap
99

10-
To specify your authentication ahead of time, you provide the `AngularFireModule.initializeApp` function
10+
To specify your authentication ahead of time, you provide the `AngularFireModule.initializeApp` function
1111
with an `AuthProvider` and an `AuthMethod`.
1212

1313
```ts
@@ -21,6 +21,7 @@ const myFirebaseConfig = {
2121
authDomain: '<your-project-authdomain>',
2222
databaseURL: '<your-database-URL>',
2323
storageBucket: '<your-storage-bucket>',
24+
messagingSenderId: '<your-messaging-sender-id>'
2425
}
2526

2627
const myFirebaseAuthConfig = {
@@ -58,7 +59,7 @@ af.auth.login({ email: 'email', password: 'pass' });
5859
import { Component } from '@angular/core';
5960
import { AngularFire } from 'angularfire2';
6061

61-
@Component({
62+
@Component({
6263
selector: 'app-root',
6364
template: `
6465
<div> {{ (af.auth | async)?.uid }} </div>
@@ -68,11 +69,11 @@ import { AngularFire } from 'angularfire2';
6869
})
6970
export class AppComponent {
7071
constructor(public af: AngularFire) {}
71-
72+
7273
login() {
7374
this.af.auth.login();
7475
}
75-
76+
7677
logout() {
7778
this.af.auth.logout();
7879
}
@@ -93,7 +94,7 @@ Sample Usage:
9394

9495
## Override configuration / No config
9596

96-
Authentication works without configuration, and even if you have setup
97+
Authentication works without configuration, and even if you have setup
9798
authentication in the bootstrap phase, you can still override the configuration.
9899

99100
```ts
@@ -156,7 +157,7 @@ export class AppComponent {
156157
this.af.auth.login({
157158
provider: AuthProviders.Anonymous,
158159
method: AuthMethods.Anonymous,
159-
});
160+
});
160161
}
161162
}
162163
```

docs/Auth-with-Ionic2.md

Lines changed: 22 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -7,19 +7,19 @@ Ensure that you're executing these commands as **Administrator** on Windows and
77

88
### Prerequisites
99
The first step is to ensure you've latest version of **Node** installed.
10-
You can get the latest version from [here](https://nodejs.org).
10+
You can get the latest version from [here](https://nodejs.org).
1111
This will install both node and npm.
1212

1313
After installing node, check the version by executing the following command in your prompt window.
1414

1515
```bash
1616

1717
C:\projects>node -v
18-
v6.9.1
18+
v6.9.1
1919

2020
```
2121

22-
As of writting this document, this is the most stable version. If you're not on this version,
22+
As of writting this document, this is the most stable version. If you're not on this version,
2323
please upgrade yourself to latest version by installing node from [here](https://nodejs.org).
2424

2525
Check your npm version by executing the following command.
@@ -84,18 +84,18 @@ C:\projects\Ionic_AngularFire2_Project> ionic serve
8484

8585
```
8686

87-
If everything is installed correctly, the app should open your browser with the dev server running at following url
87+
If everything is installed correctly, the app should open your browser with the dev server running at following url
8888
**`http://localhost:8100`** and will display default home page.
8989

90-
Stop you server by pressing "ctrl + c", if it is still running from the above step and
90+
Stop you server by pressing "ctrl + c", if it is still running from the above step and
9191
install typings and typescript globally by executing the following commands:
9292

9393
**Note:-** typings is not required for our current application to work, but it will be helpful incase you want to bring in
9494
external libraries and extend this application.
9595

9696
```bash
9797

98-
C:\projects\Ionic_AngularFire2_Project>npm install -g typings
98+
C:\projects\Ionic_AngularFire2_Project>npm install -g typings
9999

100100
C:\projects\Ionic_AngularFire2_Project>npm install -g typescript
101101

@@ -156,6 +156,7 @@ export const firebaseConfig = {
156156
authDomain: "your-domain-name.firebaseapp.com",
157157
databaseURL: "https://your-domain-name.firebaseio.com",
158158
storageBucket: "your-domain-name.appspot.com",
159+
messagingSenderId: '<your-messaging-sender-id>'
159160
};
160161

161162
@NgModule({
@@ -201,7 +202,7 @@ import { AngularFire, FirebaseListObservable } from 'angularfire2';
201202
templateUrl: 'home.html'
202203
})
203204
export class HomePage {
204-
205+
205206
items: FirebaseListObservable<any[]>;
206207
207208
constructor(public navCtrl: NavController,af: AngularFire) {
@@ -246,7 +247,7 @@ C:\projects\Ionic_AngularFire2_Project> ionic serve
246247
247248
## Configuring AngularFire2 Auth with Ionic2
248249
249-
Continuing with the above example stop your server by pressing `ctrl+c` and go to command prompt and
250+
Continuing with the above example stop your server by pressing `ctrl+c` and go to command prompt and
250251
generate a service by executing the following command
251252
252253
```bash
@@ -295,7 +296,7 @@ export class AuthService {
295296
} else {
296297
return '';
297298
}
298-
}
299+
}
299300
}
300301
301302
```
@@ -318,6 +319,7 @@ export const firebaseConfig = {
318319
authDomain: "your-domain-name.firebaseapp.com",
319320
databaseURL: "https://your-domain-name.firebaseio.com",
320321
storageBucket: "your-domain-name.appspot.com",
322+
messagingSenderId: '<your-messaging-sender-id>'
321323
};
322324
323325
@NgModule({
@@ -364,7 +366,7 @@ Update your `home.html` to add a login button. Your `home.html` should look like
364366
365367
```
366368
367-
and finally, add the corresponding click handlers in `home.ts` as follows.
369+
and finally, add the corresponding click handlers in `home.ts` as follows.
368370
Also, ensure the *AuthService* is injected in the constructor. Your `home.ts` should look like this
369371
370372
```bash
@@ -380,7 +382,7 @@ import { AngularFire, FirebaseListObservable } from 'angularfire2';
380382
templateUrl: 'home.html'
381383
})
382384
export class HomePage {
383-
385+
384386
items: FirebaseListObservable<any[]>;
385387
386388
constructor(public navCtrl: NavController,af: AngularFire,private _auth: AuthService) {
@@ -392,20 +394,20 @@ export class HomePage {
392394
.then(() => this.onSignInSuccess());
393395
}
394396
395-
private onSignInSuccess(): void {
397+
private onSignInSuccess(): void {
396398
console.log("Facebook display name ",this._auth.displayName());
397399
}
398400
399401
}
400402
401403
```
402404
403-
Now run your app and if everything is configured correctly, you should be able to click on the login button in your app,
405+
Now run your app and if everything is configured correctly, you should be able to click on the login button in your app,
404406
which should open the facebook pop-up.
405407
406408
Once you authenticate yourself, you should see your Facebook display name in console.
407409
408-
You can try redirecting yourself to another page to grab additional details from Facebook.
410+
You can try redirecting yourself to another page to grab additional details from Facebook.
409411
410412
411413
***Running our application on mobile phone.***
@@ -414,11 +416,11 @@ Ensure you've the platform added to your project. If not add the platform by exe
414416
415417
```
416418

417-
C:\projects\Ionic_AngularFire2_Project>ionic platform add android
419+
C:\projects\Ionic_AngularFire2_Project>ionic platform add android
418420

419421
```
420422
421-
This adds android platform for your project.
423+
This adds android platform for your project.
422424
Replace android with ios, if you're on Mac book or add both. The generic command is ```ionic platform add <platform-name>```
423425
424426
Now, let's try to run the app in browser. Execute the command
@@ -429,8 +431,8 @@ C:\projects\Ionic_AngularFire2_Project> ionic run android
429431
430432
```
431433
432-
This should run the app on your mobile phone. Now click on the Facebook button and you'll notice the button doesn't work anymore.
433-
This is because the code written so far is good for running our application in browsers, but when running the application on mobile phones, we need to have access to ***Native Mobile API's***, which are provided by _Corodova Plugins_.
434+
This should run the app on your mobile phone. Now click on the Facebook button and you'll notice the button doesn't work anymore.
435+
This is because the code written so far is good for running our application in browsers, but when running the application on mobile phones, we need to have access to ***Native Mobile API's***, which are provided by _Corodova Plugins_.
434436
435437
**We can access these corodva plugins, using Ionic Native, which are nothing but wrappers for cordova plugins.**
436438
@@ -440,7 +442,7 @@ Let's look at configuring and installing facebook plugin [here](http://ionicfram
440442
_Ensure you follow the steps correctly to configure your app._
441443
442444
Once you create your app and make a note of your App ID, go to command prompt in your project directory and execute the following command
443-
445+
444446
```
445447
C:\projects\Ionic_AngularFire2_Project>
446448
ionic plugin add cordova-plugin-facebook4 --save --variable APP_ID="123456789" --variable APP_NAME="myApp"
@@ -519,7 +521,7 @@ export class AuthService {
519521
520522
```
521523
522-
Verfiy your app is running in browser by executing the following command
524+
Verfiy your app is running in browser by executing the following command
523525
524526
```
525527

0 commit comments

Comments
 (0)