Simplify Facebook Login in React with react-fb-login-btn

Hello everyone,

I want to share with you a new React component called react-fb-login-btn. It helps you add Facebook login to your React applications easily.

Introduction

Adding Facebook login to your app can be hard sometimes. With react-fb-login-btn, you can do it in a simple way. This component is built with TypeScript and Tailwind CSS. It allows you to customize the button to fit your app's design.

Why Use react-fb-login-btn?

• 
  Easy to Use: You don't need to deal with the Facebook SDK directly.


• 
  Customizable: Change the button's look to match your app.


• 
  TypeScript Support: It uses TypeScript for better code quality.


• 
  Handles Events: Easy to handle login success or failure.


• 
  Supports RTL: Works with languages that are right-to-left.

Installation

You can install it using npm:

npm install react-fb-login-btn

Or with yarn:

yarn add react-fb-login-btn

Basic Usage

First, import the component into your project:

import React from 'react';

import { FacebookLoginButton } from 'react-fb-login-btn';



const App = () => {

  const handleSuccess = (response) => {

    console.log('Login successful:', response);

    // Handle successful login here

  };



  const handleFailure = (error) => {

    console.error('Login failed:', error);

    // Handle login failure here

  };



  return (

    <div>

      <FacebookLoginButton

        appId="YOUR_FACEBOOK_APP_ID"

        onSuccess={handleSuccess}

        onFail={handleFailure}

      />

    </div>

  );

};



export default App;

Note: Replace "YOUR_FACEBOOK_APP_ID" with your actual Facebook App ID. You can get it from the .

I hope you find it useful!

Feedback and Contributions

If you have any questions or suggestions, please visit the GitHub repository. Contributions are welcome!

Thank you for reading!