[{"data":1,"prerenderedAt":207},["ShallowReactive",2],{"term-d\u002Fdebugger":3,"related-d\u002Fdebugger":189},{"id":4,"title":5,"acronym":6,"body":7,"category":170,"description":171,"difficulty":172,"extension":173,"letter":174,"meta":175,"navigation":133,"path":176,"related":177,"seo":183,"sitemap":184,"stem":187,"subcategory":6,"__hash__":188},"terms\u002Fterms\u002Fd\u002Fdebugger.md","Debugger",null,{"type":8,"value":9,"toc":164},"minimark",[10,15,19,23,26,30,153,157,160],[11,12,14],"h2",{"id":13},"eli5-the-vibe-check","ELI5 — The Vibe Check",[16,17,18],"p",{},"A debugger is a special tool that lets you pause your running program mid-execution, look around at all the variables, and step through the code one line at a time — like slow motion replay of your code running. It is way more powerful than console.log but more effort to set up.",[11,20,22],{"id":21},"real-talk","Real Talk",[16,24,25],{},"A debugger is a software tool that controls the execution of a target program, allowing developers to pause execution at breakpoints, inspect and modify variable values, examine the call stack, and step through code line by line (or instruction by instruction). Most IDEs include integrated debuggers. CLI debuggers include gdb, pdb (Python), and node --inspect.",[11,27,29],{"id":28},"show-me-the-code","Show Me The Code",[31,32,37],"pre",{"className":33,"code":34,"language":35,"meta":36,"style":36},"language-javascript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F Node.js debugger:\n\u002F\u002F 1. Add 'debugger' statement in code:\nfunction processUser(user) {\n  debugger; \u002F\u002F execution pauses here\n  return user.name.toUpperCase();\n}\n\n\u002F\u002F 2. Run with inspect:\n\u002F\u002F node --inspect-brk index.js\n\u002F\u002F 3. Open chrome:\u002F\u002Finspect in Chrome\n","javascript","",[38,39,40,49,55,80,93,122,128,135,141,147],"code",{"__ignoreMap":36},[41,42,45],"span",{"class":43,"line":44},"line",1,[41,46,48],{"class":47},"sHwdD","\u002F\u002F Node.js debugger:\n",[41,50,52],{"class":43,"line":51},2,[41,53,54],{"class":47},"\u002F\u002F 1. Add 'debugger' statement in code:\n",[41,56,58,62,66,70,74,77],{"class":43,"line":57},3,[41,59,61],{"class":60},"spNyl","function",[41,63,65],{"class":64},"s2Zo4"," processUser",[41,67,69],{"class":68},"sMK4o","(",[41,71,73],{"class":72},"sHdIc","user",[41,75,76],{"class":68},")",[41,78,79],{"class":68}," {\n",[41,81,83,87,90],{"class":43,"line":82},4,[41,84,86],{"class":85},"sbssI","  debugger",[41,88,89],{"class":68},";",[41,91,92],{"class":47}," \u002F\u002F execution pauses here\n",[41,94,96,100,104,107,110,112,115,119],{"class":43,"line":95},5,[41,97,99],{"class":98},"s7zQu","  return",[41,101,103],{"class":102},"sTEyZ"," user",[41,105,106],{"class":68},".",[41,108,109],{"class":102},"name",[41,111,106],{"class":68},[41,113,114],{"class":64},"toUpperCase",[41,116,118],{"class":117},"swJcz","()",[41,120,121],{"class":68},";\n",[41,123,125],{"class":43,"line":124},6,[41,126,127],{"class":68},"}\n",[41,129,131],{"class":43,"line":130},7,[41,132,134],{"emptyLinePlaceholder":133},true,"\n",[41,136,138],{"class":43,"line":137},8,[41,139,140],{"class":47},"\u002F\u002F 2. Run with inspect:\n",[41,142,144],{"class":43,"line":143},9,[41,145,146],{"class":47},"\u002F\u002F node --inspect-brk index.js\n",[41,148,150],{"class":43,"line":149},10,[41,151,152],{"class":47},"\u002F\u002F 3. Open chrome:\u002F\u002Finspect in Chrome\n",[11,154,156],{"id":155},"when-youll-hear-this","When You'll Hear This",[16,158,159],{},"\"Attach the debugger and step through the function.\" \u002F \"The VS Code debugger shows you every variable's value in real time.\"",[161,162,163],"style",{},"html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":36,"searchDepth":51,"depth":51,"links":165},[166,167,168,169],{"id":13,"depth":51,"text":14},{"id":21,"depth":51,"text":22},{"id":28,"depth":51,"text":29},{"id":155,"depth":51,"text":156},"general","A debugger is a special tool that lets you pause your running program mid-execution, look around at all the variables, and step through the code one line a...","intermediate","md","d",{},"\u002Fterms\u002Fd\u002Fdebugger",[178,179,180,181,182],"Debug","Breakpoint","Stack Trace","IDE","Bug",{"title":5,"description":171},{"changefreq":185,"priority":186},"weekly",0.7,"terms\u002Fd\u002Fdebugger","vfS_FrBYRWJYSAUuXwdwnX3y-EJ_sHSAReXyfvLIK5c",[190,193,197,200,204],{"title":179,"path":191,"acronym":6,"category":170,"difficulty":172,"description":192},"\u002Fterms\u002Fb\u002Fbreakpoint","A breakpoint is like a 'pause game' button you place on a specific line of code.",{"title":182,"path":194,"acronym":6,"category":170,"difficulty":195,"description":196},"\u002Fterms\u002Fb\u002Fbug","beginner","A bug is anything in your code that makes it behave wrong.",{"title":178,"path":198,"acronym":6,"category":170,"difficulty":195,"description":199},"\u002Fterms\u002Fd\u002Fdebug","Debugging is the process of finding and fixing the gremlins in your code. Something is broken, and you need to play detective — adding clues (console.",{"title":181,"path":201,"acronym":202,"category":170,"difficulty":195,"description":203},"\u002Fterms\u002Fi\u002Fide","Integrated Development Environment","An IDE is like a super-powered notebook for writing code. It comes with a pen, a spell-checker, a dictionary, and a built-in teacher all in one app.",{"title":180,"path":205,"acronym":6,"category":170,"difficulty":195,"description":206},"\u002Fterms\u002Fs\u002Fstack-trace","A stack trace is the error report that tells you exactly which functions were called right before your code crashed.",1776518273138]