react-rainbow-firebase-auth
Otentikasi pengguna seringkali merupakan bagian tersulit dari membangun aplikasi web apa pun, terutama jika Anda ingin mengintegrasikan banyak penyedia. Memiliki profil adalah salah satu fitur paling umum yang perlu Anda tambahkan pada proyek Anda. Sekarang semua pekerjaan sulit telah dilakukan untuk Anda sebagai Build TempleT dalam React yang akan memungkinkan Anda hanya dalam beberapa menit untuk mengotentikasi menggunakan layanan Firebase.
Proyek menggunakan:
- Bereaksi 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
- Styled-Components 4.4.1
- React-Rainbow-Components 1.11.0
- Eslint 6.1.0
- Stylelint 12.0.0
- Cypress 3.7.0
Penyedia didukung:
Fitur:
- Otentikasi Ideal UI dan Solusi Keamanan untuk Aplikasi Halaman Tunggal Modern
- Mendukung login lokal dengan nama pengguna, email, dan kata sandi menggunakan praktik keamanan terbaik
- Mendukung Login Sosial dengan Facebook dan Google Menggunakan Praktik Keamanan Terbaik
- Halaman profil pengguna dengan kemampuan untuk memperbarui kata sandi, nama pengguna, dan email Anda saat ini
- Mengirim email sistem untuk reset kata sandi
- Integrasi Facebook dan Google diuji sepenuhnya
- Tes Integrasi dengan Cypress
Instal & Jalankan
- Instruksi ini dasar, Anda dapat menggunakan metode apa pun untuk melakukan pekerjaan ini.
- Buat folder baru untuk repo Anda
- Mulailah instance git dan salin file templat
- Timpa readme ini
- Pastikan untuk mengubah judul repo
- Pastikan untuk mengubah
manifest.json di folder public - Pastikan untuk mengubah
firebase.js pada folder src
Aneka ragam
Sebelum Anda mulai
Tambahkan Firebase ke Proyek JavaScript Anda
Bersiaplah untuk mendapatkan akses dengan penyedia Facebook
- Di situs Facebook for Developer, dapatkan ID aplikasi dan rahasia aplikasi untuk aplikasi Anda
- Aktifkan Login Facebook:
- Di konsol Firebase, buka bagian auth .
- Pada tab Metode Masuk , aktifkan metode masuk Facebook dan tentukan ID aplikasi dan rahasia aplikasi yang Anda dapatkan dari Facebook.
- Kemudian, pastikan oauth Anda mengalihkan URI (misalnya
my-app-12345.firebaseapp.com/__/auth/handler ) terdaftar sebagai salah satu URI oAuth Anda di halaman Pengaturan Aplikasi Facebook Anda di situs Facebook untuk Pengembang di Pengaturan Produk> Konfigurasi Login Facebook .
Bersiaplah untuk mendapatkan akses dengan penyedia Google
- Aktifkan Google Masuk di Konsol Firebase:
- Di konsol Firebase, buka bagian auth .
- Pada tab Metode Masuk , aktifkan metode masuk Google dan klik Simpan .
Bersiaplah untuk mendapatkan akses dengan penyedia gitub
- Di konsol Firebase, buka bagian auth .
- Pada tab Metode Masuk , aktifkan penyedia GitHub .
- Tambahkan ID klien dan rahasia klien dari konsol pengembang penyedia tersebut ke konfigurasi penyedia:
- Daftarkan aplikasi Anda sebagai aplikasi pengembang di GitHub dan dapatkan ID klien OAuth 2.0 aplikasi Anda dan rahasia klien .
- Pastikan Firebase Anda OAuth Redirect Uri (
my-app-12345.firebaseapp.com/__/auth/handler .
- Klik Simpan .
Pendukung
Ini adalah proyek open-source yang dikelola oleh Nexxtway Corp.