How To Setup & Run React Native App on Android Emulator from Terminal and edit In Visual Studio Code

Подписаться 28 тыс.

Просмотров 144 тыс.

50% 1

Sign Up 👻👻👉 semicolon.dev/RU-vid
(We're free online community, meet other makers!)
How to install Chocolatey: (copy and paste that code into cmd.exe)
semicolon.dev/windows/how-to-...
How to install Chocolatey in PowerShell:
• How To Install Chocola...
How to install Chocolatey in cmd.exe:
• How to install Chocola...
#reactnative #android #visualstudiocode Hey guys in this tutorial I'll show you how to setup and run your first React Native app from Terminal (command line) with Android Emulator in Visual Studio Code or Android Studio.
How To Setup React Native on Windows
Video Chapters:
==============
00:00 Intro
00:56 Node 14 and JDK11
01:23 Install Chocolatey
03:26 Use Choco to install Node LTS and JDK 11
03:57 Download Android Studio
04:20 Install Android Studio
05:27 Setup Android SDK for React Native development
07:30 Set up ANDROID_HOME SDK PATH Environment Variables
08:42 Use PowerShell to verify ANDROID_HOME properly set
09:13 Add platform-tools to Environment Variables PATH
10:02 Important: Uninstall previous react-native-cli to avoid errors
10:37 Setup Android Device Emulator (Pixel 3,4,5 or XL)
11:22 How to Start Android Emulator
11:36 How to Launch React Native App in Android Emulator in Terminal from Command Line on Windows 10 or 11
12:12 How to open React Native app in VSCode
12:59 How to Run React Native app from command line with npm start
13:09 How to launch React Native App in Android Emulator from Terminal in VSCode
13:53 How to run React Native Hello World Example App in Android Emulator from VSCode
14:16 Hot Reload
Here is a list of unique Android emulator names that are available in Android Studio:
==============
Genymotion
BlueStacks
Nox
MEmu
LDPlayer
Andy
Remix OS Player
Keywords you might be entering to find this video
==============
how to run a react native app in android studio
run react native app in visual studio code
how to run react native project in visual studio code
how to run react native app in visual studio code mac
how to run react native app from visual studio code
command to run react native app in visual studio code
how to run react native code in visual studio code
how to install react native in visual studio code
how to run react native app in visual studio
how to run react native app in visual studio code
how to run emulator in visual studio code react native
how to run react native program in visual studio code
how to run react native app in visual studio code on windows
how to use react native in visual studio code

Опубликовано:

2 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 90

@georgenyagura7742 Год назад

Yes Yes Yes.... This is exactly what I wanted....been stuck with this for the past two days I was about to buy another machine😂😂😂😂😂You saved me €850.

@zattifiedax 5 месяцев назад

Thank you!! Following your tutorial works, especially setting up environment variables correctly. Thank you!

@danielstawarski8122 4 месяца назад

Excellent work, well done. Worth mentioning react native doctor command if something goes south throughout the process.

@virinchibalusani5726 3 месяца назад

Thanks buddy💚

@ardurabangarang7397 10 месяцев назад

I'm so happy I stumbled into you. It's working like a miracle.

@aboulfathfekri4044 Год назад

Thank you for your excellent explanation , I hope i see more video from you❤

@abdullahleo1604 3 месяца назад

My man you literally saved my life, if ww3 happens, you can use me as a human shield

@ghosttogether 3 месяца назад

lol

@menasheavrahami9113 2 месяца назад

Thanks!

@menberehailu8934 10 месяцев назад

Thankyou very much .

@JorgeRivera-rp1zw Месяц назад

Hi, dear friend Many thanks for sharing this video is really useful..!🥳 Hope to do more .! Success in your projects..! The voice and explanations are simple and accurate no more no less..! is odd to find someone teaching like you . Highly recommended.

@Morph0is 6 месяцев назад

Great Jop, I followed all steps carefully and hat absolutely no errors and in my term, erverything works fine. thanks a lot bro ande pls keep going!

@user-ph5xo4bi7s Год назад

Thank you excellent guide!

@sydrm 9 месяцев назад

Thank youuu so much for amazing explanation ✨

@bramantiosyahrulalam2671 8 месяцев назад

berhasil mantap lov u pak

@horssentc Год назад

Thank you!!

@kawaamobus9252 11 месяцев назад

do u know by any chance why when im trying to do "cd projects" in Command Prompt it says that system cant find the path like i mean what part of video i messed up lol

@horssentc 11 месяцев назад

@@kawaamobus9252 did you create a folder called "projects"? The command CD means "go to that folder" and it's followed by the name of the folder you want to acess

@b.sivakumar4328 Год назад

Thank you brother😍

@sigmaweltall5734 Год назад

thx bro

@loordbeerus6284 Год назад

thank you so much bro ♥ - you deserve more i like your style to explain - can you make more tutorial about react native

@kawaamobus9252 11 месяцев назад

do u know by any chance why when im trying to do "cd projects" in Command Prompt it says that system cant find the path like i mean what part of video i messed up lol

@1wikii 9 месяцев назад

oh god such a great tutor, i just following the react native documentations but i got stuck on instalation SDK android studio. Thanks man!

@user-ub3ir6md1x 7 месяцев назад

Why i don’t have app.js after initializing a file.

@erwinsmis 3 месяца назад

Powershell can't find the projects path what should I do?

@adnanabbasi9482 Год назад

thanks, your guidline has solved my problem not found on mega platforms like stack overflow and etc. Thanks once again.

@kawaamobus9252 11 месяцев назад

do u know by any chance why when im trying to do "cd projects" in Command Prompt it says that system cant find the path like i mean what part of video i messed up lol

@fathimaismath6415 11 месяцев назад

for some reason, i dont seem to have an android directory whenever i create a react native project :/

@Banayah 2 месяца назад

Are the sdk packages still the save version number or can i use the most recent (ver 34)

@lanigoespew 8 месяцев назад

Wait what if I installed react native CLI without any issues in the first place? Do I still need to uninstall it?

@cheneddie8185 Месяц назад

when you run an emulator in Android Studio, you can just connect them by npm start and enter a at window prompt now.

@brandonovwigho6312 Месяц назад

Where do i create the projects folder? I can't find it in my terminal

@toxicprogrammer69 Год назад

thank you so much yaar....

@ghosttogether Год назад

Welcome :)

