How to run React JS app in Visual studio code tutorial | Download and install react in VS Code 2024

How to run your first react js app project in visual studio code using node js is shown
#reactjs #reactjstutorial #vscode

[@minimumviablepizza]

Perfect tutorial. Easy to follow and got me up and running quickly. Good extension recommendations too! 🙏

[@unitedtoptech6288]

Glad you liked it!

[@erycsaprones4514]

you deserve more than one following from me... you are very straight to the point and you have helped me a lot. I can't thank you enough

[@unitedtoptech6288]

Most welcome man ❤😊

[@Code-Wave1]

Thank you so much bro, good tutorial,that was a ggood thing using my first commands on the terminal😄

[@unitedtoptech6288]

WELCOME BRO!!

[@NiteshKumar-xy6no]

Thanks brother, love from India ❤

[@unitedtoptech6288]

Welcome Bro!!😊

[@miielli]

Thank you very much man, you literaly saved my school project.

[@unitedtoptech6288]

Glad I could help!

[@ISOTechEXE]

Music for my ears, EVERY code tutorial must sound like this

[@unitedtoptech6288]

Wow thanks, you mean my voice is good?

[@keshavsainath1142]

I really loved this tutorial. It was explained in great detail and everything worked perfectly!! Thank you for this!!

[@unitedtoptech6288]

You are so welcome!!!

[@Pppupu6858]

​@@unitedtoptech6288 bro even after putting the path its showing nodejs not recognized

[@mohapimohoto7354]

This video is super helpful, I went through 8 videos before my node and npm could start working and this is the only one who helped😂

[@unitedtoptech6288]

Great to hear!

[@HemlataNagar-rn8cx]

Thankyou so much because has a unique explantion . Its really help me

[@unitedtoptech6288]

nice! thanks

[@ronethsandeepa5014]

Good tutorial everything is very clear and understandable. Recomanded

[@unitedtoptech6288]

Fantastic man , Thank you

[@deeee_veeen]

Such a beautiful tutorial thank you

[@unitedtoptech6288]

Welcome!!

[@ricardorivera3385]

Great tutorial. Others go into VSC without first stating the need for node.js first. The tip about the environmental path was also important.

[@unitedtoptech6288]

glad you liked it! Welcome

[@ApurvaAthawale-i5r]

it's just perfect this video was very useful for me today, I had to submit my task today itself due to this video got my work submitted

[@unitedtoptech6288]

Glad it helped! good luck

[@winnielee5289]

best beginner-friendly video

[@unitedtoptech6288]

Glad it was helpful! Welcome :)

[@sravansunkara9145]

Thank You so much, you saved so much time for me 🙌❤

[@unitedtoptech6288]

You're so welcome!

[@haseebahmed6278]

Helpful video. Thanks!

[@rorisangmakgaka124]

Nice video, thank you so much. It really helped me.

[@pankajbhardwaj4893]

Helpful video. Thanks!

[@unitedtoptech6288]

Glad it was helpful!

[@user-ml6zz8fl4j]

A very clean explanation about the content.

[@unitedtoptech6288]

Glad you liked it !! cool

[@MalemnganbaTakhellambam]

very clear explanation sir. thank you so much for your help

[@unitedtoptech6288]

You are most welcome

[@pattubaby1654]

Super bro its awesome to explain clearly and neatly 😊 and easy to understand

[@unitedtoptech6288]

Thank you so much 😀

[@davyondo6395]

this is what i was looking for!

[@robertl.andersonii5926]

You are a lifesaver! Thank you!

[@unitedtoptech6288]

Glad to hear that! welcome

[@kirtisingh8947]

If someone is getting an error while entering npx create-react-app my-app So please first write nmp uninstall -g create-react-app nmp install -g create-react-app Enter

[@unitedtoptech6288]

Cool

[@Meoww21375]

Nahi ho raha help ar do yaar discord ha kya?

[@unitedtoptech6288]

for?

[@arham5344]

thanks dude

[@anand_y_77]

thanks dude ❤‍🩹❤‍🩹

[@user-df9ow4hq5x]

Thanks a lot.This video is perfect.

[@unitedtoptech6288]

You are welcome!

[@warriorsofchhatrapati7098]

Thanks you so much sir! such a wonderful tutorial. ☺☺

[@unitedtoptech6288]

Thank you too Sir! All the best

[@sanjays1926]

Very Helpfull Thank You All the best .

[@s0e9p73]

You should be addressing the error after the first npx create command. It took me a hell lot of time to fix that.

[@unitedtoptech6288]

What was the error? I did not get any

[@userhope18]

how did you fix it?

[@unitedtoptech6288]

Can you paste the whole error here?

[@KOTATHARUNKOTATHARUN]

