First React app using create-react-app | VS code | npx | npm
Вставка
- Опубліковано 1 лис 2024
- In this video you will see how to create your first react application using npm and npx using vscode. Write Hello World program using React.js. I will show how to run react application using vscode. In this video i have used create-react-app from facebook.
Download Visual Studio : code.visualstu...
Install Node Js Npm : • How to install Node.js...
--------------------------------------------------------------------------------------------------------------------------------------------------------
Command used : npx create-react-app react-demo --use-npm
-------------------------------------------------------------------------------------------------------------------------------------------------------
➡️ Subscribe : / codewitharjun
Stay Connected :
➡️ LinkedIn : / arjungautam1
➡️ Github : github.com/arj...
Join Community :
➡️Discord : / discord
Follow me on :
➡️ Medium: / codewitharjun
➡️ Dev.to : dev.to/codewit...
-------------------------------------------------------------------------------------------------------------------------------------------------------
➡️ Subscribe : / arjuncodes
Stay Connected :
➡️ LinkedIn : / arjungautam1
➡️ Github : github.com/arj...
Join Community :
➡️Discord : / discord
Follow me on :
➡️ Medium: / arjuncodes
➡️ Dev.to : dev.to/arjuncodes
------------------------------------------------------------------------------------------------------------------------------------------------------
#reactapp #createreactapp #react #npm #vscode #CodeWithArjun
thanks a lot you literally saved my 3 hours to solve node terminal problem wish god bless you :)
Glad it helped , Don't forget to like and subscribe.
Thanks alot, I have checked many videos to resolve this issue, but your solution successfully worked.
Glad to hear that
Dude was serious when he said "First" because he literally started from installing the vscode. Wow. Fantastic explanation though!
i tried in different ways but didn't work for me Oh thank you so much sir u literally saved my time😊🙏
Happy to help
Thank you sir you saved my life I've wasted like 4 hours trying to do this
Glad I could help
I’ve been stuck on this a while, it’s nice to finally get past it.
Glad to help. Be sure to subscribe.
man you're a legend, spent ages trying to get this to work, thanks so much
Glad I could help
I am getting an ERR! error
Us bro us 🙂🙂🙂
Bro create one npm folder in the labelled path and re-run the previous command
ua-cam.com/video/DMJ9_wY7Z1o/v-deo.html
Thanks bro for showing the whole process. I was stuck for quite a while now
Glad I could help
Brief and clear explanation. Thanks a looooot👍
Thankyou so much, I already feel like, I have learned advanced reactJS.
simple and easy to understand thankyou so sir .......
You're most welcome ! Be sure to subscribe.
Bro u have saved my valuable time ...don't know how to congratulate to u
Happy to help . Don't forget to like and subscribe
Crack llevaba 4 días con el bendito problema y en siete min me solucionaste la vida😂
Thank you - very helpful as I am new to React.
Glad it was helpful!
and this still works.. thank you so much it was driving me crazy
thank you so much, ive seen some courses, i have actually locally done some apps, but could get it running myself on my pc. thx so much
You are really awesome. Its completely working. Thanks a lot😍😍😍😍
just fallll in loveeee with uuuu bhii jannnn
Asante sana :)
This video is really helped me remember how to install a react app😁
Hey Arjun, thanks a lot for this informational video. I thank you, and you are going to heaven with first class seat because you are helping students to shape their carrier.
Keep it up, mate!
Haha Thanks Mate.
sick ! next make a how to tie your shoes tutorial
thank you brother now i knew how to do it ☺
Thank u soo much for making this video. It was really helpful
Glad it was helpful!
Thank you so so much, have been on this for like a week.Thanks i really appreciate
You're welcome! Be sure to subscribe.
Thanks for the advice sir , you really did saved a lot of my time , i was really confused before i came up to your video
You are most welcome
from ur voice i got uou that you r nepali
i am nepali
Thanks man I've been trying this for a day and you solved my problem
happy to help
Thank you sir. ✨❣️. Your channel will grow like your knowledge 🔥💌.
Thank you so much. Keep supporting
Nice simple and very clear explanation 👏👏
Glad you liked it
Thank you soo much bro, god bless you
thank you so much your video are so helpful to me
Great video brother! Keep going & keep it up :)
Glad you liked it. Hope now you can create first react app now. 😂😂
Don't forget to subscribe to get new updates.
Sure brother! Thanks to you i can create my first react app :)))
This saved my life! Very good tutorial!
Thank you so much. Don't forget to like and subscribe.
Thanks,, Arjun, this was exactly what I needed
Glad you liked it. Thanks.
A perfect tutorial, thanks!
Thank You sir. It helped me a lot
You are most welcome! Be sure to subscribe.
@@CodeWithArjun yes sir please
it was helpful thank you my friends
Glad it helped!
This was so helpful honestly
Super explanation... Thank you.. It helps me a lot
Glad to hear that
thank you for the tutorial it's fast and clear
Glad it helped! Be sure to subscribe.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
added 1370 packages in 2m
169 packages are looking for funding
run `npm fund` for details
It just stops there every single time... Is it cause of my internet connection? On the side i get package.json and node_modules is it finished? I dont get a "happy hacking" message or anything similar which makes me think it wasnt finished installing
bro, can you pls explain, whats the difference between npx and npm . wheer n where npx will be used and where n where npm would be used..
Npm is a tool that use to install packages. Npx is a tool that use to execute packages. Packages used by npm are installed globally you have to care about pollution for the long term. Packages used by npx are not installed globally so you have to carefree for the pollution for the long term.
npx is not a typo - it’s a package runner tool that comes with npm 5.2+.
Short and simple.... thank you
Glad to hear that! Don't forget to Like and subscribe .
Can I make a business website using react, like shopping app or make a checklist app? BTW the video helped a lot, thank you!
even after configuring everything right , i still cannot see the code being shown to the screen for example in the index.js file i do like ReactDOM.render(hello,doc...etc) but i still don't see the output can you help
Hello
Love this video, saved my life tbh. Thanks.
Glad it helped! Be sure to subscribe.
Welcome
Jia ho Bihar k lallaa
Finally! Thank you so much for helping out.
Happy to help. Be sure to subscribe.
If you help us install powershell would be more helpful...
Thank you bro! This was super helpful
Happy to help. Be sure to subscribe
for me when i create the react-demo, I dont get the sources folder or the public folder either. Does anyone know how to fix this?
At first, my browser says localhost refused to connect. After creating setting.json file as recommended on stackoverflow, it ran but nothing showed on my browser (except for the title "React App"). Can admin help me with this?
did you solve the problem?
@@garimakumar5207 yes, I ran and debugged with "run script : start" instead of "launch against chrome". I deleted setting.json file, since it was no use to me. launch.json seems to have little interference with the debugging process, so I suggest not messing with it.
Guys if it still doesn't work, delete the cache file - the npm folder. I read this online and it worked "delete the npm folder located in C:\Users\\AppData\Roaming"
Please help me, how to do that?
npm ERR! path C:\Users\{User}\AppData\Roaming
pm
npm ERR! errno -4058
npm ERR! enoent ENOENT: no such file or directory, lstat 'C:\Users\{User}\AppData\Roaming
pm'
If you are getting an error like the above, that means no 'npm' folder is created in this path. Run the following command from the command prompt
npm install -g npm
After executing the above command check the folder is created in path 'C:\Users\{User}\AppData\Roaming'.
If it's created then you can start creating new project from VS code from the terminal
brother I am getting an error while using the command, the error says that :-
npm ERR! code ENOENT
npm ERR! syscall lstat
npm ERR! path C:\Users\LENOVO\AppData\Roaming
pm
npm ERR! errno -4058
npm ERR! enoent ENOENT: no such file or directory, lstat 'C:\Users\LENOVO\AppData\Roaming
pm'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
Althogh I have installed the nodejs
I am running Node 13.14.0 and it requires Node 14 or higher. Can you help me with that?
what kind of error you are getting ?
I am using windows 8 in windows node js v 14 do not support please can u help me to insatall react in v13
node : The term 'node' 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
+ node -v
+ ~~~~
+ CategoryInfo : ObjectNotFound: (node:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
You have to install node.js first .
ua-cam.com/video/n3M9qKvFZeg/v-deo.html
If you again get problem please let me know .
@@CodeWithArjun I m facing the same problem in vs code irrespective of installing node js
@@BhumikaVerma28 Same problem too 😑
@@wisdomochei hey there, I would suggest you run "node --version" in command prompt rather than running in terminal. I hope I helped you out.
txs for good explanation
Do I need to be connected to the internet for this to work
Thanks Man !!! Saved my time :)
Glad to hear that! Be sure to subscribe.
I used this command to create react app but it shows error of type error: hasflag is not a function.
Wht can I do now??? Tell something.....
thank you so much
you helped me
Don't forget to subscribe.
sir I'm having this issue, I don't know what to do
node:internal/modules/cjs/loader:417
throw err;
^
Error: Cannot find module 'C:\Users
oname2\AppData\Local
pm-cache\_npx\c67e74de0542c87c
ode_modules\isarray\index.js'. Please verify that the package.json has a valid "main" entry
at tryPackage (node:internal/modules/cjs/loader:409:19)
at Module._findPath (node:internal/modules/cjs/loader:651:18)
at Module._resolveFilename (node:internal/modules/cjs/loader:1033:27)
at Module._load (node:internal/modules/cjs/loader:893:27)
at Module.require (node:internal/modules/cjs/loader:1113:19)
at require (node:internal/modules/cjs/helpers:103:18)
at Object. (C:\Users
oname2\AppData\Local
pm-cache\_npx\c67e74de0542c87c
ode_modules\hyperquest
ode_modules
eadable-stream\lib\_stream_readable.js:25:15)
at Module._compile (node:internal/modules/cjs/loader:1226:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1280:10)
at Module.load (node:internal/modules/cjs/loader:1089:32) {
code: 'MODULE_NOT_FOUND',
path: 'C:\\Users\
oname2\\AppData\\Local\
pm-cache\\_npx\\c67e74de0542c87c\
ode_modules\\isarray\\package.json',
requestPath: 'isarray'
}
Dude basically I did what you said then I close it . When I open it again saying npm start it shows this 6 modules not found the following stacks are missing please say how to fix it
Thank you so much 😊😊😊
is telling me i need to install the following packages: create-react-app what can i do
Thank you so much brooooooooooooo!!!!
You're welcome!
Hey, In my cmd I can do node -v but in terminal in vsc it says cant find batch file.
Need to close the All applications.
nice explanation
Thanks man, useful one
Glad it helped
sir terminal not work in my vs code plz slove the problem
Nice and concise video. Thank you
Glad it was helpful! Don't forget to like and subscribe.
Thank you arjun
thank you, saved me time
Thank you so much
How ro fix vscode not automatically updating in page?
thanks a lot was really helpfull
Thank you bro...
Thanks 😊 it is working
npx create-react-app react-demo --use--npm this command is not working bro
while im running that command shows error response :
Hey, keep going...
Wow, really nice🫠🫠🫠
hey man i am getting this error even my node and npm are installed
you saved me!! thanks
Glad I could help! Be sure to subscribe.
very helpful to me, thank you :)
Glad to hear that! Don't forget to Like and subscribe .
Thanks for the help !
Happy to help!
thankyou so much it workedddddddddddd
You're welcome!
Hi Arjun.. after create app command executed. after sometime it get aborted saying deleted generate file: package.json
same thing is happening to me. did you fix it?
Is this work for now?
Please I couldn’t run the code because” logo is declared but never use “ what’s that mean and can anyone help me with that
Actually when I am saving the code in the app.js the complete text is going to be changed like irregular braces,tags and all how to fix that
No one cared about ur comment bro....if I know, i would have helped you....I feel bad for yoy
Thank you sooo much
Happy to help. Be sure to subscribe
accent is great
When I type npx create-react-app demo-app then he install something and then he shows me npm ERR!
What is the exact error ?
thank uuuuuuu broooo
thanks for the video.
You're welcome. Be sure to subscribe.
I try it but getting error in start stage
Really helpful, thank you
Please don't forget to subscribe ❣️
@@CodeWithArjun already did🙌🏽🙌🏽
@@ayshahakeem6611 Thank you so much
Thank you too
What does here 'cd' stand for
cd means change directory which is basically changing the folder location.