Chrome DevTools Complete Course - Learn to debug your frontend code

Поделиться
HTML-код
  • Опубликовано: 4 окт 2024

Комментарии • 71

  • @codedamn
    @codedamn  3 года назад +9

    Learn Full Stack Development by building over 25 Projects: bit.ly/fullstack-codedamn

  • @fardinkhan3103
    @fardinkhan3103 3 года назад +2

    What a tutorial.. you deserve 10 million subscribers

  • @VenkatGudavalli
    @VenkatGudavalli 3 года назад +3

    This is such a Unique topic, Thank You Mehul !

  • @unnikrishnanvannadil
    @unnikrishnanvannadil 2 года назад +2

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

  • @mohammedmudassir837
    @mohammedmudassir837 3 года назад +6

    Thank You for such an informative tutorial 🔥🔥

    • @codedamn
      @codedamn  3 года назад +1

      Glad it was helpful!

  • @MultiTechSolutions20
    @MultiTechSolutions20 Месяц назад

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

  • @SimpleThingsOne
    @SimpleThingsOne 2 года назад

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

  • @jestingigi4261
    @jestingigi4261 3 года назад +1

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

  • @sheikhakbar2067
    @sheikhakbar2067 Год назад

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

  • @sathishraj4173
    @sathishraj4173 3 года назад +2

    Great Content, Keep Rocking - Thanks a LOT

  • @manu-singh
    @manu-singh 3 года назад +3

    This is awesome bro, thanks

    • @codedamn
      @codedamn  3 года назад

      Thank you Manpreet! :)

  • @akash-
    @akash- 6 месяцев назад

    Awesome Course to learn DevTools!

  • @aj35lightning
    @aj35lightning 3 года назад +7

    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

    • @codedamn
      @codedamn  3 года назад +1

      Glad it was helpful! The new tab extension is "mortality"

    • @aj35lightning
      @aj35lightning 3 года назад

      @@codedamn thanks a lot!

  • @BibekGhoshh1
    @BibekGhoshh1 Год назад +4

    learning it never late........learning in 2023

  • @thenadastudio8295
    @thenadastudio8295 2 года назад

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

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

      Thanks a lot for the education on cording and trading. It was informational and educative.

  • @rohansinha6765
    @rohansinha6765 3 года назад +1

    This is Gold!!

  • @iyousef46
    @iyousef46 3 года назад +2

    Great job. Thanks

  • @HaifengZhu-pn3uq
    @HaifengZhu-pn3uq Год назад

    explained very clearly, thanks!

  • @akashchauhan6784
    @akashchauhan6784 3 года назад +1

    Really Appreciate Your work 😊

    • @codedamn
      @codedamn  3 года назад

      Thank you so much 😀

  • @bipulsharma1357
    @bipulsharma1357 3 года назад +2

    Thank you so much

    • @codedamn
      @codedamn  3 года назад

      Thank you Bipul!

  • @amolpathakndb
    @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..

  • @shaikmohammedirfan1915
    @shaikmohammedirfan1915 Год назад

    Thanks a lot for this video

  • @srishty5779
    @srishty5779 2 года назад

    Thanks a lot , very helpful.

  • @shreyasjejurkar1233
    @shreyasjejurkar1233 3 года назад +5

    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 it.....

    • @codedamn
      @codedamn  3 года назад +2

      Thanks Shreyas. End-to-end deployment project videos are definitely something I wanted to do for a long time. I'll do it soon :)

    • @shreyasjejurkar1233
      @shreyasjejurkar1233 3 года назад

      @@codedamn yeah thanks! Just replicate the codedamn deployment you did, but for sample MERN app, and that would be great!
      Thanks for response, I really appreciate your efforts! 🙌

  • @chigurupati_s
    @chigurupati_s Год назад

    Thank you bro, super

  • @darkfoxwillie
    @darkfoxwillie 3 года назад +7

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

    • @codedamn
      @codedamn  3 года назад +3

      Some theory concepts like Network tab stats would be same. But most features are Chrome DevTools specific I guess. I never spent a lot of time with Firefox DevTools

    • @ParthKawatra
      @ParthKawatra 3 года назад

      @@codedamn some people say FFX Dev tool is best for CSS grids and flexbox stuff.

    • @codedamn
      @codedamn  3 года назад +3

      I think firefox used to be great for grid, but chrome devtools also supports CSS grid debugging now

  • @365Pancakes
    @365Pancakes 3 года назад +2

    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?

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

    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?

  • @surendrareddyseelam9757
    @surendrareddyseelam9757 3 года назад

    THANKS MUCH BROTHER 🙏

  • @abhichohan8837
    @abhichohan8837 2 года назад

    Thanks a ton :)

  • @safdarawn902
    @safdarawn902 3 года назад

    Thanks a lot Bro

  • @vaibhavmatere18
    @vaibhavmatere18 2 года назад

    pretty helpful !

  • @honeykulkarni6490
    @honeykulkarni6490 2 года назад

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

  • @julio5434
    @julio5434 2 года назад +2

    💗💗💗

  • @jimshtepa5423
    @jimshtepa5423 3 года назад +1

    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?

    • @codedamn
      @codedamn  3 года назад

      No, I did not take up job after completing the degree this month.

    • @jimshtepa5423
      @jimshtepa5423 3 года назад

      @@codedamn wow, you seem to be sooo experienced and command deep knowledge of webservice building and all these by the time you are getting your degree? I am 34 years old former finance specialist switching careers only a year ago. I feel I wasted around 15-20 years of my life on wrong industry=(

    • @jimshtepa5423
      @jimshtepa5423 3 года назад

      @@codedamn Anyways, congrats on your degree and thank you for posting great materials publicly

    • @sethurk
      @sethurk 2 года назад

      @@codedamn , what degree you had completed and from which university?

  • @lightningdeveloper
    @lightningdeveloper Год назад

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

  • @TheAudit
    @TheAudit 3 года назад +1

    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?

    • @codedamn
      @codedamn  3 года назад +1

      Yes. I'll be producing more Next.js content from now. Expect to see some good courses before end of year.

    • @TheAudit
      @TheAudit 3 года назад

      @@codedamn hands down best content on next.js on internet that I've come across with. Looking forward for more next.js videos.

  • @prisinha
    @prisinha 2 года назад

    31:51 set a break point

  • @I4NI_
    @I4NI_ 2 года назад

    iman is that you bro?

  • @prisinha
    @prisinha 2 года назад

    12:22 display as table in console

  • @HologramJay
    @HologramJay 3 года назад +1

    Thanks for the video! I just had a quick question. Do you happen to know why the styles would look one way in the chrome mobile device emulator and look a different way on the actual device?
    Currently I have a project that looks fine on the emulator but has an overflow y of about 25% on the device.

    • @codedamn
      @codedamn  3 года назад +1

      Because chrome mobile emulator still uses chrome as the rendering engine. If your phone is using a different browser, they might have different layouts thanks to browser inconsistencies on the web

    • @HologramJay
      @HologramJay 3 года назад

      @@codedamn I see. Thank for for responding!

  • @prisinha
    @prisinha 2 года назад

    16:16 console debug

  • @prisinha
    @prisinha 2 года назад

    12:51 console group

  • @bhatnagarcapital
    @bhatnagarcapital 3 года назад

    14:58

  • @johngibson1072
    @johngibson1072 2 года назад

    5 minutes in and you've said nothing.

  • @shoaibansari9323
    @shoaibansari9323 Год назад

    fei fe fe fe feefr

  • @shankars101
    @shankars101 2 года назад

    Thank you so much