@@unitedtoptech6288 npm error code ENOENT npm error syscall lstat npm error path C:\Users\Tharu\AppData\Roaming pm npm error errno -4058 npm error enoent ENOENT: no such file or directory, lstat 'C:\Users\Tharu\AppData\Roaming pm' npm error enoent This is related to npm not being able to find a file. npm error enoent

[@unitedtoptech6288]

go to this path C:\Users\Tharu\AppData\Roaming\ and create an empty folder named npm

[@ImmyYousafzai]

thnaks, spot on step by step guide. (a little hard to understand the accent but does the job. ) jay ho

[@unitedtoptech6288]

You're welcome!

[@P_r_o_p_l_a_y]

Those who are getting error while npx command like module not found Copy path upto roaming and search in file manager and created new folder named npm it works fine

[@unitedtoptech6288]

yes

[@aszrvl]

how to do this?

[@unitedtoptech6288]

go inside roaming folder, create a new folder and name it npm, you will have the full path of this folder in your error message

[@abhinabasen4486]

npm ERR! code ENOENT npm ERR! syscall lstat npm ERR! path C:\Users\senab\AppData\Roaming pm npm ERR! errno -4058 npm ERR! enoent ENOENT: no such file or directory, lstat 'C:\Users\senab\AppData\Roaming pm' npm ERR! enoent This is related to npm not being able to find a file. npm ERR! enoent npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\senab\AppData\Local pm-cache\_logs\2023-06-25T15_13_31_764Z-debug-0.log im having this error while having the create-react app command ? how can this be fixed?

[@unitedtoptech6288]

When are you geting this error ? when creating react app or trying to run it ?

[@mukesh6205]

I solved this using the following command. npm uninstall -g create-react-app then npm install -g create-react-app

[@RajatPatodi]

@@mukesh6205 worked for me too. thanks brother

[@mukesh6205]

@@RajatPatodi welcome 🤗 bro

[@tanishabiswas6268]

​@@mukesh6205Thank you so much❤ you saved me

[@ragulvasanthsm885]

Really a Nice Video i done it everything you do sir...👍

[@unitedtoptech6288]

Thats great to know man

[@e_lizathefirst]

Great video. Very easy to follow the steps. 👌👌

[@unitedtoptech6288]

Glad it was helpful!

[@valiokvaliokvaliok]

Very good job! Loved the tutorial

[@unitedtoptech6288]

Thank you so much!

[@user-dr4tz2hq1c]

Thank you for the video. Very helpful

[@unitedtoptech6288]

Glad it was helpful! 👍

[@ramyam1212]

very helpful video. thanks and well done

[@user-ym6xj5ie2l]

such a wonderful and easy explaination

[@unitedtoptech6288]

Glad you liked it!!

[@sinegaelumalai5562]

Thank you ..

[@unitedtoptech6288]

You're welcome

[@LegendUnleashed]

Great tutorial, thank you!

[@unitedtoptech6288]

You're very welcome!

[@Kreytonchild]

thank you so much! I was having an issue to install react when adding it to the terminal. The issue that it needed to be updated as well because it's the first time in awhile that I haven't updated/used it.

[@unitedtoptech6288]

You're welcome! 😊

[@unitedtoptech6288]

Were you getting any error message because of this?

[@Kreytonchild]

@@unitedtoptech6288 yeah, at first, it seemed that I did a command prompt check to see what version I had. When I went this option, I was able to update it automatically. I'm very new to REACT on VS code and now it gives me an error of logging into the project I'm working on my first react project. I mean by doing the "NPM start" and it's giving me errors to go back into the project. It mentioned about the NPM doesn't seem to have a directory when I try to start it. I've only done Flask/Python with Virtual Environment to go live on the local host and exiting it, but not on REACT.

[@unitedtoptech6288]

Yeah maybe you are not inside the right folder, try giving cd command and going to the react project subfolder

[@marcellinusnnamudi9030]

Very nice video.... Thank you very much...

[@kajalmehta8732]

Thankyou so much. It's really helpfull.

[@unitedtoptech6288]

Most welcome!

[@khushisahu9762]

Helped a lot....Thank you so much

[@unitedtoptech6288]

Glad it helped!

[@IhsanAbbasi-d1i]

so so so so helpful...thanks alot

[@unitedtoptech6288]

You're very welcome!

[@gurram.lakshmitulasi]

Hello sir...what should I do if I get an error saying "npx is not recognized",I followed all your steps but still getting this error and I don't know why...please help me out...😔

[@unitedtoptech6288]

npm i -g npx, tun this please

[@Willard25]

Thank you sir, highly recommend to beginners

[@unitedtoptech6288]

So nice of you

[@Willard25]

@@unitedtoptech6288 because ur videos are so useful 😁

[@unitedtoptech6288]

Thanks man

[@JavaCodingwithRaju-kv7xc]

