Create-react-native-app: Difference between react-native-init and create-react-native-app

[ghost]

I want to know the Difference between react-native-init and create-react-native-app, I'm new to react native so kindly explain your answer.
I've used both command to create new project, with react-native-init I get a project with iOS & android project folder & with create-react-native-app I get a new project that doesn't has those folders, and running "npm start" project created by react-native-init command doesn't display QR code, why is that, and how can I solve this ?
One more thing what steps should I follow to create android & ios folders in project created by create-react-native-app.
I've read Post-1, Post-2 and Post-3 already.
Apologies If I miss any guidelines in posting the issue, and I know Its not an issue it's just my lack of my knowledge about react-native.

[thidasapankaja]

According to React-native official documents

Create React Native App is the easiest way to start building a new React Native application. It allows you to start a project without installing or configuring any tools to build native code - no Xcode or Android Studio installation required

[Benzer1406]

But using create-react-native-app doesn't allow you to import native modules written in Java and Objetive-C, right?!

[uneeb123]

Can someone comment on @Benzer1406 question? I am curious to know also.

[EvanBacon]

@Benzer1406 assuming you mean react-native init and not some other lib called react-native-init. Using create-react-native-app creates a project that is bootstrapped with Expo.
Whereas react-native init creates a project that is just react-native,

This means:

• You have to use xcode and android studio to run your project
• You won't be able to develop for iOS if you are not on a mac
• You have to plug your phone in and provision it to run your app - which means it's a pain to share.
• You can write your own Objective-C and Java (what fun! 🤦🏼‍♀️🙃)
• If you are using a company computer that runs tasks on ports, you will have to manually change the RN port which isn't fun - you will have to do this every time you pod install or npm install (you will probably do this often)
• Bugs are pretty tricky to debug, especially with custom code - this means less support 😓
• You must manually import fonts into your xcode project.
  ... and much more

I would highly recommend using CRNA or exp init as much as possible.

---

Edit:
Disclaimer: I work at Expo (as is stated in my bio, twitter, instagram, and tinder)

[montao]

I have this problem after ejecting from expo and then trying to build an apk. "Couldn't find index.js" and there is no index.js in the project. The project works well in expo and was created using expo but now I can't make a native build with it because it assumes index.js
```

C:Usersdatangosrckoolbusiness-react-nativeandroid>gradlew assembleRelease

Configure project :app
Configuration 'compile' in project ':app' is deprecated. Use 'implementation' instead.
WARNING: The specified Android SDK Build Tools version (23.0.1) is ignored, as it is below the minimum supported version (26.0.2) for Android Gradle Plugin 3.0.1.
Android SDK Build Tools 26.0.2 will be used.
To suppress this warning, remove "buildToolsVersion '23.0.1'" from your build.gradle file, as each version of the Android Gradle Plugin now has a default version of the build tools.

Task :app:bundleReleaseJsAndAssets
Scanning folders for symlinks in C:Usersdatangosrckoolbusiness-react-nativenode_modules (151ms)
Scanning folders for symlinks in C:Usersdatangosrckoolbusiness-react-nativenode_modules (173ms)
Loading dependency graph, done.

Cannot find entry file index.js in any of the roots: ["C:\Users\datan\go\src\koolbusiness-react-native"]

FAILURE: Build failed with an exception.

• What went wrong:
  Execution failed for task ':app:bundleReleaseJsAndAssets'.

  Process 'command 'cmd'' finished with non-zero exit value 1

• Try:
  Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

• Get more help at https://help.gradle.org

BUILD FAILED in 10m 20s
12 actionable tasks: 12 executed

C:Usersdatangosrckoolbusiness-react-nativeandroi
```d>

[Benzer1406]

@EvanBacon Thanks for your list.
However on the other hand it needs to be mentioned that using expo has some disadvantages too:
I tried to to a summary of the most important points: Please refer to https://stackoverflow.com/questions/39170622/what-is-the-difference-between-expo-and-react-native/49324689#49324689

React Native init:

Advantages:

• You can add native modules written in Java/Objective-C (probably the only but the strongest one)

Disadvantages:

• Needs Android Studio and XCode to run the projects
• You can't develop for iOS without having a mac
• Device has to be connected via USB to use it for testing
• Fonts need to be imported manually in XCode
• If you want to share the app you need to send the whole .apk / .ipa file
• Does not provide JS APIs out of the box, e.g. Push-Notifications, Asset Manager, they need to be manually installed and linked with npm for example
• Setting up a working project properly (inlcuding device configuration) is rather complicated and can take time

Expo

Advantages:

