You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/01-getting-started/3-devtools/article.md
+9-9Lines changed: 9 additions & 9 deletions
Original file line number
Diff line number
Diff line change
@@ -1,14 +1,14 @@
1
1
# Developer console
2
2
3
-
Code is prone to errors. You are quite likely to make errors... Oh, what am I talking about? You are *absolutely* going to make errors, at least if you're a human, not a [robot](https://en.wikipedia.org/wiki/Bender_(Futurama)).
3
+
Code is prone to errors. You will quite likely make errors... Oh, what am I talking about? You are *absolutely* going to make errors, at least if you're a human, not a [robot](https://en.wikipedia.org/wiki/Bender_(Futurama)).
4
4
5
-
But in the browser, a user doesn't see the errors by default. So, if something goes wrong in the script, we won't see what's broken and can't fix it.
5
+
But in the browser, users doesn't see errors by default. So, if something goes wrong in the script, we won't see what's broken and can't fix it.
6
6
7
7
To see errors and get a lot of other useful information about scripts, "developer tools" have been embedded in browsers.
8
8
9
-
Most often developers lean towards Chrome or Firefox for development because those browsers have the best developer tools. Other browsers also provide developer tools, sometimes with special features, but are usually playing "catch-up" to Chrome or Firefox. So most people have a "favorite" browser and switch to others if a problem is browser-specific.
9
+
Most developers lean towards Chrome or Firefox for development because those browsers have the best developer tools. Other browsers also provide developer tools, sometimes with special features, but are usually playing "catch-up" to Chrome or Firefox. So most developers have a "favorite" browser and switch to others if a problem is browser-specific.
10
10
11
-
Developer tools are potent; there are many features. To start, we'll learn how to open them, look at errors and run JavaScript commands.
11
+
Developer tools are potent; they have many features. To start, we'll learn how to open them, look at errors, and run JavaScript commands.
12
12
13
13
## Google Chrome
14
14
@@ -31,28 +31,28 @@ The exact look of developer tools depends on your version of Chrome. It changes
31
31
32
32
Below the error message, there is a blue `>` symbol. It marks a "command line" where we can type JavaScript commands. Press `key:Enter` to run them (`key:Shift+Enter` to input multi-line commands).
33
33
34
-
Now we can see errors, and that's enough for a start. We'll be back to developer tools later and cover debugging more in-depth in the chapter <info:debugging-chrome>.
34
+
Now we can see errors, and that's enough for a start. We'll come back to developer tools later and cover debugging more in-depth in the chapter <info:debugging-chrome>.
35
35
36
36
37
37
## Firefox, Edge, and others
38
38
39
39
Most other browsers use `key:F12` to open developer tools.
40
40
41
-
The look & feel of them is quite similar. Once you know how to use one of those tools (you can start with Chrome), you can easily switch to another.
41
+
The look & feel of them is quite similar. Once you know how to use one of these tools (you can start with Chrome), you can easily switch to another.
42
42
43
43
## Safari
44
44
45
45
Safari (Mac browser, not supported by Windows/Linux) is a little bit special here. We need to enable the "Develop menu" first.
46
46
47
-
Open Preferences and go to "Advanced" pane. There's a checkbox at the bottom:
47
+
Open Preferences and go to the "Advanced" pane. There's a checkbox at the bottom:
48
48
49
49

50
50
51
51
Now `key:Cmd+Opt+C` can toggle the console. Also, note that the new top menu item named "Develop" has appeared. It has many commands and options.
52
52
53
53
## Summary
54
54
55
-
- Developer tools allow us to see errors, run commands, examine variables and much more.
56
-
- They can be opened with `key:F12` for most browsers under Windows. Chrome for Mac needs `key:Cmd+Opt+J`, Safari: `key:Cmd+Opt+C` (need to enable first).
55
+
- Developer tools allow us to see errors, run commands, examine variables, and much more.
56
+
- They can be opened with `key:F12` for most browsers on Windows. Chrome for Mac needs `key:Cmd+Opt+J`, Safari: `key:Cmd+Opt+C` (need to enable first).
57
57
58
58
Now we have the environment ready. In the next section, we'll get down to JavaScript.
0 commit comments