Leap Card

Track balance and journey history

Could you introduce your app in a few sentences?

The app that we developed with my friend is called Leap Card app. You can check it on the app store. Unfortunately we did not release it on Google play store, because there is one developed already.
Leap Card app is a fully featured app, with in-app notifications, Today Widget, and with Apple Watch app.
This app is designed for people who are using special travel card for public transport in Ireland. It helps you track your balance and your journey history. The app is paid and already has thousands of downloads. It is in top paid apps in Ireland, which is awesome!

What made you decide to use/switch to React Native?

I personally think React Native is awesome tool and I will try to reason it by listing the main points below.

  • It is the easiest way to start developing mobile app for front end developers, especially if you have experience with React. Don’t be scared with people’s hatred towards this tool. In most cases this tool will satisfy your needs and performance will not be an issue.

  • It’s a very fast way to develop both an iOS and an Android app at the same time. If you're just starting your journey in mobile development, React Native has tons of plugins, which will work seamlessly on both platforms.

  • Awesome development process, and great debugging experience. Your React Native apps are refreshed immediately when you make a code change, no need to re-build your app. Debugging looks very familiar to debugging web, you still can use your advanced debugging tool called, “console.log”.

  • Endless serverless options. I am a big fan of AWS and Firebase. Both are great, both have React Native setup in the documentation. For Firebase I suggest using a library called react-native-firebase. The integration might be a bit clunky, but it’s totally worth it. For AWS I suggest checking AWS AppSync, with just few commands using AppSync CLI, you have auth, analytics, and GraphQL setup in your project. That’s really great!

  • Framework backed by facebook, with awesome community, and increasing popularity. You won’t be stuck, there is always someone that can help you.

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

  • Ionic framework. I was using Ionic framework for a few years previously, and man it was a pain. From the first second you can feel it is not a native app. Basically it's just one WebView with a single page application loaded into it. Your app opens the native browser, either WebKit or UIWebView, and renders your page. The user is tricked into thinking it's a native app. Access to the native code is made through cordova plugins using the Cordova bridge. The bridge connects JavaScript with your native code. Doesn't sound promising, right?

  • Flutter. It is one promising framework backed by Google, built on top of Google’s Dart language. To me Dart was dead, but it was revived with Flutter. The main difference between Flutter and React Native is that Flutter compiles to native code, React Native on the other hand, has only a native view, the logic however is still built in JavaScript. React Native has a C++ bridge written to help communicate between JavaScript and native code.

I have written an article about my Cordova experience and in what cases it might become very useful: Why and When Cordova is better then React Native ?

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

Performance is satisfying. If you think your app is slow because of the framework, please revisit your code, most of the times you will find that the problem is in there.
All the View components and most of the animations are on the native thread. It’s exciting how much you can achieve with React Native.

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

I am a big fan of Visual Studio Code, that’s what I am using for all React and React Native projects.

I am not using any special build tools, just Xcode and Android Studio. I have tried using Expo developing tool for React Native, but I was very quickly disappointed in the tool. As soon as you need to write some native code in your project, you will have to eject from Expo and use raw React Native. This is just my personal opinion, I suggest you looking into Expo anyway.

I do recommend using Typescript, especially if you are not a sole developer of a project. Typescript, backed by Microsoft, has great support from the community, it is growing faster than any other typing system.

ESLint is a must for your project, I do think that ESLint should be used on every single project, it makes your code readable and consistent. It’s very easy to integrate and it has tons of plugins. The one that we are using is eslint-config-airbnb. Don’t be afraid to turn off the rules you consider unnecessary. Don’t consider airbnb eslint rules as your bible. The rules were specifically designed for their use case, feel free whitelisting the rules that interfere with your coding style.

What are some things that you don’t like about React Native or that need to be improved?

  • Navigation. I think, today, React Native is the best tool for cross platform development. But it’s far from perfect. Every developer who tried React Native will say that the biggest pain is navigation. It looks like it's a very complex task to solve. I think React Native would benefit a lot from a single standalone reliable navigation library.
    Currently, we have more than 4 navigation libraries and none of them is great. I suggest using React Navigation, it’s a pretty straightforward library, it's easy to use.

  • Linking Native libraries in React Native is not stable. It has become much better in the recent versions, but still it could be better. Many times, after upgrading a project, or when setting it up from scratch on another machine would cause your builds to fail. I spent quite a lot of time figuring out why my library is not linked, or it is linked incorrectly. I think React Native on iOS should be using CocoaPods as a default dependency manager.
    Unfortunately, linking on Android is not any better.

Anything else you would like to mention?

I have 3 years of experience in React Native and 5 years in Web Dev. If you need help with your React Native project or you have any questions feel free to reach me on Linkedin.