# @failbetter/react-twitter-auth > A Twitter login component Latest version **0.0.15** (published 2018-09-10) · MIT license · 0 weekly downloads ## Install ```sh npm install @failbetter/react-twitter-auth pnpm add @failbetter/react-twitter-auth yarn add @failbetter/react-twitter-auth bun add @failbetter/react-twitter-auth ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.0.15 | | Published | 2018-09-10 | | First published | 2018-09-10 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 3 | | Unpacked size | 74.3 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 0 | | Maintainers | sdob | | Keywords | React, Twitter, Login, Auth, oauth, component | ## Links - npm: https://www.npmjs.com/package/@failbetter/react-twitter-auth - Repository: https://github.com/failbetter-games/react-twitter-auth - Homepage: https://github.com/failbetter-games/react-twitter-auth#readme - Issues: https://github.com/failbetter-games/react-twitter-login/issues - npm.io page: https://npm.io/package/@failbetter/react-twitter-auth ## Dependencies (3) - [react-icons](https://npm.io/package/react-icons.md) ^2.2.5 - [whatwg-fetch](https://npm.io/package/whatwg-fetch.md) 2.0.3 - [url-search-params-polyfill](https://npm.io/package/url-search-params-polyfill.md) ^2.0.0 ## Alternatives - [@pothos/plugin-authz](https://npm.io/package/@pothos/plugin-authz.md) — 12.4K weekly downloads - [@bounded-sh/client](https://npm.io/package/@bounded-sh/client.md) — 3.2K weekly downloads - [@luigi-project/plugin-auth-oauth2](https://npm.io/package/@luigi-project/plugin-auth-oauth2.md) — 2.3K weekly downloads - [@nocobase/plugin-verification](https://npm.io/package/@nocobase/plugin-verification.md) — 2.0K weekly downloads - [escher-request](https://npm.io/package/escher-request.md) — 545 weekly downloads ## Recent versions - 0.0.15 (latest) — 2018-09-10 - 0.0.14 — 2018-09-10 - 0.0.13 — 2018-09-10 ## README [![NPM](https://nodei.co/npm/react-twitter-auth.png?downloads=true&downloadRank=true&stars=true)](https://nodei.co/npm/react-twitter-auth/) [![Build Status](https://travis-ci.org/GenFirst/react-twitter-auth.svg?branch=master)](https://travis-ci.org/GenFirst/react-twitter-auth) [![Code Climate](https://codeclimate.com/github/GenFirst/react-twitter-login/badges/gpa.svg)](https://codeclimate.com/github/GenFirst/react-twitter-login) [![Dependency Status](https://gemnasium.com/badges/github.com/GenFirst/react-twitter-auth.svg)](https://gemnasium.com/github.com/GenFirst/react-twitter-auth) [![Coverage Status](https://coveralls.io/repos/github/GenFirst/react-twitter-auth/badge.svg?branch=master)](https://coveralls.io/github/GenFirst/react-twitter-auth?branch=master) [![npm version](https://badge.fury.io/js/react-twitter-auth.svg)](https://badge.fury.io/js/react-twitter-auth) ![License](https://img.shields.io/badge/license-MIT-blue.svg) # React Twitter Authentication Component > A React Twitter oAUth Sign-in / Log-in Component for React ## Installation `npm install react-twitter-auth` ## Usage ```jsx harmony ``` Custom content that overrides default content: ```jsx harmony Custom Twitter Login content ``` ## Options | params | value | default value | description | |:---------------:|:------:|:-------------------:|:-----------------------------------------------------------------------------:| | tag |string |button |tag that should be used to create element that will be used as loging element | | text |string |Sign in with Twitter |text that will be shown in component | | loginUrl |string | |URL that will be used to finish 3rd step of authentication process | | requestTokenUrl |string | |URL that will be used to get request token | | onFailure |function| |function that will be called if user cannot be authenticated | | onSuccess |function| |function that will be called if user is successfully authenticated | | disabled |boolean |false |disable component | | style |object | |style object | | className |string | |class name for component | | dialogWidth |number |600 |dialog width | | dialogHeight |number |400 |dialog height | | showIcon |bool |true |should default icon be visible | | credentials |string |same-origin |indicates whether the user agent should send cookies from the other domain in the case of cross-origin requests. Possible values: `omit`, `same-origin`, `include`| | customHeaders |object |{} |custom headers should be object with fields that needs to be sent to user server. Field name will be used as header key and field value as header value. Because of bug in fetch implementation all keys will be lowercase.| | children |node | |this props can be used in order to override default component content| | forceLogin |bool |false |force user to authenticate with Twitter username and password | # Examples Full example can be found in [example](https://github.com/GenFirst/react-twitter-login/tree/master/example) folder. You can find tutorial that explains in details how to implement Twitter authentication with RESTful backend [here](https://medium.com/@robince885/how-to-do-twitter-authentication-with-react-and-restful-api-e525f30c62bb). # Workflow The detailed explanation of the whole process can be found in Twitter documentation. In picture below you can find out all the steps that are needed. ![Twitter authentication workflow](https://cdn-images-1.medium.com/max/800/1*RTsSRbVeEzPaC68hRT8n2g.png) # License react-twitter-auth is released under [MIT License](https://opensource.org/licenses/MIT). --- _Source: https://npm.io/package/@failbetter/react-twitter-auth · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._