react-firebaseui-pro
react-firebaseui-pro is a React component that provides seamless integration with Firebase Authentication using the FirebaseUI library. It simplifies the process of adding authentication flows to your React applications and is fully compatible with both React 18 and React 19.
Features
- React Compatibility: Works with both React 18 and React 19.
- Multiple Authentication Providers: Supports Google, Facebook, Twitter, GitHub, Microsoft, Apple, email/password, phone, and anonymous login.
- Customizable UI: Easily style the component using the className prop.
- FirebaseUI Integration: Built on top of the FirebaseUI library for a robust and reliable authentication experience.
- TypeScript Support: Includes TypeScript definitions for type safety.
Demo
Live demo: Default style – Demo code
Live demo: Icon style – Demo code
Getting started
Installation
npm install react-firebaseui-pro
Usage
- Add .env file in your project
- Write your auth and login logic
Examples: with-react-18 with-react-19
Check the UI and choose your favorite style:
// Default style
<ReactFirebaseuiPro uiConfig={uiConfig} firebaseAuth={firebaseAuth} />
// Style with className="firebaseui-icon"
<ReactFirebaseuiPro uiConfig={uiConfig} firebaseAuth={firebaseAuth} className="firebaseui-icon" />
// Style with className="firebaseui-icon round"
<ReactFirebaseuiPro uiConfig={uiConfig} firebaseAuth={firebaseAuth} className="firebaseui-icon round" />
