React Native Tutorial #2 - Creating a React Native App

Hey gang, in this React Native tutorial we'll talk about the different way to create aReact Native app, and use Expo to create ours. I'll also show you how to run the app on a real device & android emulator.
----------------------------------------
🐱‍💻 🐱‍💻 Course Links:
Course files - github.com/iam...
🐱‍💻 🐱‍💻 Other Related Courses:
Complete React Tutorial - • Complete React Tutoria...
React Hooks & Context Tutorial - • React Context & Hooks ...
Modern JavaScript Tutorial - • Modern JavaScript Tuto...

[@MrGreenpaulo]

What makes you the best, Shaun, is that you show and explain every single step (e.g. recording your phone to show expo client) - you don't assume or pass-by anything! Legend!

[@NetNinja]

Thanks, I don't like to assume :)

[@greenjd3700]

@@NetNinja I can't get metro bundler to work in docker. whenever I go to localhost it says stuff like "This site can’t be reachedlocalhost. refused to connect."

[@abdelaesus6678]

except how to open that android emulator

[@maycodes]

Shaun is the best

[@warrengaytero1682]

this man is the G.O.A.T programming instructor.. makes everything clear and simple . God Bless to you teacher.

[@oyeibrahim]

I was procrastinating on watching this tutorial being that it's a bit old but after trying different current tutorials on KZbin I'd to come back to this. And as expected you make it easy to understand. In other tutorials they were installing like 7 packages from the jump. That's wild for a beginner 😂

[@Gamerfan2000]

Man I remember the first time I used Android Studio and how much of a resource hog that program is. Don't even think about installing it on a computer without an SSD. Thankfully, we will be using it only for previewing the app, I remember in college we had to develop apps using the Java programming language and I also remember that It was such a pain to run on my old laptop. Since then Android studio is the stuff that nightmares are made of. Also, I have been a long time subscriber of yours and like always you have a great series, your new series on creating SPAs using React is probably the best out there. Everything I learned about web development I basically have to thank you for.

[@adante407]

The Don of KZbin.

[@julianstorm7722]

Bit late to the party. Thanks for all your work. I accidentally initially installed the expo CLI via npm and after some research figured I better use yarn. I knew yarn is fast but 161 sec(npm) vs 43sec yarn is fair a bit. Would love to see you discussing different package managers one day. Cheers

[@sivaanjaneya9360]

Thank you so much for giving this installation and proper way of react native

[@mkilphewer2425]

I was so confused of how to start a react native project...other videos i watched on KZbin too confused me because everyone were doing it differently.But your explanation is crystal clear brother at last i was thinking it will be nice if you just edit the text in app.js and show the changes in the virtual device and you did that too.Good explanation brother.Thank you so much.

[@kkkl7400]

What a Greatest Teacher !. Thank you for your video. It really helps to study React Native by myself : D

[@DeveloVooshGWeb]

I'd recommend you to people who ask what tutorials to watch You explain everything super clearly and don't actually just tell people to copy this code and stuff

[@FixDaily]

You are awesome, as you promised the best tutorial on youtube :)

[@Fullflexno]

Man, you are so through! Love your stuff! Cheers from Norway

[@dimasmfth]

No, sir! The first thing to do is Fall in Love! :D

[@okechukwuobi707]

Always confident to code because of his content

[@kitaabehijran7045]

Another why i come to your tutorials is your wholesome accent..

[@gyenabubakar]

You know what, I don't know what to say. Bringing up this course... You're the best Shaun. That's all I can say. ✌️💥

[@techstacker5361]

I love your content, but I'm a bit bummed out because when I found this series thought this was going to be one of those rare React Native tutorials that don't use Expo. It seems that nobody wants to teach the official React Native CLI, I guess it must really suck to learn then? 😂 I personally need to learn _without_ Expo for specific project-related reasons. Do you happen to know some good resources for that besides the official docs?

[@sergiyrudenko905]

Man i have the same problem, looking for course without EXPO!

[@techstacker5361]

​@@sergiyrudenko905 yeah, it's like there's no market for it, for some reason, but there should be. None of the devs I've talked to would use Expo in a real client project (which surprises me a bit, but I guess there's a reason). If the React Native developers I've talked to are correct, Expo is useful if you need to build a small app quickly, or but not if you need custom functionality or real native code (Java, Swift) in your app.

[@SmartWizzard]

You can check this pro.academind.com/courses/react-native-the-practical-guide-2020/lectures/13929460

