From 007f06b399ad1c7b6ffa295d9a2dbabf79c333a3 Mon Sep 17 00:00:00 2001 From: Otmar Onderek Date: Tue, 28 Jun 2022 22:53:07 +0200 Subject: [PATCH 01/21] 1.3.1 --- .../01-debugging-chrome/article.md | 200 +++++++++--------- .../chrome-open-sources.svg | 2 +- .../chrome-sources-breakpoint.svg | 2 +- .../chrome-sources-debugger-pause.svg | 2 +- .../chrome-sources-debugger-trace-1.svg | 2 +- .../debugging.view/hello.js | 10 +- .../debugging.view/index.html | 4 +- 7 files changed, 112 insertions(+), 110 deletions(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 4f50fb428..9a84e91fc 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -1,195 +1,197 @@ -# Debugging in the browser +# Ladění v prohlížeči -Before writing more complex code, let's talk about debugging. +Než začneme psát složitější kód, pohovořme si o ladění. -[Debugging](https://en.wikipedia.org/wiki/Debugging) is the process of finding and fixing errors within a script. All modern browsers and most other environments support debugging tools -- a special UI in developer tools that makes debugging much easier. It also allows to trace the code step by step to see what exactly is going on. +[Ladění](https://cs.wikipedia.org/wiki/Ladění_(programování)) je proces hledání a opravování chyb ve skriptu. Ve všech moderních prohlížečích i ve většině ostatních prostředí jsou podporovány ladicí nástroje -- speciální uživatelské rozhraní ve vývojářských nástrojích, které ladění znatelně ulehčuje. Umožňuje také procházet kód krok za krokem, abychom viděli, co přesně se v něm děje. -We'll be using Chrome here, because it has enough features, most other browsers have a similar process. +Zde budeme používat Chrome, protože má dostatek potřebných prvků. Většina ostatních prohlížečů má podobný proces. -## The "Sources" panel +## Panel „Zdroje“ -Your Chrome version may look a little bit different, but it still should be obvious what's there. +Vaše verze Chrome může vypadat trochu odlišně, ale i tak by mělo být zřejmé, o co jde. -- Open the [example page](debugging/index.html) in Chrome. -- Turn on developer tools with `key:F12` (Mac: `key:Cmd+Opt+I`). -- Select the `Sources` panel. +- Otevřete v Chrome [stránku s příkladem](debugging/index.html). +- Zapněte vývojářské nástroje klávesou `key:F12` (Mac: `key:Cmd+Opt+I`). +- Zvolte panel `Sources` (v české verzi `Zdroje`). -Here's what you should see if you are doing it for the first time: +Když to uděláte napoprvé, měli byste vidět toto: ![](chrome-open-sources.svg) -The toggler button opens the tab with files. +Přepínač otevírá záložku se soubory. -Let's click it and select `hello.js` in the tree view. Here's what should show up: +Klikněme na něj a a zvolme `hello.js` ve stromovém zobrazení. Mělo by se zobrazit toto: ![](chrome-tabs.svg) -The Sources panel has 3 parts: +Panel zdrojů má 3 části: -1. The **File Navigator** pane lists HTML, JavaScript, CSS and other files, including images that are attached to the page. Chrome extensions may appear here too. -2. The **Code Editor** pane shows the source code. -3. The **JavaScript Debugging** pane is for debugging, we'll explore it soon. +1. Záložka **File Navigator** (**Navigační panel**) zobrazuje soubory HTML, JavaScript, CSS a jiné, včetně obrázků, které jsou připojeny ke stránce. Zde se mohou objevit i rozšíření Chrome. +2. Záložka **Code Editor** (**Editor kódu**) zobrazuje zdrojový kód. +3. Záložka **JavaScript Debugging** (**Ladicí nástroj**) slouží k ladění. Brzy ji prozkoumáme. -Now you could click the same toggler again to hide the resources list and give the code some space. +Nyní můžete kliknout na stejný přepínač znovu, abyste skryli seznam zdrojů a poskytli prostor kódu. -## Console +## Konzole -If we press `key:Esc`, then a console opens below. We can type commands there and press `key:Enter` to execute. +Pokud stiskneme `key:Esc`, otevře se dole konzole. Můžeme tam psát příkazy a pak stisknout `key:Enter`, aby se vykonaly. -After a statement is executed, its result is shown below. +Poté, co se příkaz vykoná, se dole zobrazí jeho výsledek. -For example, here `1+2` results in `3`, while the function call `hello("debugger")` returns nothing, so the result is `undefined`: +Například `1+2` zde vydá výsledek `3`, zatímco volání funkce `ahoj("debugger")` nevrátí nic, takže výsledek bude `undefined`: ![](chrome-sources-console.svg) -## Breakpoints +## Zarážky -Let's examine what's going on within the code of the [example page](debugging/index.html). In `hello.js`, click at line number `4`. Yes, right on the `4` digit, not on the code. +Nyní prozkoumáme, co se přesně děje v kódu na [stránce s příkladem](debugging/index.html). V `hello.js` klikněte na číslo řádku `4`. Ano, přímo na číslici `4`, ne na kód. -Congratulations! You've set a breakpoint. Please also click on the number for line `8`. +Gratulujeme! Právě jste nastavili zarážku. Klikněte prosím také na číslo řádku `8`. -It should look like this (blue is where you should click): +Mělo by to vypadat takto (modrá barva označuje, kam byste měli kliknout): ![](chrome-sources-breakpoint.svg) -A *breakpoint* is a point of code where the debugger will automatically pause the JavaScript execution. +*Zarážka* je místo, na němž ladicí nástroj automaticky pozastaví běh JavaScriptu. -While the code is paused, we can examine current variables, execute commands in the console etc. In other words, we can debug it. +Když je kód pozastaven, můžeme prozkoumávat aktuální proměnné, spouštět příkazy v konzoli a podobně. Jinými slovy, můžeme kód ladit. -We can always find a list of breakpoints in the right panel. That's useful when we have many breakpoints in various files. It allows us to: -- Quickly jump to the breakpoint in the code (by clicking on it in the right panel). -- Temporarily disable the breakpoint by unchecking it. -- Remove the breakpoint by right-clicking and selecting Remove. -- ...And so on. +V pravém panelu vždy najdeme seznam zarážek. To je užitečné, když máme mnoho zarážek v různých souborech. Seznam nám umožňuje: +- Rychle přeskočit na zarážku v kódu (když na ni klikneme v pravém panelu). +- Dočasně zarážku zakázat tím, že zrušíme její zaškrtnutí. +- Odstranit zarážku tím, že na ni klikneme pravým tlačítkem myši a zvolíme Remove (Odstranit zarážku). +- ...A tak dále. -```smart header="Conditional breakpoints" -*Right click* on the line number allows to create a *conditional* breakpoint. It only triggers when the given expression, that you should provide when you create it, is truthy. +```smart header="Podmíněné zarážky" +*Kliknutím pravým tlačítkem* na číslo řádku můžeme vytvořit *podmíněnou* zarážku. Ta se aktivuje, jen když je zadaný výraz, který byste měli uvést při jejím vytvoření, pravdivý. -That's handy when we need to stop only for a certain variable value or for certain function parameters. +To se hodí, když potřebujeme pozastavit skript jen při určité hodnotě proměnné nebo při určitých parametrech funkce. ``` -## The command "debugger" +## Příkaz „debugger“ -We can also pause the code by using the `debugger` command in it, like this: +Pozastavit kód můžeme také tím, že v něm použijeme příkaz `debugger`, například: ```js -function hello(name) { - let phrase = `Hello, ${name}!`; +function ahoj(jméno) { + let věta = `Ahoj, ${jméno}!`; *!* - debugger; // <-- the debugger stops here + debugger; // <-- ladicí nástroj se tady zastaví */!* - say(phrase); + řekni(věta); } ``` -Such command works only when the development tools are open, otherwise the browser ignores it. +Tento příkaz funguje jen tehdy, když jsou otevřené vývojářské nástroje, jinak jej prohlížeč ignoruje. -## Pause and look around +## Pozastavení a rozhlédnutí -In our example, `hello()` is called during the page load, so the easiest way to activate the debugger (after we've set the breakpoints) is to reload the page. So let's press `key:F5` (Windows, Linux) or `key:Cmd+R` (Mac). +V našem příkladu je během nahrání stránky zavoláno `ahoj()`, takže nejjednodušším způsobem, jak aktivovat ladicí nástroj (po nastavení zarážek), je znovu načíst stránku. Stiskneme tedy `key:F5` (Windows, Linux) nebo `key:Cmd+R` (Mac). -As the breakpoint is set, the execution pauses at the 4th line: +Když je zarážka nastavena, běh se zastaví na 4. řádku: ![](chrome-sources-debugger-pause.svg) -Please open the informational dropdowns to the right (labeled with arrows). They allow you to examine the current code state: +Prosíme otevřete si informační dropdowny vpravo (označené šipkami), které vám umožní prozkoumávat aktuální stav kódu: -1. **`Watch` -- shows current values for any expressions.** +1. **`Watch` (`Sledované výrazy`) -- zobrazuje aktuální hodnoty libovolných výrazů.** - You can click the plus `+` and input an expression. The debugger will show its value, automatically recalculating it in the process of execution. + Můžete kliknout na plus `+` a zadat výraz. Ladicí nástroj bude zobrazovat jeho hodnotu, kterou při běhu skriptu automaticky přepočítá. -2. **`Call Stack` -- shows the nested calls chain.** +2. **`Call Stack` (`Zásobník volání`) -- zobrazuje řetězec vnořených volání funkcí.** - At the current moment the debugger is inside `hello()` call, called by a script in `index.html` (no function there, so it's called "anonymous"). + V aktuálním okamžiku je ladicí nástroj uvnitř volání `ahoj()`, kterou zavolal skript v `index.html` (není zde žádná funkce, takže se nazývá „anonymní“). - If you click on a stack item (e.g. "anonymous"), the debugger jumps to the corresponding code, and all its variables can be examined as well. -3. **`Scope` -- current variables.** + Když kliknete na prvek zásobníku (např. „anonymní“), ladicí nástroj přeskočí na odpovídající kód a vy můžete prozkoumávat všechny jeho proměnné. + +3. **`Scope` (`Rozsah`) -- aktuální proměnné.** - `Local` shows local function variables. You can also see their values highlighted right over the source. + `Local` (`Místní`) zobrazuje lokální funkční proměnné. Vidíte také jejich hodnoty zvýrazněné přímo nad zdrojovým kódem. - `Global` has global variables (out of any functions). + `Global` (`Globální`) obsahuje globální proměnné (mimo všechny funkce). - There's also `this` keyword there that we didn't study yet, but we'll do that soon. + Je zde také klíčové slovo `this`, které jsme zatím neprobírali, ale brzy tak učiníme. -## Tracing the execution +## Sledování běhu skriptu -Now it's time to *trace* the script. +Nyní nastal čas *krokovat* skript. -There are buttons for it at the top of the right panel. Let's engage them. +K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. - -- "Resume": continue the execution, hotkey `key:F8`. -: Resumes the execution. If there are no additional breakpoints, then the execution just continues and the debugger loses control. + -- „Resume“ („Obnovit běh skriptu“): pokračuje v běhu, klávesa `key:F8`. - Here's what we can see after a click on it: +: Pokračuje v běhu skriptu. Nejsou-li už žádné další zarážky, skript se bude prostě vykonávat dál a ladicí nástroj nad ním ztratí kontrolu. - ![](chrome-sources-debugger-trace-1.svg) + Toto uvidíme poté, co na něj klikneme: - The execution has resumed, reached another breakpoint inside `say()` and paused there. Take a look at the "Call Stack" at the right. It has increased by one more call. We're inside `say()` now. + ![](chrome-sources-debugger-trace-1.svg) - -- "Step": run the next command, hotkey `key:F9`. -: Run the next statement. If we click it now, `alert` will be shown. + Běh skriptu se obnovil, dosáhl další zarážky uvnitř `řekni()` a zastavil se tam. Podívejte se na zásobník volání („Call Stack“) vpravo. Zvětšil se o jedno volání. Nyní jsme uvnitř `řekni()`. - Clicking this again and again will step through all script statements one by one. + -- „Step“ („Krokovat“): spustí další příkaz, klávesa `key:F9`. +: Spustí další příkaz. Když na něj nyní klikneme, zobrazí se `alert`. - -- "Step over": run the next command, but *don't go into a function*, hotkey `key:F10`. -: Similar to the previous "Step" command, but behaves differently if the next statement is a function call (not a built-in, like `alert`, but a function of our own). + Dalším a dalším klikáním můžeme krokovat všechny příkazy skriptu jeden po druhém. - If we compare them, the "Step" command goes into a nested function call and pauses the execution at its first line, while "Step over" executes the nested function call invisibly to us, skipping the function internals. + -- „Step over“ („Překročit další volání funkce“): spustí další příkaz, ale *nevstoupí do funkce*, klávesa `key:F10`. +: Podobá se předchozímu příkazu „Krokovat“, ale chová se jinak, jestliže dalším příkazem je volání funkce (ne vestavěné funkce jako `alert`, ale naší vlastní funkce). - The execution is then paused immediately after that function call. + Když si je srovnáme, příkaz „Krokovat“ vstoupí do vnořeného volání funkce a pozastaví běh na jejím prvním řádku, zatímco „Překročit další volání funkce“ spustí vnořené volání funkce, aniž bychom je viděli, a překročí její vnitřek. + + Běh se pak ihned po volání této funkce pozastaví. - That's good if we're not interested to see what happens inside the function call. + To se hodí, když si nepřejeme vidět, co se děje uvnitř volané funkce. - -- "Step into", hotkey `key:F11`. -: That's similar to "Step", but behaves differently in case of asynchronous function calls. If you're only starting to learn JavaScript, then you can ignore the difference, as we don't have asynchronous calls yet. + -- „Step into“ („Pokročit do dalšího volání funkce“), klávesa `key:F11`. +: Podobá se „Krokovat“, ale chová se jinak v případě asynchronního volání funkce. Jestliže se teprve začínáte učit JavaScript, můžete tento rozdíl ignorovat, jelikož asynchronní volání funkcí ještě neznáme. - For the future, just note that "Step" command ignores async actions, such as `setTimeout` (scheduled function call), that execute later. The "Step into" goes into their code, waiting for them if necessary. See [DevTools manual](https://developers.google.com/web/updates/2018/01/devtools#async) for more details. + Do budoucna jen poznamenejme, že příkaz „Krokovat“ ignoruje asynchronní akce, například `setTimeout` (vyvolání funkce za určitou dobu), které se vykonávají později. Příkaz „Pokročit do dalšího volání funkce“ vstoupí do jejich kódu a počká na ně, pokud je to nutné. Podrobnosti viz [manuál k vývojářským nástrojům](https://developers.google.com/web/updates/2018/01/devtools#async). - -- "Step out": continue the execution till the end of the current function, hotkey `key:Shift+F11`. -: Continue the execution and stop it at the very last line of the current function. That's handy when we accidentally entered a nested call using , but it does not interest us, and we want to continue to its end as soon as possible. + -- „Step out“ („Postoupit ven z aktuální funkce“) pokračuje v běhu až do konce vykonávané funkce, klávesa `key:Shift+F11`. +: Pokračuje v běhu a zastaví se až na posledním řádku právě vykonávané funkce. To se hodí, když jsme omylem vstoupili do volání funkce pomocí , ale ta nás nezajímá, a tak chceme co nejrychleji dospět k jejímu konci. - -- enable/disable all breakpoints. -: That button does not move the execution. Just a mass on/off for breakpoints. + -- povolí/zakáže všechny zarážky. +: Toto tlačítko nemá vliv na běh skriptu, jen hromadně zapne/vypne všechny zarážky. - -- enable/disable automatic pause in case of an error. -: When enabled, if the developer tools is open, an error during the script execution automatically pauses it. Then we can analyze variables in the debugger to see what went wrong. So if our script dies with an error, we can open debugger, enable this option and reload the page to see where it dies and what's the context at that moment. + -- povolí/zakáže automatické pozastavení v případě chyby. +: Když je povoleno a vývojářské nástroje jsou otevřeny, chyba během výkonu skriptu jej automaticky pozastaví. Pak můžeme v ladicím nástroji analyzovat proměnné, abychom viděli, co se pokazilo. Když tedy náš skript skončí s chybou, můžeme otevřít ladicí nástroj, povolit tuto možnost a znovu načíst stránku, abychom viděli, kde spadl a jaký je v tom okamžiku jeho kontext. -```smart header="Continue to here" -Right click on a line of code opens the context menu with a great option called "Continue to here". +```smart header="Pokračovat až sem" +Po kliknutí pravým tlačítkem myši na řádek kódu se otevře kontextové menu s výtečnou možností „Continue to here“ („Pokračovat sem“). -That's handy when we want to move multiple steps forward to the line, but we're too lazy to set a breakpoint. +To se hodí, když chceme provést větší množství kroků až k tomuto řádku, ale nechce se nám nastavovat zarážku. ``` -## Logging +## Logování -To output something to console from our code, there's `console.log` function. +Chceme-li vypsat něco z našeho kódu na konzoli, máme k tomu funkci `console.log`. -For instance, this outputs values from `0` to `4` to console: +Například tento kód vypíše na konzoli hodnoty od `0` do `4`: ```js run -// open console to see +// otevřete si konzoli a uvidíte for (let i = 0; i < 5; i++) { - console.log("value,", i); + console.log("hodnota,", i); } ``` -Regular users don't see that output, it is in the console. To see it, either open the Console panel of developer tools or press `key:Esc` while in another panel: that opens the console at the bottom. +Běžní uživatelé tento výstup neuvidí, vypíše se na konzoli. Abyste jej viděli, otevřete panel Console (Konzole) vývojářských nástrojů nebo stiskněte `key:Esc`, když jste v jiném panelu: tím se dole otevře konzole. -If we have enough logging in our code, then we can see what's going on from the records, without the debugger. +Máme-li v kódu dostatek logování, uvidíme z těchto záznamů, co se děje, i bez ladicího nástroje. -## Summary +## Shrnutí -As we can see, there are three main ways to pause a script: -1. A breakpoint. -2. The `debugger` statements. -3. An error (if dev tools are open and the button is "on"). +Jak vidíme, existují tři hlavní způsoby, jak pozastavit skript: +1. Zarážka. +2. Příkaz `debugger`. +3. Chyba (jsou-li vývojářské nástroje otevřené a tlačítko je „zapnuté“). -When paused, we can debug: examine variables and trace the code to see where the execution goes wrong. +Když je skript pozastaven, můžeme jej ladit: prozkoumávat proměnné a krokovat kód, abychom viděli, kde se při jeho vykonávání něco pokazilo. -There are many more options in developer tools than covered here. The full manual is at . +Vývojářské nástroje obsahují mnohem více možností, než jsme zde uvedli. Kompletní manuál najdete na . -The information from this chapter is enough to begin debugging, but later, especially if you do a lot of browser stuff, please go there and look through more advanced capabilities of developer tools. +Informace z této kapitoly postačí k začátku ladění, ale později, zvláště budete-li vytvářet hodně materiálu v prohlížeči, se tam prosím podívejte a prostudujte si pokročilejší možnosti vývojářských nástrojů. -Oh, and also you can click at various places of dev tools and just see what's showing up. That's probably the fastest route to learn dev tools. Don't forget about the right click and context menus! +A také můžete klikat na různá místa vývojářských nástrojů a jen se dívat, co se ukáže. To je asi nejrychlejší způsob, jak se je naučit. Nezapomínejte na pravé tlačítko myši a kontextová menu! \ No newline at end of file diff --git a/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg b/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg index 5fc6dce3a..a6cedb85b 100644 --- a/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg +++ b/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg @@ -1 +1 @@ -open sources \ No newline at end of file +otevřený zdrojový kód \ No newline at end of file diff --git a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-breakpoint.svg b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-breakpoint.svg index 63bf4966e..9cccdfb03 100644 --- a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-breakpoint.svg +++ b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-breakpoint.svg @@ -1 +1 @@ -here's the listbreakpoints \ No newline at end of file +zde je seznamzarážky \ No newline at end of file diff --git a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg index 0147c2e0a..6873a70dc 100644 --- a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg +++ b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg @@ -1 +1 @@ -213see the outer call detailswatch expressionscurrent variables \ No newline at end of file +213viz detaily vnějšího volánísledovat výrazyaktuální proměnné \ No newline at end of file diff --git a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-trace-1.svg b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-trace-1.svg index 9fa1b3b8c..cea51b5b5 100644 --- a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-trace-1.svg +++ b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-trace-1.svg @@ -1 +1 @@ -nested calls \ No newline at end of file +vnořená volání \ No newline at end of file diff --git a/1-js/03-code-quality/01-debugging-chrome/debugging.view/hello.js b/1-js/03-code-quality/01-debugging-chrome/debugging.view/hello.js index 4236740e8..5090ff379 100644 --- a/1-js/03-code-quality/01-debugging-chrome/debugging.view/hello.js +++ b/1-js/03-code-quality/01-debugging-chrome/debugging.view/hello.js @@ -1,9 +1,9 @@ -function hello(name) { - let phrase = `Hello, ${name}!`; +function ahoj(jméno) { + let věta = `Ahoj, ${jméno}!`; - say(phrase); + řekni(věta); } -function say(phrase) { - alert(`** ${phrase} **`); +function řekni(věta) { + alert(`** ${věta} **`); } diff --git a/1-js/03-code-quality/01-debugging-chrome/debugging.view/index.html b/1-js/03-code-quality/01-debugging-chrome/debugging.view/index.html index 6c651e854..fade03cab 100644 --- a/1-js/03-code-quality/01-debugging-chrome/debugging.view/index.html +++ b/1-js/03-code-quality/01-debugging-chrome/debugging.view/index.html @@ -4,10 +4,10 @@ - An example for debugging. + Příklad pro ladění. From a1e7d870ca0469041a28f51a1c015a03e54cbc5f Mon Sep 17 00:00:00 2001 From: Otmar Onderek Date: Tue, 28 Jun 2022 23:17:28 +0200 Subject: [PATCH 02/21] Update chrome-sources-debugger-pause.svg --- .../01-debugging-chrome/chrome-sources-debugger-pause.svg | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg index 6873a70dc..6835bfaa4 100644 --- a/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg +++ b/1-js/03-code-quality/01-debugging-chrome/chrome-sources-debugger-pause.svg @@ -1 +1 @@ -213viz detaily vnějšího volánísledovat výrazyaktuální proměnné \ No newline at end of file +213viz detaily vnějšího volánísledování výrazůaktuální proměnné \ No newline at end of file From 6467f4aaef3e8b5063d49f349adfff772b578ba0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Pomajb=C3=ADk?= Date: Mon, 1 Aug 2022 23:33:17 +0200 Subject: [PATCH 03/21] translate adjustment in svg --- .../chrome-open-sources.svg | 35 ++++++++++++++++++- 1 file changed, 34 insertions(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg b/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg index a6cedb85b..183820552 100644 --- a/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg +++ b/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg @@ -1 +1,34 @@ -otevřený zdrojový kód \ No newline at end of file + + + + + + + + + + + + + + Otevřete lištu se zdrojovými soubory + + + + + From c4a947463d804df6c9f592015c3fd19febe89c96 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Pomajb=C3=ADk?= Date: Mon, 1 Aug 2022 23:40:01 +0200 Subject: [PATCH 04/21] Adjusted to source formatting --- 1-js/03-code-quality/01-debugging-chrome/article.md | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 9a84e91fc..c95b39866 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -105,7 +105,6 @@ Prosíme otevřete si informační dropdowny vpravo (označené šipkami), kter V aktuálním okamžiku je ladicí nástroj uvnitř volání `ahoj()`, kterou zavolal skript v `index.html` (není zde žádná funkce, takže se nazývá „anonymní“). Když kliknete na prvek zásobníku (např. „anonymní“), ladicí nástroj přeskočí na odpovídající kód a vy můžete prozkoumávat všechny jeho proměnné. - 3. **`Scope` (`Rozsah`) -- aktuální proměnné.** `Local` (`Místní`) zobrazuje lokální funkční proměnné. Vidíte také jejich hodnoty zvýrazněné přímo nad zdrojovým kódem. @@ -121,7 +120,6 @@ Nyní nastal čas *krokovat* skript. K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. -- „Resume“ („Obnovit běh skriptu“): pokračuje v běhu, klávesa `key:F8`. - : Pokračuje v běhu skriptu. Nejsou-li už žádné další zarážky, skript se bude prostě vykonávat dál a ladicí nástroj nad ním ztratí kontrolu. Toto uvidíme poté, co na něj klikneme: @@ -139,7 +137,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. : Podobá se předchozímu příkazu „Krokovat“, ale chová se jinak, jestliže dalším příkazem je volání funkce (ne vestavěné funkce jako `alert`, ale naší vlastní funkce). Když si je srovnáme, příkaz „Krokovat“ vstoupí do vnořeného volání funkce a pozastaví běh na jejím prvním řádku, zatímco „Překročit další volání funkce“ spustí vnořené volání funkce, aniž bychom je viděli, a překročí její vnitřek. - + Běh se pak ihned po volání této funkce pozastaví. To se hodí, když si nepřejeme vidět, co se děje uvnitř volané funkce. @@ -194,4 +192,4 @@ Vývojářské nástroje obsahují mnohem více možností, než jsme zde uvedli Informace z této kapitoly postačí k začátku ladění, ale později, zvláště budete-li vytvářet hodně materiálu v prohlížeči, se tam prosím podívejte a prostudujte si pokročilejší možnosti vývojářských nástrojů. -A také můžete klikat na různá místa vývojářských nástrojů a jen se dívat, co se ukáže. To je asi nejrychlejší způsob, jak se je naučit. Nezapomínejte na pravé tlačítko myši a kontextová menu! \ No newline at end of file +A také můžete klikat na různá místa vývojářských nástrojů a jen se dívat, co se ukáže. To je asi nejrychlejší způsob, jak se je naučit. Nezapomínejte na pravé tlačítko myši a kontextová menu! From 02046ae0c9699793761de861e43471efda40adc8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Pomajb=C3=ADk?= Date: Tue, 2 Aug 2022 00:06:11 +0200 Subject: [PATCH 05/21] Adjusted translation for svg --- .../03-code-quality/01-debugging-chrome/chrome-open-sources.svg | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg b/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg index 183820552..a0e9057c7 100644 --- a/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg +++ b/1-js/03-code-quality/01-debugging-chrome/chrome-open-sources.svg @@ -25,7 +25,7 @@ - Otevřete lištu se zdrojovými soubory + Otevřete záložku se zdrojovými soubory From 27efe3ed73d749ed8538cb337da5ba0796779ac4 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:54:53 +0200 Subject: [PATCH 06/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index c95b39866..1539c037b 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -65,7 +65,7 @@ V pravém panelu vždy najdeme seznam zarážek. To je užitečné, když máme ```smart header="Podmíněné zarážky" *Kliknutím pravým tlačítkem* na číslo řádku můžeme vytvořit *podmíněnou* zarážku. Ta se aktivuje, jen když je zadaný výraz, který byste měli uvést při jejím vytvoření, pravdivý. -To se hodí, když potřebujeme pozastavit skript jen při určité hodnotě proměnné nebo při určitých parametrech funkce. +To se hodí, když potřebujeme pozastavit skript jen při určité hodnotě proměnné nebo při určitých argumentech pro funkci. ``` ## Příkaz „debugger“ From 3675505e92def99d34e25670e3023709265b92db Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:57:39 +0200 Subject: [PATCH 07/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 1539c037b..da130663a 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -94,7 +94,7 @@ Když je zarážka nastavena, běh se zastaví na 4. řádku: ![](chrome-sources-debugger-pause.svg) -Prosíme otevřete si informační dropdowny vpravo (označené šipkami), které vám umožní prozkoumávat aktuální stav kódu: +Rozevřete si rozbalovací menu, které se nachází vpravo (označené šipkami). Umožní vám prozkoumávat aktuální stav kódu: 1. **`Watch` (`Sledované výrazy`) -- zobrazuje aktuální hodnoty libovolných výrazů.** From 23ebc5aa62654ea681339a77cdd4404f905a372a Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:57:56 +0200 Subject: [PATCH 08/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index da130663a..590b62917 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -133,7 +133,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. Dalším a dalším klikáním můžeme krokovat všechny příkazy skriptu jeden po druhém. - -- „Step over“ („Překročit další volání funkce“): spustí další příkaz, ale *nevstoupí do funkce*, klávesa `key:F10`. + -- „Step over“ („Překročit“): spustí další příkaz, ale *nevstoupí do funkce*, klávesa `key:F10`. : Podobá se předchozímu příkazu „Krokovat“, ale chová se jinak, jestliže dalším příkazem je volání funkce (ne vestavěné funkce jako `alert`, ale naší vlastní funkce). Když si je srovnáme, příkaz „Krokovat“ vstoupí do vnořeného volání funkce a pozastaví běh na jejím prvním řádku, zatímco „Překročit další volání funkce“ spustí vnořené volání funkce, aniž bychom je viděli, a překročí její vnitřek. From 85f63230d15b7736ff14d7589e6d0691fd03ae30 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:58:10 +0200 Subject: [PATCH 09/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 590b62917..b14d38071 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -136,7 +136,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. -- „Step over“ („Překročit“): spustí další příkaz, ale *nevstoupí do funkce*, klávesa `key:F10`. : Podobá se předchozímu příkazu „Krokovat“, ale chová se jinak, jestliže dalším příkazem je volání funkce (ne vestavěné funkce jako `alert`, ale naší vlastní funkce). - Když si je srovnáme, příkaz „Krokovat“ vstoupí do vnořeného volání funkce a pozastaví běh na jejím prvním řádku, zatímco „Překročit další volání funkce“ spustí vnořené volání funkce, aniž bychom je viděli, a překročí její vnitřek. + Když si je srovnáme, příkaz „Krokovat“ vstoupí do vnořeného volání funkce a pozastaví běh na jejím prvním řádku, zatímco „Překročit“ spustí vnořené volání funkce a překročí její vnitřek. Běh se pak ihned po volání této funkce pozastaví. From b54d1c6dda82ad930cf0bb1fcbeb406718b0e690 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:58:19 +0200 Subject: [PATCH 10/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index b14d38071..b5133e6a1 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -140,7 +140,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. Běh se pak ihned po volání této funkce pozastaví. - To se hodí, když si nepřejeme vidět, co se děje uvnitř volané funkce. + To se hodí, když nás nezajímá, co se děje uvnitř volané funkce. -- „Step into“ („Pokročit do dalšího volání funkce“), klávesa `key:F11`. : Podobá se „Krokovat“, ale chová se jinak v případě asynchronního volání funkce. Jestliže se teprve začínáte učit JavaScript, můžete tento rozdíl ignorovat, jelikož asynchronní volání funkcí ještě neznáme. From 1c5d6965520e2ceb641090fc3b83f96dad34e03e Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:58:28 +0200 Subject: [PATCH 11/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index b5133e6a1..c0cb52eec 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -142,7 +142,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. To se hodí, když nás nezajímá, co se děje uvnitř volané funkce. - -- „Step into“ („Pokročit do dalšího volání funkce“), klávesa `key:F11`. + -- „Step into“ („Vnořit“), klávesa `key:F11`. : Podobá se „Krokovat“, ale chová se jinak v případě asynchronního volání funkce. Jestliže se teprve začínáte učit JavaScript, můžete tento rozdíl ignorovat, jelikož asynchronní volání funkcí ještě neznáme. Do budoucna jen poznamenejme, že příkaz „Krokovat“ ignoruje asynchronní akce, například `setTimeout` (vyvolání funkce za určitou dobu), které se vykonávají později. Příkaz „Pokročit do dalšího volání funkce“ vstoupí do jejich kódu a počká na ně, pokud je to nutné. Podrobnosti viz [manuál k vývojářským nástrojům](https://developers.google.com/web/updates/2018/01/devtools#async). From a24baf94d8d49d519f24f3badbd0a3acfe563fd3 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:58:36 +0200 Subject: [PATCH 12/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index c0cb52eec..d69685db8 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -143,7 +143,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. To se hodí, když nás nezajímá, co se děje uvnitř volané funkce. -- „Step into“ („Vnořit“), klávesa `key:F11`. -: Podobá se „Krokovat“, ale chová se jinak v případě asynchronního volání funkce. Jestliže se teprve začínáte učit JavaScript, můžete tento rozdíl ignorovat, jelikož asynchronní volání funkcí ještě neznáme. +: Podobá se variantě „Krokovat“, ale chová se jinak v případě asynchronního volání funkce. Jestliže se teprve začínáte učit JavaScript, můžete tento rozdíl ignorovat, jelikož asynchronní volání funkcí ještě neznáme. Do budoucna jen poznamenejme, že příkaz „Krokovat“ ignoruje asynchronní akce, například `setTimeout` (vyvolání funkce za určitou dobu), které se vykonávají později. Příkaz „Pokročit do dalšího volání funkce“ vstoupí do jejich kódu a počká na ně, pokud je to nutné. Podrobnosti viz [manuál k vývojářským nástrojům](https://developers.google.com/web/updates/2018/01/devtools#async). From e1a7d850e220446fcdbe9b38f71f2c7f77fa083d Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:58:46 +0200 Subject: [PATCH 13/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index d69685db8..983eb9103 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -145,7 +145,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. -- „Step into“ („Vnořit“), klávesa `key:F11`. : Podobá se variantě „Krokovat“, ale chová se jinak v případě asynchronního volání funkce. Jestliže se teprve začínáte učit JavaScript, můžete tento rozdíl ignorovat, jelikož asynchronní volání funkcí ještě neznáme. - Do budoucna jen poznamenejme, že příkaz „Krokovat“ ignoruje asynchronní akce, například `setTimeout` (vyvolání funkce za určitou dobu), které se vykonávají později. Příkaz „Pokročit do dalšího volání funkce“ vstoupí do jejich kódu a počká na ně, pokud je to nutné. Podrobnosti viz [manuál k vývojářským nástrojům](https://developers.google.com/web/updates/2018/01/devtools#async). + Do budoucna si jen poznamenejme, že příkaz „Krokovat“ ignoruje asynchronní akce, například `setTimeout` (vyvolání funkce za určitou dobu), které se vykonávají později. Příkaz „Vnořit“ vstoupí do jejich kódu a počká na ně, pokud je to nutné. Podrobnosti viz [manuál k vývojářským nástrojům](https://developers.google.com/web/updates/2018/01/devtools#async). -- „Step out“ („Postoupit ven z aktuální funkce“) pokračuje v běhu až do konce vykonávané funkce, klávesa `key:Shift+F11`. : Pokračuje v běhu a zastaví se až na posledním řádku právě vykonávané funkce. To se hodí, když jsme omylem vstoupili do volání funkce pomocí , ale ta nás nezajímá, a tak chceme co nejrychleji dospět k jejímu konci. From 53516b7b09b692c52a86ed7d54ad5a1ebdf71ae8 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:59:07 +0200 Subject: [PATCH 14/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 983eb9103..2a69d9f5e 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -147,7 +147,7 @@ K tomu slouží tlačítka na vrchu pravého panelu. Podívejme se na ně. Do budoucna si jen poznamenejme, že příkaz „Krokovat“ ignoruje asynchronní akce, například `setTimeout` (vyvolání funkce za určitou dobu), které se vykonávají později. Příkaz „Vnořit“ vstoupí do jejich kódu a počká na ně, pokud je to nutné. Podrobnosti viz [manuál k vývojářským nástrojům](https://developers.google.com/web/updates/2018/01/devtools#async). - -- „Step out“ („Postoupit ven z aktuální funkce“) pokračuje v běhu až do konce vykonávané funkce, klávesa `key:Shift+F11`. + -- „Step out“ („Vyskočit“) pokračuje v běhu až do konce vykonávané funkce, klávesa `key:Shift+F11`. : Pokračuje v běhu a zastaví se až na posledním řádku právě vykonávané funkce. To se hodí, když jsme omylem vstoupili do volání funkce pomocí , ale ta nás nezajímá, a tak chceme co nejrychleji dospět k jejímu konci. -- povolí/zakáže všechny zarážky. From 499ed3df207d41b244b192d7438685fac21d376e Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:59:27 +0200 Subject: [PATCH 15/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 2a69d9f5e..cfe4f3a6a 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -181,7 +181,7 @@ Máme-li v kódu dostatek logování, uvidíme z těchto záznamů, co se děje, ## Shrnutí -Jak vidíme, existují tři hlavní způsoby, jak pozastavit skript: +Zjistili jsme, že existují tři hlavní způsoby, jak pozastavit skript: 1. Zarážka. 2. Příkaz `debugger`. 3. Chyba (jsou-li vývojářské nástroje otevřené a tlačítko je „zapnuté“). From 8cc1558afe583ecc1d2a1d7bf9689d9f343b8084 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:59:35 +0200 Subject: [PATCH 16/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index cfe4f3a6a..5c4ddf7c7 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -182,7 +182,7 @@ Máme-li v kódu dostatek logování, uvidíme z těchto záznamů, co se děje, ## Shrnutí Zjistili jsme, že existují tři hlavní způsoby, jak pozastavit skript: -1. Zarážka. +1. Zarážkou. 2. Příkaz `debugger`. 3. Chyba (jsou-li vývojářské nástroje otevřené a tlačítko je „zapnuté“). From f9b989871a5f47a4c6dd8a668144e3b0c4681b9b Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 21:59:41 +0200 Subject: [PATCH 17/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 5c4ddf7c7..e0e5c0c54 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -183,7 +183,7 @@ Máme-li v kódu dostatek logování, uvidíme z těchto záznamů, co se děje, Zjistili jsme, že existují tři hlavní způsoby, jak pozastavit skript: 1. Zarážkou. -2. Příkaz `debugger`. +2. Pomocí příkazu `debugger`. 3. Chyba (jsou-li vývojářské nástroje otevřené a tlačítko je „zapnuté“). Když je skript pozastaven, můžeme jej ladit: prozkoumávat proměnné a krokovat kód, abychom viděli, kde se při jeho vykonávání něco pokazilo. From 35483f958183dac79cc2b88c2ec436fcd572755a Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 22:00:02 +0200 Subject: [PATCH 18/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index e0e5c0c54..00059d41b 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -184,7 +184,7 @@ Máme-li v kódu dostatek logování, uvidíme z těchto záznamů, co se děje, Zjistili jsme, že existují tři hlavní způsoby, jak pozastavit skript: 1. Zarážkou. 2. Pomocí příkazu `debugger`. -3. Chyba (jsou-li vývojářské nástroje otevřené a tlačítko je „zapnuté“). +3. Když se vyskytne chyba (jsou-li vývojářské nástroje otevřené a přepínač je „zapnutý“). Když je skript pozastaven, můžeme jej ladit: prozkoumávat proměnné a krokovat kód, abychom viděli, kde se při jeho vykonávání něco pokazilo. From 2ea3c3e5e37cb51be8a3ea63757ffd803a737d71 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 22:00:11 +0200 Subject: [PATCH 19/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 00059d41b..28f680427 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -186,7 +186,7 @@ Zjistili jsme, že existují tři hlavní způsoby, jak pozastavit skript: 2. Pomocí příkazu `debugger`. 3. Když se vyskytne chyba (jsou-li vývojářské nástroje otevřené a přepínač je „zapnutý“). -Když je skript pozastaven, můžeme jej ladit: prozkoumávat proměnné a krokovat kód, abychom viděli, kde se při jeho vykonávání něco pokazilo. +Když je skript pozastaven, můžeme jej ladit: prozkoumávat proměnné a krokovat kód, abychom viděli, kde a co se při jeho vykonávání pokazilo. Vývojářské nástroje obsahují mnohem více možností, než jsme zde uvedli. Kompletní manuál najdete na . From 6b617aeee182f45e6065e62091f6483b49b301e3 Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 22:00:50 +0200 Subject: [PATCH 20/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 28f680427..37651f969 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -190,6 +190,6 @@ Když je skript pozastaven, můžeme jej ladit: prozkoumávat proměnné a kroko Vývojářské nástroje obsahují mnohem více možností, než jsme zde uvedli. Kompletní manuál najdete na . -Informace z této kapitoly postačí k začátku ladění, ale později, zvláště budete-li vytvářet hodně materiálu v prohlížeči, se tam prosím podívejte a prostudujte si pokročilejší možnosti vývojářských nástrojů. +Informace o ladění, zmíněné v této kapitole, vám do začátku postačí, ale později, zvlášť když budete hodně pracovat s prohlížeči, se tam prosím podívejte a prostudujte si pokročilejší možnosti vývojářských nástrojů. A také můžete klikat na různá místa vývojářských nástrojů a jen se dívat, co se ukáže. To je asi nejrychlejší způsob, jak se je naučit. Nezapomínejte na pravé tlačítko myši a kontextová menu! From 8851faf80bae99289ded2e975b5805ef8339c51f Mon Sep 17 00:00:00 2001 From: otmon76 <66325539+otmon76@users.noreply.github.com> Date: Tue, 2 Aug 2022 22:01:03 +0200 Subject: [PATCH 21/21] Update 1-js/03-code-quality/01-debugging-chrome/article.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Daniel Pomajbík <60559058+danipoma@users.noreply.github.com> --- 1-js/03-code-quality/01-debugging-chrome/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/01-debugging-chrome/article.md b/1-js/03-code-quality/01-debugging-chrome/article.md index 37651f969..f55676314 100644 --- a/1-js/03-code-quality/01-debugging-chrome/article.md +++ b/1-js/03-code-quality/01-debugging-chrome/article.md @@ -192,4 +192,4 @@ Vývojářské nástroje obsahují mnohem více možností, než jsme zde uvedli Informace o ladění, zmíněné v této kapitole, vám do začátku postačí, ale později, zvlášť když budete hodně pracovat s prohlížeči, se tam prosím podívejte a prostudujte si pokročilejší možnosti vývojářských nástrojů. -A také můžete klikat na různá místa vývojářských nástrojů a jen se dívat, co se ukáže. To je asi nejrychlejší způsob, jak se je naučit. Nezapomínejte na pravé tlačítko myši a kontextová menu! +A také můžete klikat na různá místa vývojářských nástrojů a zkoušet, co se objeví. To je asi nejrychlejší způsob, jak se je naučit. Nezapomínejte na pravé tlačítko myši a kontextová menu!