Getting Started with React Native on Zorin

So, first up: why am I using Zorin, and what is it?

Well, Zorin is a flavour of Linux quite similar to Ubuntu, but a bit more like Windows. It takes a lot of the 'heavy lifting', as you might call it, out of running Linux. I'd still be using Windows, only my laptop never ran Windows 10 very well. It was always painfully slow. My wife's, with half the RAM, runs it better! Weird. Anyway, I'm happy enough with Zorin.

Here's what I consider a 'pro' tip (and apologies to whomsoever I may be stealing it from!): never take the easy way! For example, never copy and paste code (unless it's part of a tutorial where you're learning something else - like copying and pasting CSS when you're learning JS in some form). If you do that, all you're teaching your brain is to do Copy+Paste. Always type it yourself, if you can.

Now, I'm following Hitesh Choudhary's React Native 101 course on YouTube (https://www.youtube.com/watch?v=kGtEax1WQFg&list=PLRAV69dS1uWSjBBJ-egNNOd4mdblt1P4c&pp=iAQB).

I've tried others, but this one seems to work best with Zorin so far. I've tried others, using Expo, which I just couldn't get to work, so I recommend Hitesh's course as the best if you're on Zorin (possibly Linux generally).

Here are my notes from the installation and set up (the first 2-3 videos of the course).

First of all, if you're a Linux newbie (like me) make sure you search for stuff online. YouTube is full of videos of people who've already successfully done what you're trying to do. This is what saved me every time my system didn't behave the way Hitesh describe.

Here are my top resources for this:

https://reactnative.dev/docs/environment-setup?guide=native&os=linux - make sure you choose Linux and then the type of phone you're using (Android or iPhone) to get the right instructions and follow the instructions all the way through.

Everything below is to help clarify the instructions on the page above.

Don't follow the instructions for JDK. Watch this video instead: https://www.youtube.com/watch?v=Lin1q9S4zTU&t=18s

Watch this video for how to install Android Studio: https://www.youtube.com/watch?v=Xss9fFK30Tw

As Hitesh points out: we're not actually using Android Studio, only relying on some of the dependencies that come with it. SO: ignore the React Native instruction about Watchman. We don't need it...yet?

Now go back to Hitesh's video to set up the application. LOOK OUT FOR AND FOLLOW HIS INSTRUCTIONS FOR ADDING THE local.properties FILE!

Go back to the React Native page for more instructions on how to put your phone into Debugging Mode so you can see your app on your own phone. For my Samsung Galaxy A21S phone, this video saved me: https://www.youtube.com/watch?v=n2Gqy4K5c58

When I told my IDE (Visual Studio Code) to get started with "npx react-native run-android", it took a LONG time - about 15 minutes. And then it seemed to fail.

BUT...

It didn't fail, it's just that this command only builds the basic app. To then push the app to your phone. From now on, you have to start the app using "npm start" and then press 'a' to run on Android when you see the Welcome to Metro logo and message. This time the 'build' only took about 40 seconds and I did indeed see it on my phone. Hooray!

On to the next video and the first React Native project!