Chrome DevTools Complete Course - Learn to debug your frontend code

Timestamps
00:00 Intro
01:20 Setup
02:43 Pre-reqs
03:36 Hello DevTools
06:05 Console 101
10:07 Trying Out Different Consoles
19:25 Sources Tab 101
23:23 Setting Up Debugger
30:26 One More Way
32:55 Event-Based Debugger
38:06 Stepping On Functions
42:44 Breakpoints
46:57 Debugger
48:25 Call Stack
52:00 Patch Code
58:05 Snippets
01:03:38 Networks Tab
01:04:18 Networks Tab 101
01:07:50 Exploring Networks Tab
01:14:17 Filters
01:18:41 Columns in Network Tab
01:20:50 Throttling Network
01:25:19 Copying Requests
01:27:48 Elements Tab
01:28:31 Elements 101
01:31:45 Inspecting Node
01:34:58 Operations With Elements
01:38:03 Special Variable
01:40:06 Styles Manipulation
01:45:17 Copying CSS/JS Path
01:47:37 Color Picker
01:51:56 Outro

Don't forget to subscribe and like the video if you enjoyed :)

[fardinkhan]

What a tutorial.. you deserve 10 million subscribers

[VenkatGudavalli]

This is such a Unique topic, Thank You Mehul !

[unnikrishnanvannadil]

This is the best and latest for learning Dev Tools. Thanks :)

[mohammedmudassir]

Thank You for such an informative tutorial 🔥🔥

[SimpleThingsOne]

Thanks a lot for this video, mehul.
I am now your newest subscriber.

[MultiTechSolutions]

Good Work bro,
But you started marathon in shape of small episodes.
That`s awesome.

[jestingigi]

aag laga de aag 🔥🔥, a fantanstic course thank you ❤❤🙏🙏

[sathishraj]

Great Content, Keep Rocking - Thanks a LOT

[sheikhakbar]

I appreciate the depth of knowledge you provide us with ... I learnt a lot from you.

[thenadastudio]

You are doing a great job mr mehul by providing us the kmowledge thanks a lot for that 💯💯💯

[ajlightning]

I've learned a lot more than I expected to when I first clicked this video. Actually a lot of things that will help me web scrape more effectively. Thanks for putting this all together.
I gotta ask tho, what is the name of that new tab extension you have running @59:01. The life countdown. I really dig how clean and minimal it is

[amolpathakndb]

great job sir..nice n crisp explaination! just one request, your mouse pointer is too small and also darrk in color making it lost in the background... as a result, sometimes I am not able to pick where you clicked..

[shreyasjejurkar]

Hi, Mehul. I really like your channel, and really appreciate the hard work you are putting in codedamn. Moreover, I am your recent subscriber.
I recently watched your digital ocean video series, and really loved it. But am looking for video from your side where you create a *small* full-stack (it can be anything) app in Nextjs (front-end), NodeJs (expressjs backend), and then deploying it to digitalOcean droplet. I mean I wanted you to replicate the steps that you followed for codedamn deployment to this new small app so that everyone will get to know the real-world deployment once they get familiar with digitalOcean by your tutorial. Please make it. Looking forward to

[darkfoxwillie]

This also works for firefox right? Talking about the principles. Thanks for the content bro!

[Pancakes]

Around 53:00, how come updating the variable to 2000 (2 seconds) does not get reflected in the execution, but adding calls to functions does get updated on the fly?

[honeykulkarni]

Can you please make a video on how to find the component file in dev tools

[ShreeprasadLohar]

Mehul great video. I have some questions:
can I modify the code inside sources tab in browser dev tool at runtime and debug?
How can I go back to previous line while debugging, for example my debugger has reached line 20 in file (Sources tab) and I want it to bring to line 18 and debug again, how can I do that?

[lightningdeveloper]

How can I change the JavaScript code for something that happens onLoad of a particular component directly in the browser?

[jimshtepa]

hello Mehul, just out of curiosity: do you have active software development job other than codedamn or codedamn and video tutorials is your main daytime job?

[TheAudit]

Hey just finished watching Next.js playlist, is there more to that playlist? saw the roadmap chart as well, there you have mentioned that there will be next.js mastery and advance course, have you not released them yet? or are they available already?