How to use SurveyMonkey in React Native

Issue #521 #import <React/RCTBridgeModule.h> @interface RNSurveyManager : NSObject <RCTBridgeModule> @end #import "RNSurveyManager.h" #import <React/RCTLog.h> #import <SurveyMonkeyiOSSDK/SurveyMonkeyiOSSDK.h> @interface RNSurveyManager()<SMFeedbackDelegate> @property (nonatomic, strong) SMFeedbackViewController * feedbackController; @end @implementation RNSurveyManager - (instancetype)init { self = [super init]; if (self) { self.feedbackController = [[SMFeedbackViewController alloc] initWithSurvey:@"VV8X5QA"]; self.feedbackController.delegate = self; } return self; } + (BOOL)requiresMainQueueSetup { return YES; } - (dispatch_queue_t)methodQueue { return dispatch_get_main_queue(); } RCT_EXPORT_MODULE(SurveyManager); - (void)respondentDidEndSurvey:(SMRespondent *)respondent error:(NSError *)error { NSLog(@"respondent %@ error %@", respondent, error); } RCT_EXPORT_METHOD(show:(RCTResponseSenderBlock)callback) { [UIApplication....

November 29, 2019 · 1 min · Khoa Pham

How to use react-native link and CocoaPods

Issue #476 React Native comes with a default React library, and most CocoaPods libraries for React Native has React as a dependency pod, which causes the conflict ...

October 29, 2019 · 1 min · Khoa Pham

What is create-react-native-app

Issue #279 Original post As someone who comes to React Native from iOS and Android background, I like React and Javascript as much as I like Swift and Kotlin. React Native is a cool concept, but things that sound good in theory may not work well in practice. Another layer of abstraction Up until now, I still don’t get why big companies choose React Native over native ones, as in the end what we do is to deliver good experience to the end user, not the easy development for developers....

May 23, 2019 · 5 min · Khoa Pham

How to use Bitrise CI for React Native apps

Issue #277 Original post After trying Travis, CircleCI and BuddyBuild, I now choose Bitrise for my mobile applications. The many cool steps and workflows make Bitrise an ideal CI to try. Like any other CIs, the learning steps and configurations can be intimidating at first. Things that work locally can fail on CI, and how to send things that are marked as git ignore to be used in CI builds are popular issues....

May 23, 2019 · 6 min · Khoa Pham

How to make tag selection view in React Native

Issue #271 Original post Besides React style programming, Yoga is another cool feature of React Native. It is a cross-platform layout engine which implements Flexbox so we use the same layout code for both platforms. As someone who uses Auto Layout in iOS and Constraint Layout in Android, I find Flexbox bit hard to use at first, but there are many tasks that Flexbox does very well, they are distribute elements in space and flow layout....

May 23, 2019 · 6 min · Khoa Pham

How to add app icons and splash screens to a React Native app in staging and production

Issue #268 React Native was designed to be “learn once, write anywhere,” and it is usually used to build cross platform apps for iOS and Android. And for each app that we build, there are times we need to reuse the same code, build and tweak it a bit to make it work for different environments. For example, we might need multiple skins, themes, a free and paid version, or more often different staging and production environments....

May 23, 2019 · 12 min · Khoa Pham

Get to know different JavaScript environments in React Native

Issue #266 Original post React Native can be very easy to get started with, and then at some point problems occur and we need to dive deep into it. The other day we had a strange bug that was only occurring in production build, and in iOS only. A long backtrace in the app revealed that it was due to Date constructor failure. const date = new Date("2019-01-18 12:00:00") This returns the correct Date object in debug mode, but yields Invalid Date in release....

May 23, 2019 · 5 min · Khoa Pham

How to Make Linear Gradient View with Bridging in React Native

Issue #264 Original post React Native lets us build mobile apps using only Javascript. It works by providing a common interface that talks to native iOS and Android components. There are enough essentials components to get started, but the cooler thing is that it is easy to build our own, hence we are not limited by React Native. In this post we will implement a linear gradient view, which is not supported by default in React Native, using native UI component, particularly CAGradientLayer in iOS and GradientDrawable in Android....

May 23, 2019 · 11 min · Khoa Pham

How to dismiss keyboard with react-navigation in React Native apps

Issue #263 Original post Showing and dismiss keyboard seems like a trivial thing to do in mobile apps, but it can be tricky in automatically dismissing it when it comes together with react-navigation and modal presentation. At least that’s according to my initial assumption. This article aims to detail what I have learned about keyboard handling and how to avoid extra tap when dealing with TextInput There will also be lots of code spelunking, thanks to the all the libraries being open source....

May 23, 2019 · 8 min · Khoa Pham

How to use Firebase SDK with Firestore for React Native

Issue #260 Original post At Firebase Dev Summit 2017, Google introduced Firestore as fully-managed NoSQL document database for mobile and web app development. Compared to Firebase Realtime Database, it has better querying and more structured data, together with ease manual fetching of data. The new structure of collection and document is probably the eye catching, this makes data more intuitive to users and query a breeze. From

May 23, 2019 · 7 min · Khoa Pham