Step-by-step on how to create a react-native app from scratch. This guide is for Mac users.
- Xcode 11
- Android Studio 3.2 or later
Follow the steps in this link to install nvm. https://github.com/creationix/nvm. If you have node already installed, please uninstall it and use nvm to manage your node installations.
As of this current writing, react-native 0.57 works well with node version 8.12.0. Set your node version as default.
$ nvm install 8.12.0 $ node alias default 8.12.0
Install React Native CLI
You will need this to link the dependencies of your project easier. Better to install globally.
$ npm install -g react-native-cli
Create new project and link the dependencies
Now it is time to create your new project from scratch. Keep in mind that creating project with dashes (e.g. my-project) has some issues with upgrading versions of react-native. So better create projects in small cases or camel-case.
$ mkdir myproject $ react-native init
Afterwards, you will need to link dependencies to ios / android.
$ react-native link
Now, you need to run the react-native app. But this won’t run any simulator yet.
$ npm start
Run iOS simulator
Open the xcode project in your project folder / ios.
$ cd ios $ open myproject.xcodeproj or $ open myproject.xcworkspace
In the upper left of your Xcode IDE, press Play button. Yey! You finally run your first react-native application. Congrats!
Running on iOS device
You may be able to run to actual iOS device if you have Apple Developer Provisioning Profile. If you have one, then it will be the same procedure.
To take note is that, if you will run the app on device. You must set it as Release mode. You can change that in Xcode IDE
Edit Scheme > Run > Info tab > Build Configuration: Set to Release
You may also use Debug to on device. But keep in mind that the network of you Xcode and device should be the same. Better to run it on the same Wi-fi network. If not, then use Release mode.