Intro to React Native

Photo by Rahul Chakraborty on Unsplash

This week I started learning React native. This is my experience with it. I hope this helps anybody new to React native at least get up and running.

So first thing to do is make sure you have the latest version of node. You can do this by typing:

node --version

into your terminal. If you have node it will show you the version number you are currently on. If not, you can go to https://nodejs.org/en/download/ and download the LTS version from there.

Once you have node installed you will want to install Expo. This can be done by typing the following into your terminal:

npm install -g expo-cli

You may need to put sudo before the above command, on a macbook.

Once Expo is installed globally you’re ready to create a react native app. This is done by typing:

npx create-react-native-app My-app

the My-app part is whatever you want your project to be named. There you go, a fresh new react-native-app great!

you can run:

npm start 

to start your project.

So now you need to preview your app. there are a few ways of doing this.

• Download the Expo app onto your IOS or Android device and then open the expo app and scan the QR code you seen when you ran npm start.

This will open your app on your physical device and in my opinion the easiest way to do this.

• You can select Run in web browser and it will open on your machine. This is also quite easy but not an accurate representation of what your app will look like on an actual mobile device.
• If you have a Macbook you can download Xcode from the app store. Xcode is an Iphone ios simulator. Keep in mind Xcode is around 11gb’s so it’s quite large and takes some time to download.
• If you are on a windows machine you can’t use Xcode so Android studio is most likely what you will use. Download Android studio here. This can be used on a Macbook too so if you have a good Macbook you could have both running and see Android plus Iphone being previewed.

In my experience the most reliable way to preview my app has been on my own Android device which currently is a Samsung Galaxy Note 20 Ultra. I was having some problems with Xcode slowing down and slowing down my machine. Android studio seemed a little more reliable but still froze from time to time. If you do freeze just control c to stop the app and run npm start again then refresh whatever you’re using to preview and that seems to work everytime.

Thanks for reading and I will be continuing my experience with React native in my next blog so stay tuned for more…