React-Native does not shield you from needing to know about the native aspects of the project

This post is meant to be read in the context of its parent post "Lessons Learned on a React-Native Project". If you've stumbled on this particular page randomly, I'd recommend jumping over to that post and starting from there.

One of the biggest differences I've noticed between React-Native and Xamarin is the fact that React-Native has a much greater dependence on the underlying native platforms you're developing for. As it turns out, the "React-y" part of your React-Native project is actually a tiny part of your overall solution. Xamarin, on the other hand, abstracts away (successfully for the most part) a huge amount of the native ecosystem. More on this later.

When you create a React-Native project, you're given the following things...

  • The usual node-related things (package.json etc)
  • An App.tsx file, which serves as the entry point for the Application
  • An ios folder
  • An android folder

Now that may not seem like much, but underneath those two android and ios folders are two completely separate (and very complicated) ecosystems. And you will eventually need to delve into these folders, at which point (whether you like it or not) you'll start to get intimately familiar with how each of these ecosystems work, and how it impacts your project.

This means potentially you'll need to get to grips with;

Android
  • Android Studio - The default IDE for use with Android projects.
  • Gradle - The underlying tool that drives the Android dependency and compile processes for React-Native.
  • Android SDKs - Of which there are so many.
iOS
  • XCode - The default IDE for use with Apple projects, which also serves as the build tool.
  • iOS SDKs - Of which there are so many.
  • CocoaPods - A dependency manager specifically for Swift and ObjectiveC libraries. Expect to deal with this if you're having to integrate 3rd part components in your application that hook into native concerns.

And I'm not even touching on the different hardware configurations for each of these platforms. ::laughs in Android::

Oh, and while I'm talking about hardware I just want to make something very clear: Do your development on a device, not a simulator. Simulators do their best, but we had quite a few times where things didn't quite work as we'd expect. Especially with regards to styling. So if you're starting a React-Native project, I'd make sure you have at least one phone from each platform.

If you're starting to think "wow, that is a lot of stuff I need to be worried about"... Yes. Yes it is. :)

Next Section -> "Understanding the underlying build tools is extremely important."