RNEC Quest 1: The realm

The beginning of a travel: why React Native and not something else

RNEC Quest 1: The realm

Let's start with an important introduction: I always used Ionic with Vue for my mobile apps, but you, as everyone should do, must choose the technology based on your needs and, eventually, admit that what you used is not the best deal.

This app is a PoC for a personal area mobile app to understand if React Native is, or is not, the right path to follow.

What I need is:

  • Authentication via OAuth2, in my company we use FusionAuth, similar to Auth0

  • Secure storage to save the user auth and refresh token

  • Simple to interact with NFC

  • Easy to build and deploy

  • Customizable and extendable UI to match our design and identity

  • As a plus, accessible to everyone with frontend or full stack knowledge.

👎Ionic + Vue

Since Vue and Nuxt are the main frontend stack in my company, it would make sense to go with Ionic. I didn't need outstanding performance (and, to give a pitch Ionic, nowadays it's really fast), but I later found out that the only two required points I have, authorization and secure storage, are part of a premium package that costs... 2500$ per month.

You could achieve a similar product with open-source packages, such as Capacitor Secure Storage and Capacitor OAuth2, but they seem to have a few issues on Android and you would create a Frankenstein. Also, a lot capacitor/ionic/cordova plugins are likely to be outdated.

Pros:

  • Available for Vue (but also React and Angular)

  • Beautiful UI out-of-the-box and easy to use

Cons:

  • No official (free) support for OAuth and secure storage

  • There are community-driven libraries, but likely to be outdated

🤷Flutter

You can't talk of mobile development nowadays without talking about Flutter. It's a great product, with a lot of different plugins to reach my needs, but I don't know anything about Dart (Google, why yet another language?) and, although I'm willing to learn it, it's an unnecessary overhead for an app (for me).

Pros:

  • Stable, powerful and supported by Google

  • Trusted by many big companies

  • Great community with a lot of solutions

Cons:

  • Dart: I don't know it, and for now I'm not interested in investing in learning it

  • How many people know Dart? The eventual hiring would be hard

👍React Native + Expo

Honestly, I never really liked React, but I think React Native is one of the most robust yet versatile solutions out there to build mobile apps; since it's React-based it's also really accessible to whoever has front-end knowledge, that's why we are here 😄

In the last few months on Twitter I came across Expo - not knowing what it was - and, although bare React Native would be enough, Expo seems to be the current standard and almost required for modern development.

I quickly went through their (beautiful) docs and found out about routing (we're going to talk more about this in a future post), but most importantly about authorization via OAuth2, secure storage, and how these topics integrate into the navigation flow. Basically, everything we need!

I acknowledged lately that in the past years, Expo was not so much liked, because of several issues and missing parts, but I joined the "Expo movement" right when they released the SDK 49 beta (and then the stable release) and, looking on how they precisely worked and how fast the answered to community issues and discussions on Discord and Github, I've fallen in love.

Pros:

  • Stable, powerful and supported by Facebook (well, the last commit on React is a year ago, but...)

  • Trusted by many big companies (Expo is even being used by Tesla), among with Facebook (and their products, Instagram etc.) of course

  • Great community with tons of packages, since they come from React

  • Easy to run locally, to build and update live through EAS (cloud-hosted services)

Cons:

  • Expo Router, although reached v2 stable, still lacks some features (such as customizable linking from deep linking, which is possible on bare React Navigation)

  • Expo documentation is really great, but a bit messy when talking about EAS different builds, how to build locally etc. (I found myself lost multiple times asking: how the hell can I build locally the app?)