react rainbow firebase auth

React-Rainbow-Firebase-Auth

L'authentification des utilisateurs est souvent la partie la plus difficile de créer une application Web, surtout si vous souhaitez intégrer plusieurs fournisseurs. Avoir un profil est l'une des fonctionnalités les plus courantes que vous devrez ajouter sur vos projets. Maintenant, tout le travail difficile a été fait pour vous en tant que construction de templete dans React qui vous permettra en quelques minutes pour vous authentifier à l'aide du service Firebase.

Le projet utilise:

• réagir 16.12.0
• react-dom 16.12.0
• React-Redux 7.1.3
• React-Router-Dom 5.1.2
• React-INTL 3.6.2
• Redux 4.0.4
• Redux-forme 8.2.6
• Firebase 7.4.0
• Components stylisés 4.4.1
• React-Rainbow-Components 1.11.0
• Eslint 6.1.0
• Stylelint 12.0.0
• Cypress 3.7.0

Fournisseurs soutenus:

• Google
• Facebook

Caractéristiques:

• Interface utilisateur d'authentification idéale et solution de sécurité pour les applications modernes à page unique
• Prend en charge la connexion locale avec le nom d'utilisateur, le courrier électronique et le mot de passe en utilisant les meilleures pratiques de sécurité
• Prend en charge la connexion sociale avec Facebook et Google en utilisant les meilleures pratiques de sécurité
• Page de profil utilisateur avec la possibilité de mettre à jour votre mot de passe, votre nom d'utilisateur et votre e-mail actuels
• Envoie des e-mails système pour la réinitialisation du mot de passe
• L'intégration Facebook et Google entièrement testée
• Test d'intégration avec Cypress

Installer et exécuter

• Ces instructions sont basiques, vous pouvez utiliser n'importe quelle méthode pour faire ce travail.

1. Faites un nouveau dossier pour votre repo
2. Démarrez une instance GIT et copiez les fichiers de modèle
3. Écraser cette lecture
4. Assurez-vous de changer le titre de rémission
5. Assurez-vous de changer le manifest.json sur le dossier public
6. Assurez-vous de modifier le firebase.js sur le dossier src

Divers

Avant de commencer

Ajouter Firebase à votre projet JavaScript

Soyez prêt à obtenir des acces avec le fournisseur Facebook

1. Sur le site Facebook pour les développeurs, obtenez l' ID d'application et un secret d'application pour votre application
2. Activer la connexion Facebook:
   1. Dans la console Firebase, ouvrez la section Auth .
   2. Dans l'onglet Méthode de connexion , activez la méthode de connexion Facebook et spécifiez l' ID de l'application et le secret de l'application que vous avez obtenu sur Facebook.
   3. Ensuite, assurez-vous que votre UAuth Redirect URI (par exemple my-app-12345.firebaseapp.com/__/auth/handler ) est répertorié comme l'un de vos UAuth Redirect URI dans la page de paramètres de votre application Facebook sur le site Facebook pour les développeurs dans les paramètres du produit> Facebook Cogning Config.

Soyez prêt à obtenir des acces avec Google Provider

1. Activez la connexion Google dans la console Firebase:
   1. Dans la console Firebase, ouvrez la section Auth .
   2. Dans l'onglet Méthode de connexion , activez la méthode de connexion Google et cliquez sur Enregistrer .

Soyez prêt à obtenir des acces avec le fournisseur de github

1. Dans la console Firebase, ouvrez la section Auth .
2. Dans l'onglet Méthode de connexion , activez le fournisseur GitHub .
3. Ajoutez l' ID client et le secret client de la console de développeur de ce fournisseur à la configuration du fournisseur:
   1. Enregistrez votre application en tant qu'application de développeur sur GitHub et obtenez l'ID client OAuth 2.0 de votre application et le secret client .
   2. Assurez-vous que votre Firebase OAuth Redirect URI (par exemple my-app-12345.firebaseapp.com/__/auth/handler ) est défini comme URL de rappel d'autorisation dans la page Paramètres de votre application sur la configuration de votre application GitHub.
4. Cliquez sur Enregistrer .

Supporters

Il s'agit d'un projet open source maintenu par Nexxtway Corp.