The Comedy Companion

This interview was given by Derek Sweet

Could you introduce your app in a few sentences?

The app is called "The Comedy Companion". It is a productivity tool for stand-up comedians that lets them manage their jokes and set lists, as well as track all their shows. It also includes a timing/recording feature that allows the comedian to simply time their set, or record the full audio if desired. I developed it for myself as I was tired using 2 or 3 different apps, none of which were tailored for stand-up comedy, to do the aforementioned basic tasks that most comics need. I figured I would release it out to the wild as well, thinking maybe a few other comedians with a similar process to my own would benefit from it, but it has thousands of downloads now so it turns out our processes were more global than I had predicted. It is available for both Android and iOS platforms.

What made you decide to switch to React Native?

This is actually the second app I have made for stand-up comedy. The first one was for the general public to find new comedians and shows in their area. It is called "Comediate", and also has a website at comediate.com where the comics can sign up to be included in the app. I made that one in Objective-C since it was what I knew at the time. I quickly discovered once the app was complete that most comedians are using Android since it is generally the cheaper option, as it was difficult to get them to sign up when they couldn't actually see the app in action. We discussed making an Android version as well but the idea of doing all that work again in Java just made my head reel, never mind maintaining two separate code bases. So, when I had the idea for "The Comedy Companion", I knew that I had to support both platforms or there wasn't much reason to do it at all. I was an Angular guy at the time so I messed around with Ionic but I just didn't like the look and feel of the apps. Fortunately I started a new job where we used React Native quite heavily so I was incentivized to learn it and also got to work with it 8 hours a day and sharpen my skills. Once I saw how simple, straight-forward, and smooth the development process could be with RN I was hooked.

How did you transition to React Native?

Being a full-stack developer with about 14 years of consulting experience, and then changing jobs 3 times in the past 3 years, transitioning to new technologies is just a part of the day-to-day activities for most of my career, which has its benefits and drawbacks. I have pretty much never stayed within a single technology for more than a year or so, so picking up something new and learning on the fly comes quite naturally to me these days. Being primarily a web developer for most of my career made adopting to the syntax of JSX very natural, and having a team of experienced React Native developers to answer questions about some of the trickier aspects of the language was a great help as well.

Have your tried other cross platform technologies before using React Native?

Just a brief foray with Ionic a couple years back. I don't know where they are with it now but back then it was basically just a webview on both platforms. It was slow and didn't have the look and feel of a native app so we quickly abandoned it and went with native implementations. One of my favourite aspects of React Native is that the apps retain that native look and feel with just a single code base. I think it is phenomenally cool that, other than the root index files, I don't have a single .ios or .android file anywhere in "The Comedy Companion" codebase as most everything was able to be shared. There are a very select few places that use the Platform component to determine whether it's running on iOS or Android and those were pretty much just for styles and some basic height modifications within views. The ability to bridge to a method in your native codebase when needed, as well, is quite intuitive so even when you can't do it within RN you always have that option. Just brilliant, in my opinion.

What has your experience been working with react native in terms of app performance, have you noticed any impacts?

I've found React Native to be wonderfully performant on iOS but a little lacking on the Android side. In order to achieve the 3 nicely sliding panes that you see in The Comedy Companion app I developed a reusable component called react-native-sliding-panes, and if one plays with it they will quickly notice that it performs much nicer on iOS than Android, especially in development mode. Once I learned how to make a release build on Android it became usable, but before that I was devising ways of disabling the animation because it looked so terrible on every Android device I tried. Even on a release build, the animations just don't look as nice as they do on iOS. Animations, however, are the only place I've really noticed a problem.

How has adopting React Native affected developer productivity?

Well, given that I am the sole developer on the project thus far, I would say it has greatly increased developer happiness because I really, REALLY love React Native. It isn't quite enough of an increase to counter the incredibly depressing nature of the corporate comedy season (christmas parties, fundraisers, and other venues for comedy where half the audience could care less about the show), but it's something! In terms of productivity, I just took a look at the commit history for the project and I started it in early April and put out the first version in the 2nd week of June. For a single person with two careers and two kids, working on a project in their free time for 1-2 hours a night, to be able to put out a fully functioning app used by thousands of people in just 2.5 months: I would say that's a pretty damn productive framework.

Which tools, libraries and frameworks are part of your development process with React Native?

IDE: Rubymine
State Management: Redux, Redux-Thunk
Components Used:

Really need to add a test suite to the project.
Definitely would start with Jest, have read that it's the best for RN. Most of my testing experience comes from the Rails world with RSpec, but I have done some work in Angular with Chai promises and Mocha as the testing framework.

What resource have you used to learn React Native? Books, tutorials, courses etc. Anything you can recommend?

The first book I read on the topic was Learning React Native from O'Reily. I then picked up React Native Cookbook and Mastering React Native published by Packt. For the most part, however, I've done most of my learning on the job and by reading the official React Native documentation. The React Native subreddit has been a great resource as well for whenever I had very specific questions and/or problems.

What do you think could be improved in React Native?

Hmmm good question. I always have difficulty which such things because I hate trying to find the things that are wrong with something that has made my life so much easier :).

They definitely need to up the Android side of things, in both performance and ease of development. I found that I would struggle with trying to get things to look right on Android where on iOS they just looked perfect from the get go.And by struggle I mean I would have to make little modifications to styles to get things the right height, or centered properly, etc..

I mean if you just look at the official list of components in the documentation we've got: DatePickerIOS, MaskedViewIOS, NavigatorIOS, PickerIOS, ProgressViewIOS, SegementedControlsIOS, SnapshotViewIOS, TabBarIOS... on the Android side you just have: DrawerLayoutAndroid, ProgressBarAndroid, ToolbarAndroid, and ViewPagerAndroid
Looking in the API section for 5.1, however, I'm seeing a lot of Android specific stuff there so maybe they are starting to pick up the slack on that side.
Comedy Companion is made in RN .42.3, so I'm quite a bit behind on things.
I would like to hear that KeyboardAvoidingView is working properly now, when I was first trying to use it for my app it didn't do what it was supposed to do at all and I had to do all my own handling of the appearance and disappearance of the keyboard which was a huge pain. That kind of thing should just be automatic since bringing the keyboard up is such a frequent thing.

Anything Anything else you would like to mention?

Would just like to mention again that if anyone likes the sliding panes that is used for the primary navigation in the app they can always use the component themselves by getting react-native-sliding-panes. Also, since I come from a strong Rails background, I developed an ActiveRecord style layer for interfacing with AsyncStorage that I called react-native-sweet-record that allows one to define models and save them to and retrieve them from AsyncStorage seamlessly. There is some rather detailed READMEs available for both projects, and if anyone has any questions about them I am very open to talking to them.