@tejasmakwana.1012 4 месяца назад

Sir how to open and run existing folder code downloaded from Github

@garlicbread7344 5 месяцев назад

you're my god tbh

@MWELASEDUBANDLELA 3 месяца назад

😮

@pedrolucaslouzada7378 Год назад

thak you so much bro, you saved my life

@ghosttogether Год назад

Probably not :) But glad tutorial helped.

@muzamilrafiq946 6 месяцев назад

Cant we edit or code react native apps in android studio ??

@lanigoespew 8 месяцев назад

I'm so pained cause why does he have such a tiny zoomed out view for part of the video I can't see anything

@RajaShinde-mf2to 10 месяцев назад

Where is discription please make it clear

@kanchanmatai4170 2 месяца назад

IN LAST I AM SEEING APP.TSX NOT APP.JS WHY?----I have blank screen on emulator....pls help to fix this...build was successful though

@user-ge9ze5xs2o Год назад

Please help with this error new expo.modules.filesystem.FileSystemPackage(), ^ symbol: class FileSystemPackage location: package expo.modules.filesystem

@mohnishthontiya982 10 месяцев назад

After running virtual device black screen shows please can someone tell me how can I fix this? I did everything like wipe data cold boot but nothing worked

@WagmiVibes 9 месяцев назад

I'm experiencing same issue, were you able to fit it ?

@musamwangea3695 Год назад

Error Failed to launch emulator. Reason : It took to long to start and connect with and cal\Android\sdk\emulator\emulator @pixel_4_xl_API_30 How can I solve that

@igniteflux4261 Год назад

If you are trying to relaunch your project, it could be because your android emulator has that file opened. Close it and npm run android again

@musamwangea3695 Год назад

@@igniteflux4261 Thanks

@dhairyayadav9210 5 месяцев назад

Why am I not getting App.js file???

@devdivine__ 6 месяцев назад

does Andriod studio work on 8gb, 2.5ghz

@thesslayerstv6725 Год назад

Task 'installDebug' not found in project ':app'. React native 0.71 version

@max89285 3 месяца назад

same

@max89285 3 месяца назад

Did you solve it?

@02-ovanchi33 9 месяцев назад

Pls when i create "npx react-native init hello_world" than In the hello_world folder there is no App.js file

@joatanpereira4272 9 месяцев назад

there probably is an App.tsx file

@reema7892 7 месяцев назад

have you found where is this file?

@02-ovanchi33 6 месяцев назад

