React-rainbow-firebase-auth
多くの場合、ユーザー認証は、特に複数のプロバイダーを統合したい場合は、Webアプリの構築の最も難しい部分です。プロファイルを持つことは、プロジェクトに追加する必要がある最も一般的な機能の1つです。今では、FireBaseサービスを使用して認証できる数分であなたができるように、Templete Build in Reactのビルドとしてすべての厳しい作業が行われました。
プロジェクトは次のとおりです。
- 反応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-form 8.2.6
- Firebase 7.4.0
- スタイルのコンポーネント4.4.1
- React-Rainbow-Components 1.11.0
- ESLINT 6.1.0
- StyleLint 12.0.0
- サイプレス3.7.0
サポートされているプロバイダー:
特徴:
- 最新のシングルページアプリ向けの理想的な認証UIとセキュリティソリューション
- 最良のセキュリティプラクティスを使用して、ユーザー名、電子メール、パスワードでローカルログインをサポートします
- Best Security Practicesを使用してFacebookおよびGoogleでソーシャルログインをサポートしています
- 現在のパスワード、ユーザー名、電子メールを更新する機能を備えたユーザープロファイルページ
- パスワードリセット用のシステムメールを送信します
- FacebookとGoogleの統合が完全にテストされました
- サイプレスとの統合テスト
インストールして実行します
- これらの指示は基本的なものです。任意の方法を使用してこの作業を行うことができます。
- リポジトリ用の新しいフォルダーを作成します
- gitインスタンスを開始し、テンプレートファイルをコピーします
- このreadmeを上書きします
- 必ずレポタイトルを変更してください
publicフォルダーでmanifest.jsonを必ず変更してくださいsrcフォルダーのfirebase.jsを必ず変更してください
その他
始める前に
JavaScriptプロジェクトにFirebaseを追加します
FacebookプロバイダーでACCEを取得する準備をしてください
- 開発者のFacebookで、アプリのアプリIDとアプリの秘密を入手してください
- Facebookログインを有効にします:
- FireBaseコンソールで、 AUTHセクションを開きます。
- [Sign in Method Method]タブで、 Facebookのサインインメソッドを有効にし、Facebookから入手したアプリIDとアプリの秘密を指定します。
- 次に、 OAuth Redirect URI (
my-app-12345.firebaseapp.com/__/auth/handler __/auth/handler)が、Facebookアプリの設定ページで、 Develops Settings> Facebook Login ConfigのOAUTHリダイレクトURIの1つとしてリストされていることを確認してください。
GoogleプロバイダーでACCEを取得する準備をしてください
- FireBaseコンソールでGoogleサインインを有効にします:
- FireBaseコンソールで、 AUTHセクションを開きます。
- [サインインメソッド]タブで、 Googleのサインインメソッドを有効にし、 [保存]をクリックします。
GitHubプロバイダーでACCEを取得する準備をしてください
- FireBaseコンソールで、 AUTHセクションを開きます。
- [サインインメソッド]タブで、 GitHubプロバイダーを有効にします。
- そのプロバイダーの開発者コンソールからクライアントIDとクライアントの秘密をプロバイダーの構成に追加します。
- GitHubで開発者アプリケーションとしてアプリを登録し、アプリのOAUTH 2.0クライアントIDとクライアントシークレットを取得します。
- Firebase OAuth Redirect URI (
my-app-12345.firebaseapp.com/__/auth/handler __/auth/handler)が、GitHubアプリの構成のアプリの設定ページで認証コールバックURLとして設定されていることを確認してください。
- [保存]をクリックします。
サポーター
これは、Nexxtway Corp.