[@vladislavstratan4912]

@@SmartWizzard it uses Expo too

[@vladislavstratan4912]

@@sergiyrudenko905 ​ Have you found some course without Expo?

[@jaredlising-simplybrewedph]

hello guys!. glad to be here by the way. :) from the installation process i've encountered an error when running the created project - myproject. it seems that though i inititally installed the expo using NPM globally, the project seems still lacking the expo module that is requiring installation of yarn to be able to properly install the expo module. with that, ive installed the expo module properly using yarn. and the rest of the procedure is as it is. :) thank you!

[@jonathanletchford1714]

I'm getting that error too!

[@sameerdewan881]

what makes this extra potent is that kendrick isn't even trying to be aggressive yet

[@aimach413]

Thank you for your tutorials ! It's so clear !

[@NetNinja]

Glad to hear that :) thanks for watching

[@nour-eddineoumakhlouf5296]

Siplicity always pays! Simply the best !

[@matthewbeardsley7004]

Ahh, setup seems complicated! Excited to start React Native, but wondering if I should finish flutter first...

[@NaveenKumarasinghe]

I don't skip ads. That's the only way I can help Ninja.

[@NetNinja]

Thanks so much, really appreciate it :)

[@Toussaintiradukunda]

please we need an updated course of this one

[@tonsantos21]

Can I use genymotion for preview the app? Will it work like in the video or it will require some more configuration? Thanks for the content. I didn't know your channel, but I'm following this series right know and I am really enjoying. You're very clear and concise in your explanations. Thanks man!

[@olimbeknizomov8081]

i always enjoy your videos thanks man

[@eazlai]

Does yarn vs npm matter? I've always been an npm guy. What's your opinion?

[@hooiyan6040]

This is what I'm waiting for!! **ps: Opps, the title has some typo... Hope you will notice it soon!

[@NetNinja]

Haha yeah, thanks. Will fix it now :)

[@cecon3315]

nice content, a huge thanks from Brazil !

[@maycodes]

Thank you shaun, You are the best !!

[@WarVic]

Please select firebase for the database in this course :) Thanks

[@olaoluwaadeyemo6939]

i loves your videos bro.... and just a suggestion.. please make another video, where you make a more advanced app with react native and all.. with more designs and things like that.. Thank You Shaeug

[@ramprasath25]

Much waited course.. kudos :)

[@Equilibrier]

super tutorial, congrats, thanks !!!

[@sediqabdullahi2078]

Thank you so much Shaun God bless

[@flamingoodness4923]

Hello! Excited to finally learn react native! I just have a quick question. This tutorial series is now 3 years old, I wanted to know, is this tutorial is outdated, or does everything here still apply in 2023?

[@immense_dreamer]

it is a little outdated, for example expo doesn't recommend to install globally and such, still a good tutorial tho.

[@flamingoodness4923]

@@immense_dreamer ah ok. Thanks!

[@suzunome47]

Android Studio emulator is a nightmare to run when you're using a PC with an AMD processor. Tried every resource I could find on Google and I'm still not able to make it work on my computer. I have no choice but to use my old phone for now.

[@okechukwuobi707]

I love you stuff from Nigeria

[@shakilkhanprogrammer]

Does not work for me I faced this issue [09:05:28] Input is required, but Expo CLI is in non-interactive mode. --template: argument is required in non-interactive mode. Valid choices are: 'blank', 'blank (TypeScript)', 'tabs', 'minimal', 'minimal (TypeScript)' or any custom template (name of npm package).

[@MrVisheshsingh]

stackoverflow.com/a/58616080

[@youtubestar1525]

👍 Thanks mate for this course 👍

[@armaansoni6906]

Your channel's great and all, but do you recommend any sources which teach react native via webstorm instead VS code?

[@rajpatel8650]

npm start does not open in a browser. I tried the command W for open web and it still didn't work. How do I fix this?

[@trantrungnghia9642]

I now have this problem too. SOS

[@jezjeza1633]

thanks for your works man!

[@urazeem]

Dear sir, What about low RAM Systems where We can't install Android Studio. In such case Can we create an app and do all the things which you have done in the next tutorials? Without installing Android Studio?

[@osamagamal495]

if you're on a mac, don't forget to include sudo before installing expo. sudo npm install expo-cli --global

[@tomatomath3465]

why i can't go to metro bundler? instead it is giving me a blank page "Open up App.js to start working on your app!"

