https://github.com/jabranr/use-facebook
A custom React hook to integrate Facebook JavaScript SDK in React apps
https://github.com/jabranr/use-facebook
facebook-api facebook-web-sdk javascript react-hook sdk-javascript
Last synced: 10 months ago
JSON representation
A custom React hook to integrate Facebook JavaScript SDK in React apps
- Host: GitHub
- URL: https://github.com/jabranr/use-facebook
- Owner: jabranr
- License: mit
- Created: 2020-10-17T00:31:39.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2023-10-27T09:44:20.000Z (over 2 years ago)
- Last Synced: 2025-04-14T02:11:47.290Z (10 months ago)
- Topics: facebook-api, facebook-web-sdk, javascript, react-hook, sdk-javascript
- Language: Shell
- Homepage: https://npmjs.com/package/use-facebook
- Size: 25.4 KB
- Stars: 5
- Watchers: 2
- Forks: 4
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# use-facebook [](https://github.com/jabranr/use-facebook/actions/workflows/npm-publish.yml)
Custom React hook for Facebook JavaScript SDK
## Installation
```shell
npm install use-facebook
```
## Usage
Here is an example demostrating a button that triggers Facebook login dialog. Some of the code is truncated for brevity.
```js
import React from 'react';
import useFacebook from 'use-facebook';
export default function MyFacebookLoginPage () {
/**
* options is an object (also detailed below)
*/
const options = { appId: '123456789' };
/**
* Returns the state of SDK (true = loaded and ready to use)
*/
const { isFacebookSDKReady } = useFacebook(options);
/**
* Enable/disable the button based on SDK ready state
* Show FB login dialog on click once enabled
*/
return (
FB.login()}>Connect with Facebook
);
}
```
> Read [Facebook SDK docs](https://developers.facebook.com/docs/graph-api/using-graph-api/using-with-sdks#javascript-sdk) for `FB` API usage.
### `options`
```js
options = {
appId: 'abcxyz',
version: "v18.0",
autoLogAppEvents: true,
xfbml: true,
debug: false,
lang: "en_GB",
}
```
> `appId` is required and everything else is optional.
## License
MIT License
© 2020 - present Jabran Rafique ([@jabranr](https://twitter.com/jabranr))