thanks, sir for the step-by-step guidance

[@unitedtoptech6288]

Happy to help!!

[@sateIIitepilot]

This was super helpful!

[@unitedtoptech6288]

Glad it was helpful!

[@user-fe5yq5os6f]

Very Useful TY !

[@unitedtoptech6288]

welcome

[@tayyabailyas1257]

bro you are a life saver, thank you

[@unitedtoptech6288]

Happy to help

[@awkwardavacadoo]

omygod thankyou so much 😭🙏🏼🙏🏼🙏🏼🙏🏼💗💗💗💗

[@unitedtoptech6288]

Welcome!! Thats a lot of emojis

[@bhavanatallapaka3166]

npx : The term 'npx' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. At line:1 char:1 + npx create-react-app my-reactapp + ~~~ + CategoryInfo : ObjectNotFound: (npx:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException I am getting this error.

[@27mohammedibrahim43]

install latest version of node js and try again

[@bhavanatallapaka3166]

@@27mohammedibrahim43 I have restarted my pc, And it's working..

[@unitedtoptech6288]

Great bro

[@freelearning35]

Great video!

[@risavkumarjha6899]

Thanks for Sharing:)

[@unitedtoptech6288]

My pleasure 😊

[@user-qf5wx1oc2y]

I really appreciate this video helps me a lot

[@unitedtoptech6288]

Glad to know that

[@oussamatouhami5027]

Thank you so much ! ^^

[@unitedtoptech6288]

Welcome!

[@MamuBhanjiVlogers]

Thanks a lot it's very help ❤❤

[@unitedtoptech6288]

You're welcome 😊

[@vuongnguyenngoc4374]

great tutorial, thks

[@unitedtoptech6288]

Glad it was helpful!

[@just_eri7]

thanks for the tutorial!

[@unitedtoptech6288]

Happy to help!

[@user-sx5nz8eq7j]

thank you very helpful

[@unitedtoptech6288]

You're welcome!😊

[@NovemberXXI]

Everytime I try creating a react app I keep getting an error about 233 packages need funding, run “npm fund” etc, how can I fix this?

[@unitedtoptech6288]

No idea bro, try searching in stackoverflow they seem to have some solutions

[@josephquintiliano2904]

Asking for bread since it’s a free open source

[@ambarishambarish3554]

Same problem bro how to solve this problem pls any help me solve this

[@NovemberXXI]

@@ambarishambarish3554 I don’t quite remember, I just kept trying and fixing with the directions provided on the terminal, if you read the error correctly there is where you are told to fix the issue

[@AnshuKumar-dq7kq]

@novemberxxi6092

[@cricket_kaburlu]

Thank you so much

[@unitedtoptech6288]

Any time

[@swatihd3885]

Good one

[@ksaishankar5576]

Thanks for the video

[@unitedtoptech6288]

Our pleasure!

[@lerstom3009]

thanks ! good video

[@luciferhn1983]

Thank you very much 🙏🙏

[@unitedtoptech6288]

You're most welcome

[@achrafd3688]

what about npm install -g create-react-app ?

[@unitedtoptech6288]

Welcome

[@user-bq9uy2dh4x]

very helpful

[@athiraathi4715]

Useful video❤

[@unitedtoptech6288]

Glad you think so!

[@P_r_o_p_l_a_y]

throw err; ^ Error: Cannot find module 'C:\Users\Adarsh\AppData\Roaming pm ode_modules pm\bin px-cli.js' getting this error

[@unitedtoptech6288]

C:\Program Files odejs , add this path in env variable, replacing the old one

[@P_r_o_p_l_a_y]

Bro error solved copied that path upto roaming and searched in file manager and created new folder named npm working now

[@unitedtoptech6288]

Ohh okay bro cool

[@unitedtoptech6288]

Hii bro one small doubt, what command did you run in terminal to get this error?

[@P_r_o_p_l_a_y]

​@@unitedtoptech6288 npx create-create-app first-project

[@JokoLane]

