You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: dist/README.md
+18-6
Original file line number
Diff line number
Diff line change
@@ -28,9 +28,13 @@ In your app:
28
28
4. Use the `FirebaseAuth` component in your template passing it the **Firebase UI configuration** and a **Firebase Auth instance**.
29
29
30
30
31
-
### `FirebaseAuth` vs `StyledFirebaseAuth`
31
+
### `FirebaseAuth` vs.`StyledFirebaseAuth`
32
32
33
-
There are two components that allow you to add FirebaseUI auth to your application: `FirebaseAuth` and `StyledFirebaseAuth`. The difference is that `FirebaseAuth` has a reference to the Firebase UI CSS (it `requires` the CSS) whereas `StyledFirebaseAuth` includes the CSS directly in its built. For simplicity you should use `StyledFirebaseAuth` and for better performances and build sizes you should use `FirebaseAuth`. `FirebaseAuth` is meant to be used with a CSS/style loader as part of yor webpack built configuration. See the [Packing your app](#packing-your-app) section
33
+
There are two similar components that allow you to add FirebaseUI auth to your application: `FirebaseAuth` and `StyledFirebaseAuth`.
34
+
-`FirebaseAuth` has a reference to the FirebaseUI CSS file (it `requires` the CSS).
35
+
-`StyledFirebaseAuth` is bundled with the CSS directly.
36
+
37
+
For simplicity you should use `StyledFirebaseAuth` and for potential better performances and build sizes you can use `FirebaseAuth`. `FirebaseAuth` is meant to be used with a CSS/style loader as part of yor webpack built configuration. See the [Packing your app](#packing-your-app) section.
@@ -110,17 +115,17 @@ class SignInScreen extends React.Component {
110
115
firebase.auth.GoogleAuthProvider.PROVIDER_ID,
111
116
firebase.auth.FacebookAuthProvider.PROVIDER_ID
112
117
],
113
-
// Avoid redirects after sign-in.
114
118
callbacks: {
119
+
// Avoid redirects after sign-in.
115
120
signInSuccess: () =>false
116
121
}
117
122
};
118
123
119
124
// Listen to the Firebase Auth state and set the local state.
120
125
componentWillMount() {
121
-
firebase.auth().onAuthStateChanged((user) => {
122
-
this.setState({signedIn:!!user});
123
-
});
126
+
firebase.auth().onAuthStateChanged(
127
+
(user) =>this.setState({signedIn:!!user})
128
+
);
124
129
}
125
130
126
131
render() {
@@ -271,6 +276,13 @@ If you would like to see an example of styling, have a look at the [example app]
271
276
Alternatively you can include the styling in a `<style>` tag in your application's markup.
272
277
273
278
279
+
## Server-Side Rendering (SSR)
280
+
281
+
FirebaseUI React cannot be rendered on the serverside becasue the underlying, wrapped library ([FirebaseUI](https://npmjs.com/package/firebaseui) does not work server-side.
282
+
283
+
You may still import and include the library in an app that uses SSR: there should be no errors but no elements will be rendered.
284
+
285
+
274
286
## Contributing
275
287
276
288
We'd love that you contribute to the project. Before doing so please read our [Contributor guide](CONTRIBUTING.md).
0 commit comments