[@eduardkoshkelyan8670]

Great explanation

[@skverskk]

Excellent tutorial

[@NetNinja]

Thank you! 😃

[@imbue1112]

if you're on Mac OS, you need to hit F1 & install the 'code .' command before you can use it

[@ahmedhabeeb2499]

how easy to follow this thanks habibi

[@maritomesquita6719]

i activated the notifications and after this i would do it twice if i could

[@gopalmandloi6374]

Why we need to install expo on android emulator as well, ( i mean it is doing it automatically), but why it is needed , since it is a direct mobile emulator anyways. ? Thanks Shaun

[@immanuelwandeto6481]

The app runs ontop of the expo client app so it doesn't build native code in development.

[@unknownman1]

hey shaun, just wanna know since we are using expo CLI so after downloading the github repo do we have to use npm install or expo install command??

[@justyusaf]

You can use either one

[@smaug9833]

Expo is just for testing, right? Can you show how to bundle the app in apk or ipa and install it on android or iOS

[@malikojokorede7829]

Thanks for this, but how do we set up the same environment for mac?

[@tinvo5369]

Hi bro, this is an awesome video but I can't autosave when I change my code, I must run on an android device so screen mobile can be changed, How can I fix it?

[@manoj-k]

🔥🔥🔥

[@rosgarcia6999]

Sir good day! Can you tell us how hard is it to switch from expo cli to react native cli. I do have a hard time figuring out what tutorial would I watch. Some says expo cli is good but do have many cons.

[@armaansoni6906]

I just had one doubt, which option should I go for when i am choosing the virtual device on Android studio when i have one plus 3t(ik....i am planning to get a better phone).

[@prafulrane3591]

What should I do next Can you make a pathway video to know how should we follow your playlist from your channel for every technology covered on your channel?

[@mubeenjutt4397]

Hello dear! Can you plz tell me which color theme you used in your VS code

[@cjtay]

Will you be launching a full React Native course on Udemy soon?

[@NetNinja]

Hey no, I'm putting the whole series on KZbin :)

[@brodWenDayondon]

@@NetNinja Awesome!

[@lakshman587]

@@NetNinja Thanks a lot

[@michelchaghoury870]

can you make tuts about how to use galio framework with react native pleaseeee i always receive errors when tying to use Galio

[@ashwinbordoloi]

Thank you!

[@aftabamin8508]

Hello, I need a flat list with optimization for the contact list. could you create a video for this? I didn't find a single thing on this. I have tried all the given solutions on the internet and perform all the optimization.

[@Shmoji]

Could not get Expo to install and I tried on multiple computers, anyone else having issues or figured out how to fix them? There seems to be some packages in Expo that are corrupted. Also, sometimes the installation just stalls or errors with no sign of why

[@Shmoji]

If you are having these issues and you use Windows, try using Windows Powershell instead of CMD. Run it as administrator too. That solved my issue.

[@Fuzias88]

@@Shmoji Thanks! That solved my problem

[@lakshman587]

Same issue

[@Fuzias88]

@@lakshman587 install it using powershell as administrator..

[@lakshman587]

@@Fuzias88 tried even that not able to download

[@Shakespeare1612]

I am getting a lot of "deprecated" warning when trying to install expo-cli. Is there a version somewhere that has cleaned up (updated) all of these errors?

[@LumbreraEnMiCamino]

same problem here!

[@blazefirer]

I did some looking on the expo github issues and there is an issue for this here github.com/expo/expo-cli/issues/1659 . Basically one the big maintainers responded saying they have not had time to fix this yet and that all of the deprecated packages just deprecated so they will not cause issues just a few warnings. They are working on getting pull requests to fix now but it really should not cause any problems in your project.

[@isaiahdaniel2522]

@@blazefirer ....hello but mine is not even getting installed

[@_.fmendes._2021]

@@isaiahdaniel2522 same here

[@lakshman587]

Same issue i was going to start this session but i got disappointed 😢😢😢 same deprecated error when installed (npm i -global expo-cli) Anyone please help with this issue

[@peachleah_]

My 'expo start' gives an error; Cannot determine which native SDK version your project uses because the module `expo` is not installed. Please install it with `yarn add expo` and try again. Can you help me please?

[@programmingwithnit5308]

Thank you

[@cedrickvstheworld1810]

i like to learn english and speech from him

[@shengzhan4631]

7:06 Oh, u even have a game boy ; )

