Note: this guide is for TwitterKit 3.3 and ReactNative 0.56+.
This package provides necessary code to get your social sign in using Twitter works with least pain possible.
Go to Twitter Apps to create your app so that you can obtain API key and secret, note:
Here is how callbacks would look like:
From Twitter Kit 3.3, Fabric is no longer required.
Firstly, install the npm package:
npm install react-native-twitter-signin --save
react-native link react-native-twitter-signin
<consumerKey>
with your own key:// Info.plist
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>twitterkit-<consumerKey></string>
</array>
</dict>
</array>
<key>LSApplicationQueriesSchemes</key>
<array>
<string>twitter</string>
<string>twitterauth</string>
</array>
Modify AppDelegate.m to #import <TwitterKit/TWTRKit.h>
and handle openUrl
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<NSString *,id> *)options {
return [[Twitter sharedInstance] application:app openURL:url options:options];
}
TwitterKit
:Podfile
// Podfile
target 'MyApp' do
# use_frameworks!
pod 'TwitterKit', '~> 3.3.0'
end
pod install
Build Phases → Link Binary with libraries
add Twitter.framework
and LibRBTwitterSignin.a
Run react-native link react-native-twitter-signin
, or:
On Android, it will use Gradle
so all you need to do is to point to the correct project location:
In your ${project_dir}/android/settings.gradle
add this:
include ':react-native-twitter-signin'
project(':react-native-twitter-signin').projectDir = new File(rootProject.projectDir,'../node_modules/react-native-twitter-signin/android')
In your ${project_dir}/android/app/build.gradle
add this:
depedencies {
...
compile project(':react-native-twitter-signin')
...
}
MainApplication.java
makes use of the package as following:
/**
* A list of packages used by the app. If the app uses additional views
* or modules besides the default ones, add more packages here.
*/
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new FacebookLoginPackage(),
new TwitterSigninPackage(),
new RNGoogleSigninPackage(this),
new VectorIconsPackage(),
new RNSvgPackage()
);
}
Keeps in mind that all the configure is for your build tools to recognise the files. So open your Xcode and Android Studio to try making builds and make sure they pass.
Example
project.The code was extracted from my project so it satisfies my current need, if you need extra functions, feel free to submit to issue list or fork it.
Code and documentation copyright 2016 Justin Nguyen. Code released under the MIT license.