Did a bit better on the camera position for the intro this week (but not perfect!). Check out the tutorial on debugging in Chrome if you want a bit more depth on debugging code: ruclips.net/video/geIztShEk6I/видео.html
Hey, btw, did you use any "Always On Top" extension? So the window stop switching automatically from Chrome to VScode every time a breakpoint is hit? Mine always does that... I want to use it on chrome but, I also wanna check it in VScode every once in a while... how do I make the window stop switching from Chrome to VScode every time a breakpoint is hit?
@@MyALPHAguy Hey do we need to install any extension first?, when the give the value of "type" in in configurations as "chrome", I get the following warning:=> "The debug type is not recognized. Make sure that you have a corresponding debug extension installed and that it is enabled.(1)"
@@janmejaysingh7402 Only in vscode, I installed Debugger For Microsoft Edge extension and then fixed the launch.json file in it... but the launch.json file in the .vscode folder needs to be in the same folder your index.html is.
Excellent video, very well explained. In your parcel script "parcel serve -t browser src..." what does "-t browser" do? I couldn't find -t anywhere in parcel documentation and for me the script works the same with and without it.
Hi Sharon, do you know what? I can't actually remember? Oh wait, actually I think the -t was to 'target' the browser (instead of 'node' for example). I think it should work fine without it (as you've mentioned) and it may have been removed in later versions of Parcel.
@@codewithbubb Thanks for your quick reply! Another q: When I run the debugger with parceled code, I get "scrbug/1173575, non-JS module files deprecated." It points to the original HTML, I tried using "sourceMapPathOverrides": { "../*": "${webRoot)/*" } but get same problem. Any suggestions? Much appreciated!
Hey, btw, did you use any "Always On Top" extension? So the window stop switching automatically from Chrome to VScode every time a breakpoint is hit? Mine always does that... I want to use it on chrome but, I also wanna check it in VScode every once in a while... how do I make the window stop switching from Chrome to VScode every time a breakpoint is hit?
It's very good vedio to understand how debugger works. could you please make another example for how to debug nextjs13, because it's realy confuse me. thank you very much.
Thanks for tutorial. I find it the steps involved to be lengthy. If run a code I feel that using console.log easier. I just check the value in the console.log in chrome dev tools. I have been using this for some years now and it help its straight forward and fast.
Yeah, console.log still has lots of uses but when you want to step through a problem and see exactly what the state of your app is when a problem occurs, using a debugger in some form is really useful.
If you're happy troubleshooting problems just do whatever feels easiest to you - just remember if you can't solve a problem with your normal methods (i.e. console.log) you always have other options.
Totally voodoo. A php configuration I'm using uses "php" for "type" and won't accept "firefox" for "type". And "${workspaceFolder}""? You'd think VSCode would have a more straightforward way of doing this.
Did a bit better on the camera position for the intro this week (but not perfect!). Check out the tutorial on debugging in Chrome if you want a bit more depth on debugging code: ruclips.net/video/geIztShEk6I/видео.html
Hey, btw, did you use any "Always On Top" extension? So the window stop switching automatically from Chrome to VScode every time a breakpoint is hit? Mine always does that... I want to use it on chrome but, I also wanna check it in VScode every once in a while... how do I make the window stop switching from Chrome to VScode every time a breakpoint is hit?
@@MyALPHAguy Hey do we need to install any extension first?, when the give the value of "type" in in configurations as "chrome", I get the following warning:=> "The debug type is not recognized. Make sure that you have a corresponding debug extension installed and that it is enabled.(1)"
@@janmejaysingh7402 Only in vscode, I installed Debugger For Microsoft Edge extension and then fixed the launch.json file in it... but the launch.json file in the .vscode folder needs to be in the same folder your index.html is.
I had deferred this requirement because I could not get it working for a while. You video helped! Thank you.
Literlly in time 😂
I just got stuck on how to debugging my cod in vscod, thank you so much
Ah! Awesome - hope you find it useful 😀
Thank you for helping me understand JavaScript better
You're welcome - glad you found it useful!
nice
Excellent video, very well explained. In your parcel script "parcel serve -t browser src..." what does "-t browser" do? I couldn't find -t anywhere in parcel documentation and for me the script works the same with and without it.
Hi Sharon, do you know what? I can't actually remember? Oh wait, actually I think the -t was to 'target' the browser (instead of 'node' for example). I think it should work fine without it (as you've mentioned) and it may have been removed in later versions of Parcel.
@@codewithbubb Thanks for your quick reply! Another q: When I run the debugger with parceled code, I get "scrbug/1173575, non-JS module files deprecated." It points to the original HTML, I tried using "sourceMapPathOverrides": {
"../*": "${webRoot)/*"
} but get same problem. Any suggestions? Much appreciated!
Hey, btw, did you use any "Always On Top" extension? So the window stop switching automatically from Chrome to VScode every time a breakpoint is hit? Mine always does that... I want to use it on chrome but, I also wanna check it in VScode every once in a while... how do I make the window stop switching from Chrome to VScode every time a breakpoint is hit?
It's very good vedio to understand how debugger works. could you please make another example for how to debug nextjs13, because it's realy confuse me. thank you very much.
Thanks for tutorial. I find it the steps involved to be lengthy. If run a code I feel that using console.log easier. I just check the value in the console.log in chrome dev tools. I have been using this for some years now and it help its straight forward and fast.
Yeah, console.log still has lots of uses but when you want to step through a problem and see exactly what the state of your app is when a problem occurs, using a debugger in some form is really useful.
@@codewithbubb Thanks for the reply. I will try to move out of my comfort zone and use it.
If you're happy troubleshooting problems just do whatever feels easiest to you - just remember if you can't solve a problem with your normal methods (i.e. console.log) you always have other options.
@@codewithbubb Thanks again for the reply.
My english isn't good. I want know. How can I use VS Code debugging without web-browser? Is it possible?
Awesome thanks!
Totally voodoo. A php configuration I'm using uses "php" for "type" and won't accept "firefox" for "type". And "${workspaceFolder}""? You'd think VSCode would have a more straightforward way of doing this.
windows?????
ohhhhh and I thought this is going to be the EASY way, silly me. thanks anyway 😵
Yeah, it's not the simplest. Maybe checkout debugging in Chrome - might be easier: ruclips.net/video/geIztShEk6I/видео.html
please remove background music.