• Setting up a project is easy and can be done in minutes
• You (and other people) can open the project while you're working on it
• Sharing the app is easy (via QR-code or link), you don't have to send the whole .apk or .ipa file
• No build necessary to run the app
• Integrates some basic libraries in a standard project (Push Notifications, Asset Manager,...)
• You can eject it to ExpoKit and integrate native code continuing using some of the Expo features, but not all of them
• Expo can build .apk and .ipa files (distribution to stores possible with Expo)

Disadvantages:

• You can't add native modules (probably a gamechanger for some)
• You can't use libraries that use native code in Objective-C/Java
• The standard Hello World app is about 25MB big (because of the integrated libraries)
• If you want to use: FaceDetector, ARKit o Payments you need to eject it to ExpoKit
• Ejecting it to ExpoKit has a trade-off of features of Expo, e.g. you cannot share via QR code
• When ejecting to ExpoKit you are limited to the react native version that is supported by ExpoKit at that point in time
• Debugging in ExpoKit (with native modules) is a lot more complicated, since it mixes two languages and different libraries (no official Expo support anymore)

@EvanBacon Feel free to correct the list if something is not accurate or to add more points

[EvanBacon]

@benzer thanks for a more detailed list. I forgot to mention that expo has this anti-pitch which explains why you might not be interested. https://t.co/yfqFLKS10V

I should also mention that all the gl stuff is far more advanced in expo, things like phaser.js, and pixi.js only work in expo at the moment.

[Benzer1406]

@EvanBacon having studied a lot now there are still three questions left:

1. What would be my interest to use a react native project if I can use native code and all Expo APIs in an ExpoKit project? In an ExpoKit project I can still use all Expo APIs and all React Native APIs, right?!

2. Could I use Expo APIs in a React Native project if I install expo with npm install --save expo?

3. What is the difference between React Native API and Expo API?

I posted them on StackOverflow: https://stackoverflow.com/questions/49328412/difference-between-expokit-and-react-native-project

[Ntiyiso-Rikhotso]

Sorry to jump in,

I also want to understand that how do you create those 2 directories namely android/ and ios/ when used create-react-native-app MyApp ?

Out of the 2 methods react-native init and create-react-native-app MyApp, which one is most advisable/recommendable to use?

[amalan-shenll]

When you go for taking apk build you need Android inside project structure, that can be easily added in react-native init or you have to do npm run eject in create-react-native-app to get react-native init folder structure, so react-native init is good for me.

[jonerer]

Since this discussion shows up on google:

Disclamer: @EvanBacon works for expo

[nitinsh99]

I understand this conversation has been answered and closed, but would someone care to explain the reason why CRNA doesn't work with Native modules? On a deeper level I am trying to understand what is the difference between a React Native module vs a Native module and what's it about a native module that makes it incompatible with CRNA? Thanks

[AaronM04]

@nitinsh99 I'm by no means an expert, but it appears that Expo relies on your app being pure JavaScript. This limitation may exist to support hot reloading in the Expo app.

[pawarvijay]

thanks @Benzer1406 .i got cleared , i will not use expo , i will eject , don't want suprises

[Bhavin9898]

Can i run application without android studio in react-native-init using the SDK. If yes then how?
I have tried but i have not got any success until after the 1 week.

[pawarvijay]

without android studio you can run react-native https://facebook.github.io/react-native/docs/getting-started.html

[Bhavin9898]

@pawarvijay I have already checked this documentation. There are providing two type of methods.

1. Method - create-react-native-app AwesomeProject There are we don't use android studio but i don't want use this method because in this method i have to run app using Expo and minimum size of build APK is 25 mb.

1. Method - react-native init AwesomeProject
   According this method, We need to install android studio so my computer system have enough RAM so please inform me how can i build and run APK using this method without android studio.

[pawarvijay]

in link https://facebook.github.io/react-native/docs/getting-started.html
There is TAB called Build Project with native code
Then choose development OS
Then choose target OS
Then you will get baby steps to create app

[roshnet]

@Bhavin9898 The only reason I don't prefer using Expo, is because I don't want a simple app to weigh 30M.

I'm using react-native init, and so far haven't needed to launch Android Studio.

Just plug-in your device via USB, run react-native start in one terminal, and react-native run-android in another. It runs Gradle and other things for you, so no need for Android Studio unless you're using an emulator.

[brentvatne]

if you don't select any templates, create-react-native-app will create a bare react-native project that lets you use expo modules in it, your app size will be the same as if you initialized with react-native-cli and installed a couple libraries like react-native-gesture-handler and reanimated

this basically saves you the trouble of doing this: https://docs.expo.io/bare/installing-unimodules/ and you can install any of the apis listed here https://docs.expo.io/versions/latest/

if you select a template, you can choose from one of these examples: http://github.com/expo/examples - this will created a managed expo app, but you can just run npm run eject in that project to get the equivalent of what react-native cli would give you.

i hope that clarifies things for people in this thread! locking