Skip to content

Repository files navigation

🔗 React-Native LinkedIn

exponent supportGreenkeeper badgeNPM versionDownloadsCircle CIcodecov

Simple LinkedIn login library for React-Native with WebView into a Modal

Demo

Benefits & others:

  • Light: No need to link a native library like others alternatives
  • Simple: Get the token and the expires, you handle your own login with the access_token
  • Sure: open-source
  • Almost readable & understandable code: JavaScript & React

Installation

$ yarn add react-native-linkedin

or

$ npm i react-native-linkedin --save

Documentation

Props

NameTypeRequiredDefaultDescription
clientIDstringrequiredYour client id
clientSecretstringrequiredYour client secret
redirectUristringrequiredYour redirectUri
onSuccessfunctionrequiredFunction will be call back on success
authStatestringoptionalrequire('uuid').v4()The state of auth, to be more secure
onErrorfunctionoptionalconsole.error(err)Function will be call back on error
onClosefunctionoptionalFunction will be call back on close modal
onOpenfunctionoptionalFunction will be call back on open modal
permissionsarrayoptional['r_basicprofile', 'r_emailaddress']The LinkedIn access token permissions
renderButtonfunctionoptionalRender function for customize LinkedIn button
renderClosefunctionoptionalRender function for customize close button
linkTextstringoptional'Login with LinkedIn'Link label
containerStyleViewPropTypes.styleoptionalCustomize container style
wrapperStyleViewPropTypes.styleoptionalCustomize wrapper style
closeStyleViewPropTypes.styleoptionalCustomize close style
animationTypeModal.propTypes.animationTypeoptionalfadeCustomize animationType style: 'none', 'slide' or 'fade'

Example

// See ./example folder for detailsimportReactfrom'react'import{StyleSheet,View}from'react-native'importLinkedInModalfrom'react-native-linkedin'conststyles=StyleSheet.create({container: {flex: 1,backgroundColor: '#fff',justifyContent: 'center',alignItems: 'center',},})exportdefaultclassAppContainerextendsReact.Component{render(){return(<Viewstyle={styles.container}><LinkedInModalclientID="[ Your client id from https://www.linkedin.com/developer/apps ]"clientSecret="[ Your client secret from https://www.linkedin.com/developer/apps ]"redirectUri="[ Your redirect uri set into https://www.linkedin.com/developer/apps ]"onSuccess={token=>console.log(token)}/></View>)}}

Security

Please not that you should pass your linkedin client id and you secret key to the component. You should be aware that key can be found if you store it directly to your code. I strongly recommand to not declare both on your code but found a way to keep it secret (ie. get it from server, encrypt it, ...)

Roadmap & TODOs

  • Better style for modal: border, padding, transparency
  • Button to close the modal
  • Test every line of code
  • Better catch of error into login url
  • Add gif example in README
  • Publish example to expo
  • Add props or other function to fetch more informations like basic profile information

> Propose

Contribution

PRs are welcome!

FAQ

Is it supported and tested both on android and iOS?

YES

Questions

Feel free to contact me or create an issue

Alternatives

Licence

MIT

made with ♥

About

🔗 React-Native LinkedIn, a simple LinkedIn login library for React-Native with WebView and Modal

Resources

Code of conduct

Contributing

Stars

1 star

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages