6

I need to create two twin apps with React Native and both apps will be 90% the same they will use some shared components and the styles will be different.

the question is : should i create one react native project and from there to building two apps

and the folder structure will be :

  • ReactProject
    • shared
    • project1
      • components
    • project2
      • components
  • index.ios.js
  • index.android.js

and when I want to build one of the apps I will need to change the main component.

or should I create to different React Native projects

and the folder structure will be :

  • shared
  • ReactProject1
    • components
    • index.ios.js
    • index.android.js
  • ReactProject2
    • components
    • index.ios.js
    • index.android.js

I would like to know what is the right approach to do this kind of project

thanks !

milkersarac
  • 3,253
  • 3
  • 28
  • 30
Eran Abir
  • 867
  • 3
  • 14
  • 30
  • This is a matter of personal preference. – KimHau May 24 '17 at 08:13
  • We went the second way, now we have like 5 working apps , with the core javascript services/components in external shared folder and styling inside projects folder. It is pretty easy to work and maintain all of them in this way, but do think twice as much as possible about possible nuances – Ivan Chernykh May 24 '17 at 08:30
  • @IvanChernykh can you attach step by step process for creating such project structure – Syed May 16 '22 at 12:54

1 Answers1

8

This is absolutely a personal preference as stated in comments. One could easily increase the number of structure options beyond 2. Other than that I can share my experience on this.

We build an app, actually 4 (quadruplets), from a single react native project. We choose that way because our apps had to be highly similar. They share same functionality. Furthermore, when one has more than one of these apps installed on their device they can easily switch between apps via deep linking. However they differ on the theme colors, logos, names and backend services to call etc. One of the ways to create multiple apps from a single project is to rename the project. But you can still produce multiple apps while keeping the project name same. Then you need to change some project files accordingly. These files are, for iOS;

  • Info.plist
  • project.pbxproj
  • AppDelegate.m

For Android;

  • strings.xml
  • MainActivity.java
  • MainApplicatoin.java
  • AndroidManifest.xml
  • android/build.gradle
  • app/build.gradle

Actually changing all these files manually is an error-prone and cumbersome action. So that in order to manage these changes we wrote a bash script that converts a base app to the version that we want. Using this approach we can manage 8 apps (quadruplets for iOS and Android) from a single project repo. In the end we are really happy about using React Native which let us build 8 production quality native apps in 3 months without knowing native app development at production level.

milkersarac
  • 3,253
  • 3
  • 28
  • 30
  • Nice! Could you provide a sketch of the bash script you built? Also, that script only manages the renaming process or also deal with the different styles, logos, etc? How did you approach those differences? – jbarradas Aug 09 '17 at 09:50
  • 2
    @jbarradas a sample script is [here](https://gist.github.com/milkers/7ca6c30464c5555a92a8d39ef85f2552) for Android. I would suggest after you build most of the main app then you prepare this kind of a script to morph other apps. Otherwise you need to spend so much effort to keep master files up-to-date. – milkersarac Aug 09 '17 at 11:25