[@Fleshlight_Reviewer]

thank you net ninja :)

[@shubhrajit2117]

Note that expo has discontinued the Web UI so now u have to use the cli.

[@jumbo999614]

How big is Android Studio is? It started downloading tons of packages when I open Android Studio app. I couldn't finish the download process because the disk ran out of space. I guess I have to use phone app instead of the emulator. Is there Android Studio alternatives I can use for this tutorial?

[@harpreetmadaan6]

Hi Shaun, I am getting one error message while running REACT native app through expo cli on android emulator. Error - Couldn't adb reverse : device 'adb' not found. In my terminal window. After running. - npm start - press a

[@alexzil2142]

Are we getting a udemy course on react native in 2022??

[@eazlai]

A lot of setup!

[@NikhilAdiga]

I'm getting this Error running adb:more than one device/emulator error and can't seem to get past it. :(

[@getrogo4474]

'expo' is not recognized as an internal or external command, operable program or batch file. anyone help

[@mauritzfunke280]

Something went wrong when installing the expo cli. Check if NodeJS is installed and make sure you have ran npm correctly

[@blazi_0]

same fucking issue here !!! i tried everything !!

[@isaiahdaniel2522]

hey shuan gr8t video like always.......but am having trouble installing expo cli, i get an error saying it is deprecated

[@lakshman587]

Same error

[@assemmohamed4424]

my expo client (iOS) always get 'request timeout' error, it's not working. can I have help, please?

[@verdientflash7308]

Dude i get an error in Android Studio while installing the virtual phone The Error is Install HAXM but when i install the HAXM it won't install

[@VeeWebCode]

Love you

[@adimtaruna8583]

Finally

[@mudassirsayed8703]

Wow😍

[@lonewolfcoding5208]

so i can build native app using only node js on my computer and my mobile phone?

[@deepaking7]

Can we use VS code Instead of Android studio

[@HarelTussi]

Yessssssss

[@manishmothi73]

Hi the net ninja when I try to go to "cd apps" it says there is no such file. How do I fix this. I am on Mac

[@hafizvj7939]

I'm getting this error when i run "react-native run-android" __________________________________________________________ info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag. (node:8672) Warning: Accessing non-existent property 'padLevels' of module exports inside circular dependency (Use `node --trace-warnings ...` to show where the warning was created) Jetifier found 967 file(s) to forward-jetify. Using 4 workers... info JS server already running. 'C:\Users\Hafiz' is not recognized as an internal or external command, operable program or batch file. info Launching emulator... 'C:\Users\Hafiz' is not recognized as an internal or external command, operable program or batch file. 'C:\Users\Hafiz' is not recognized as an internal or external command, operable program or batch file. 'C:\Users\Hafiz' is not recognized as an internal or external command, operable program or batch file. 'C:\Users\Hafiz' is not recognized as an internal or external command, operable program or batch file. error Failed to launch emulator. Reason: Emulator exited before boot.. warn Please launch an emulator manually or connect a device. Otherwise app may fail to launch. info Installing the app... FAILURE: Build failed with an exception. * What went wrong: Could not initialize class org.codehaus.groovy.runtime.InvokerHelper * Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. * Get more help at help.gradle.org BUILD FAILED in 1s error Failed to install the app. Make sure you have the Android development environment set up: reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details. Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081 _____________________________________________________________________________________________________________ Please Help

[@imbue1112]

anyone else have issues when using "npm install expo-cli --global" on mac os?

[@trulsmatiastorgersen]

imbue Yes, that command is for windows. Do “npm install -g expo-cli” instead :)

[@mouadhgnichi6199]

expo open an error; Uncaught Error: java.net.SocketTimeoutException: failed to connect ... any help please !

[@markoco3068]

I got the same error. have you already resolved it? pls help. thanks :D

[@rubenarzoyan8287]

i got an error when i click Run on Android device/emulator

[@ElHawary]

Arigato Sensi ;)

[@inhthainguyen1625]

How about using Android Studio ?

[@talhasiddique5042]

sir my app is not working in expo app there is something wrong but i dont know how to fix

[@jackw.3978]

also android studio does not look and work this way anymore... all changed... :(

[@giacomon5147]

Do not have 'Pie' option at @9:29. I'm using ubuntu.

[@jayarammanikumar229]

can I install react packages in react native packages?

[@BigMasterSameerAman]

It's taking too long but not able to run on my iphone 14 max pro