[{"data":1,"prerenderedAt":234},["ShallowReactive",2],{"term-b\u002Fbreakpoint":3,"related-b\u002Fbreakpoint":216},{"id":4,"title":5,"acronym":6,"body":7,"category":197,"description":198,"difficulty":199,"extension":200,"letter":201,"meta":202,"navigation":64,"path":203,"related":204,"seo":210,"sitemap":211,"stem":214,"subcategory":6,"__hash__":215},"terms\u002Fterms\u002Fb\u002Fbreakpoint.md","Breakpoint",null,{"type":8,"value":9,"toc":191},"minimark",[10,15,19,23,31,35,180,184,187],[11,12,14],"h2",{"id":13},"eli5-the-vibe-check","ELI5 — The Vibe Check",[16,17,18],"p",{},"A breakpoint is like a 'pause game' button you place on a specific line of code. When the program reaches that line, it freezes so you can look around and see what is happening. You click on a line in your editor, a red dot appears, and the next time that code runs — bam — it stops right there.",[11,20,22],{"id":21},"real-talk","Real Talk",[16,24,25,26,30],{},"A breakpoint is a marker set on a specific line of source code that instructs the debugger to suspend execution when that line is reached. Once paused, the developer can inspect variables, evaluate expressions, and step through subsequent lines. Conditional breakpoints pause only when a specific condition is true (e.g., ",[27,28,29],"code",{},"i === 500","), useful in loops.",[11,32,34],{"id":33},"show-me-the-code","Show Me The Code",[36,37,42],"pre",{"className":38,"code":39,"language":40,"meta":41,"style":41},"language-javascript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F VS Code: click to the left of a line number\n\u002F\u002F A red dot appears — that's your breakpoint\n\n\u002F\u002F Or use the 'debugger' keyword in JS:\nfunction calculate(x, y) {\n  const sum = x + y;\n  debugger; \u002F\u002F \u003C-- breakpoint via code\n  return sum * 2;\n}\n\n\u002F\u002F Conditional breakpoint (VS Code right-click → \"Add Conditional Breakpoint\"):\n\u002F\u002F Condition: i > 100\n","javascript","",[27,43,44,53,59,66,72,103,127,140,157,163,168,174],{"__ignoreMap":41},[45,46,49],"span",{"class":47,"line":48},"line",1,[45,50,52],{"class":51},"sHwdD","\u002F\u002F VS Code: click to the left of a line number\n",[45,54,56],{"class":47,"line":55},2,[45,57,58],{"class":51},"\u002F\u002F A red dot appears — that's your breakpoint\n",[45,60,62],{"class":47,"line":61},3,[45,63,65],{"emptyLinePlaceholder":64},true,"\n",[45,67,69],{"class":47,"line":68},4,[45,70,71],{"class":51},"\u002F\u002F Or use the 'debugger' keyword in JS:\n",[45,73,75,79,83,87,91,94,97,100],{"class":47,"line":74},5,[45,76,78],{"class":77},"spNyl","function",[45,80,82],{"class":81},"s2Zo4"," calculate",[45,84,86],{"class":85},"sMK4o","(",[45,88,90],{"class":89},"sHdIc","x",[45,92,93],{"class":85},",",[45,95,96],{"class":89}," y",[45,98,99],{"class":85},")",[45,101,102],{"class":85}," {\n",[45,104,106,109,113,116,119,122,124],{"class":47,"line":105},6,[45,107,108],{"class":77},"  const",[45,110,112],{"class":111},"sTEyZ"," sum",[45,114,115],{"class":85}," =",[45,117,118],{"class":111}," x",[45,120,121],{"class":85}," +",[45,123,96],{"class":111},[45,125,126],{"class":85},";\n",[45,128,130,134,137],{"class":47,"line":129},7,[45,131,133],{"class":132},"sbssI","  debugger",[45,135,136],{"class":85},";",[45,138,139],{"class":51}," \u002F\u002F \u003C-- breakpoint via code\n",[45,141,143,147,149,152,155],{"class":47,"line":142},8,[45,144,146],{"class":145},"s7zQu","  return",[45,148,112],{"class":111},[45,150,151],{"class":85}," *",[45,153,154],{"class":132}," 2",[45,156,126],{"class":85},[45,158,160],{"class":47,"line":159},9,[45,161,162],{"class":85},"}\n",[45,164,166],{"class":47,"line":165},10,[45,167,65],{"emptyLinePlaceholder":64},[45,169,171],{"class":47,"line":170},11,[45,172,173],{"class":51},"\u002F\u002F Conditional breakpoint (VS Code right-click → \"Add Conditional Breakpoint\"):\n",[45,175,177],{"class":47,"line":176},12,[45,178,179],{"class":51},"\u002F\u002F Condition: i > 100\n",[11,181,183],{"id":182},"when-youll-hear-this","When You'll Hear This",[16,185,186],{},"\"Set a breakpoint before the API call to check the payload.\" \u002F \"Add a conditional breakpoint that only triggers on the failing user ID.\"",[188,189,190],"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 .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}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 .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":41,"searchDepth":55,"depth":55,"links":192},[193,194,195,196],{"id":13,"depth":55,"text":14},{"id":21,"depth":55,"text":22},{"id":33,"depth":55,"text":34},{"id":182,"depth":55,"text":183},"general","A breakpoint is like a 'pause game' button you place on a specific line of code.","intermediate","md","b",{},"\u002Fterms\u002Fb\u002Fbreakpoint",[205,206,207,208,209],"Debugger","Debug","IDE","Stack Trace","Bug",{"title":5,"description":198},{"changefreq":212,"priority":213},"weekly",0.7,"terms\u002Fb\u002Fbreakpoint","8mVBnZC5B2-IOPUvEXJMpof4sHMoVwSPovksnqrUQ3U",[217,221,224,227,231],{"title":209,"path":218,"acronym":6,"category":197,"difficulty":219,"description":220},"\u002Fterms\u002Fb\u002Fbug","beginner","A bug is anything in your code that makes it behave wrong.",{"title":206,"path":222,"acronym":6,"category":197,"difficulty":219,"description":223},"\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":205,"path":225,"acronym":6,"category":197,"difficulty":199,"description":226},"\u002Fterms\u002Fd\u002Fdebugger","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...",{"title":207,"path":228,"acronym":229,"category":197,"difficulty":219,"description":230},"\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":208,"path":232,"acronym":6,"category":197,"difficulty":219,"description":233},"\u002Fterms\u002Fs\u002Fstack-trace","A stack trace is the error report that tells you exactly which functions were called right before your code crashed.",1776518261229]