it is App.tsx@@reema7892

@user-bs8rl5zz1u 8 месяцев назад

bro without android studio , how to setup react native emulator ??

@prehistoricedu1096 Год назад

Sorry mate, that didn't work it still says that there's no apps connected

@ETdu38 11 месяцев назад

Damn, I have been stuck with the installation of the project on liunx for a few days. I guess I missed the part about uninstalling react-native-cli 😅 This tutorial works pretty much alike on linux if you know how to set your environment variables.

@ghosttogether 11 месяцев назад

This tutorial was based on a lot of research :)

@siphonedshisui5667 9 месяцев назад

Got to 13:17 and get this when I run the command: info JS server already running. The filename, directory name, or volume label syntax is incorrect. info Launching emulator... error Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avds`. //This is the issue I am facing :( warn Please launch an emulator manually or connect a device. Otherwise app may fail to launch. info Installing the app... Checking the license for package Android SDK Tools in C:\Users\Lucas\AppData\Local\Android\Sdk\licenses License for package Android SDK Tools accepted. Preparing "Install Android SDK Tools (revision: 26.1.1)". 100% CONFIGURING [20s] > IDLE

@christian.3759 2 месяца назад

how did you fix this issue?

@MusicTime0Play 2 месяца назад

i got Failed to install the app. Command failed with exit code 1.. why?

@Banayah Месяц назад

same here

@iwankrisnawan6228 Месяц назад

@@Banayah do you know how to solved it?

@Nenga117 9 месяцев назад

When I make a react-native app via cmd line, it makes all the files except for app.js any reason why?

@nitishkumar_here 11 месяцев назад

IN LAST I AM SEEING APP.TSX NOT APP.JS WHY?

@Banayah Месяц назад

same here

@harh-qp9zg 6 месяцев назад

Good afternoon! I have two questions: Do older versions of Android Studio consume less CPU and RAM? If yes, can I use an older version without any conflicts?

@vandanaranikottapalli8543 29 дней назад

I have created the application, but the app.js file is created as app.tsx

@athumanahmed9374 27 дней назад

same case happened to me, since am not familiar with Typescript, so I renamed the file from app.tsx to app.jsx it worked perfectly without any errors and running smoothly

@PetersExcapades 5 месяцев назад

great video but please, for the love of god, use a pop filter. the sound is really annoying

@vanshmishra6039 2 месяца назад

love you baby 💋💋💋💋, i was stuck at this for about 5 days, expo was not running on my phone

@Bisiebadboy Год назад

What if the react-native project is old? like how to run the existing react-native project with react-native version 0.55.4 in window 10?

@anbu8b07devi4 10 месяцев назад

at 12.38-----> i have followed all the steps as given but i cant see any app.js file there instead it shows app.tsx how to fix this

@ilyabaka5498 8 месяцев назад

yo dude stop eating ur mic😅

@pramana47 2 месяца назад

😂

@ozanemredemir9392 Год назад

mine didnt work as easy as in this video. i had to edit environment settings and path to add android_home, android sdk, java_home variables. also many components like gradle and java versions have compatibility issues.

@lalithadwarapureddi3283 8 месяцев назад

Yes, I have also same problem

@Raiwulf 8 месяцев назад

is this still valid or?

@Alex-hr2df Год назад

You should have put Windows in title

@ghosttogether Год назад

naw I think that's okay

@bersekiel Год назад

@@ghosttogether Not okay, I thought this video was for linux.

@probar9237 5 месяцев назад

this is fking annoying flutter is better than react

@mohsinali4783 28 дней назад

Bruh stop moaning in my ears

@lucasrios7311 Месяц назад

Hello everyone ! i have this problem Fatal Error] org.gradle.toolchains.foojay-resolver-convention.gradle.plugin-0.5.0.pom:2:1: Content is not allowed in prolog. node_modules\@react-native\gradle-plugin\settings.gradle.kts' line: 16 * What went wrong: Plugin [id: 'org.gradle.toolchains.foojay-resolver-convention', version: '0.5.0'] was not found in any of the following sources: - Gradle Core Plugins (plugin is not in 'org.gradle' namespace) - Plugin Repositories (could not resolve plugin artifact 'org.gradle.toolchains.foojay-resolver-convention:org.gradle.toolchains.foojay-resolver-convention.gradle.plugin:0.5.0') Searched in the following repositories: MavenRepo Google Gradle Central Plugin Repository somebody know what is happen ??