it still says error: npx : The term 'npx' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. At line:1 char:1 + npx create-react-app first-project + ~~~ + CategoryInfo : ObjectNotFound: (npx:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException

[@unitedtoptech6288]

You need to add the path appdata/roaming/npm in environment variable and rerun

[@giorgichikovani6012]

npx create-react-app command is deprecated and no longer being maintained, mostly common used technologies now are next or vite

[@unitedtoptech6288]

for practice this is fine

[@oozaidoo380]

Thanks a lot! 2 quick questions 1/can i delete the App.css, App.js, App.test.js, index.css, logo.svg, reportWebVitals.js, and setupTests.js from the src folder? 2/when i enter "npm start" and then close it and enter it again it will says the port 3000 already taken so what sould i do? thanks again ♡

[@unitedtoptech6288]

If you delete App.js it wont work , so try modifying the content there, for port number try changing to any other number

[@pedrohenriqueleite2146]

I like the video

[@imperkz96]

wonderful

[@unitedtoptech6288]

Thank you! Cheers!

[@educationrevolution9561]

npx create-react-app when i'm pasted this in new terminal its created alots of error. tell me what can i do

[@unitedtoptech6288]

I have replied

[@agx111]

best , helped a lot trying to this for 3 hours 😭😭😭

[@unitedtoptech6288]

Glad it worked!! Welcome

[@MdSalman-no1zc]

I spend approx 2.3 hours but only yours video will help me thanks a lot ❤

[@unitedtoptech6288]

You're welcome 😊

[@DevadriptaJadhav]

Thanks!

[@unitedtoptech6288]

No problem!

[@user-nk6ib1rz9v]

very usefull

[@unitedtoptech6288]

Thanks

[@Diana-ul1lc]

Thank you!

[@unitedtoptech6288]

Glad to help!!

[@amberbiswal9223]

Thank you 👍

[@Vedika_porwal]

Create nhi ho raha hai ' cannot find module "block stream" ' error aa rahi hai How can i fix it😢

[@unitedtoptech6288]

After running what command are you getting this error?

[@__commentry_812]

When click windows installer chrome shows a privacy error What i do🤔

[@unitedtoptech6288]

installer? after what step do you get this error?

[@narendrakajla77]

great video, simple and so straightforward, it helped me and now I am able to use react apps, thanks a lot for your efforts

[@unitedtoptech6288]

Glad it helped! Welcome bro

[@GameforPeace31]

cd. : The term 'cd.' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. At line:1 char:1 + cd. First-project + ~~~ + CategoryInfo : ObjectNotFound: (cd.:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException there is issue with me

[@unitedtoptech6288]

only cd, u have cd. I guess

[@81_monish_roy74]

thanks u r a gem..

[@unitedtoptech6288]

You're welcome! U are tooo man

[@derdart_]

thanks so much

[@unitedtoptech6288]

WELCOME

[@vinakathakur7021]

Thankyou 🎉

[@unitedtoptech6288]

You’re welcome 😊

[@user-ej8sr1ld7r]

when we go with the command npm start in the terminal... you got option to choose which browser u wanna use but for me it directly opened in the internet browser. How to change that. I also want to open the react app project on chrome but i didnt get the option

[@unitedtoptech6288]

Just change your default browser in windows settings to chrome

[@janhavibhutkar1824]

Thank you 🎉🎉

[@unitedtoptech6288]

You’re welcome 😊

[@rutujabandal4862]

Finally got solution😢

[@unitedtoptech6288]

great

[@ashoksaipudi6999]

Bro can you please fix my error npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Ashok sai\AppData\Local pm-cache\_logs\2023-06-30T16_26_53_501Z-debug-0.log PS C:\Users\Ashok sai\Desktop\React> npm start npm ERR! code ENOENT npm ERR! syscall open npm ERR! path C:\Users\Ashok sai\Desktop\React/package.json npm ERR! errno -4058 npm ERR! enoent ENOENT: no such file or directory, open 'C:\Users\Ashok sai\Desktop\React\package.json' npm ERR! enoent This is related to npm not being able to find a file. npm ERR! enoent npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Ashok sai\AppData\Local pm-cache\_logs\2023-06-30T16_27_33_472Z-debug-0.log

[@unitedtoptech6288]

Did u use the cd command before using npm start?

[@lellanari8512]

Bro I am also coming like that what can I do

[@unitedtoptech6288]

did you try cd with ur project name bro?

[@omkr19]

Need to install the following packages: Create-react-app@5.0.1 Ok to proced? (y) How to bug the error??

[@unitedtoptech6288]

click on the y key

[@SOSSVT]

i installed all the extension like live server or javascript code snippets and node js before ( ihave made html project without react previously ) before downloading extensions of react in a C folder , will it cause problems if installe react library in D folder ?

[@unitedtoptech6288]

No extensions are global and will work irrespective of where you open your project folder

[@ChandniSharma-pr4kk]

Thank u so much ❤

[@unitedtoptech6288]

You're welcome 😊

[@ancitadfernandes8243]

How to fix the error when we get while creating npx first step?

[@unitedtoptech6288]

during what step do you get this error?

[@keerthanarajamani-bv2mg]

Error: Cannot find module 'C:\Users\clear-npx-cache\bin\clear-npx-cache.js' Can you give this a solution

[@unitedtoptech6288]

can you please paste the whole error message ?

[@pavithravavilapalli275]

I'm getting an error at 7:45 sec after running command npx create-react-app first-project. Kindly help me out

[@unitedtoptech6288]

Can you please paste the whole error?