This is an invaluable series. Where was this 15 years ago? :-) A bonus tip I just discovered: You can switch the docking position of the dev tools with the keyboard shortcut Cmd + Shift + D on Mac or Ctl + Shift + D on Windows.
learned a lot, thank u. would love to learn more about the application tab in chrome devtools as well if u ever decide to do a more in depth video of what all the different options in that tab are for exactly like the application/storage/background services and the options in them like local and session storage, back/forward catche, and all the other ones that are important in ur experience. i'm sure a bunch of them are prob self-explanatory just from their name, but i've never messed with them before. either way, learned a lot, thanks
At 7:12 of the video, you highlight error,warn,info then comment // out all 3 at once, How did you do that? Great video as whole too! Very informative!
Steve this is awesome do you have any video about JS for beginners I love the way you explain I don’t get tired of of watching your video one question how do you get ride of undefined in console I know by holding shift key and return we won’t get is but it’s annoying thank you
Which "undefined" are you talking about? Do you mean undefined appearing below a line of code that you type in the console? The console will and should always display the value that is returned from each line of code. For many lines that you will type, the return value will be undefined.
Hi! Great video and very informative! I just have one question. Does console.dir(data); actually convert the variable into the JSON equivalent or even a string at all? Doesn't it just display the JavaScript object itself in a structured and interactive format? Like, its still a JavaScript object , not a JSON string (property names must be in double quotes in JSON). I heard we use JSON.stringify to explicitly convert the object into a string for storage, transmission, or non-interactive display. Is that true? Thank you!
console.dir stands for display interactive. It is intended to display the variable as an interactive object so you can see the properties and prototype. For many objects, this won't make a difference with .log It does make a difference with HTML elements. Like the two versions below. ``` some content ``` vs ``` HTMLParagraphElement - id - title - etc ``` To convert to JSON and transmit, we can only use arrays, objects, string, number, boolean, and nulls. HTML elements have no equivalent in JSON. You could take an HTML string and save it as part of a JSON file, but not an HTML object.
@ChocolateTaiyaki it depends. If you have been learning JS for a couple years and you don't understand then I might worry. If you are new to JS then you might be missing some of the context. Many of these videos are things that I make for my own students. I point them to the appropriate videos when I know it is the right time. When learning development tools, sometimes you just start by being aware that the tools exists. Then you will remember when you come across a situation that requires the tool.
when you open the tools, if you are on the elements panel there can be a bottom segment that has tabs including Console. However, Console has its own tab that can be opened. You can close the lower panel to just show the elements or the console. Additionally, if you click on the 3 dot menu in the top bar there are options for "Dock side" which includes opening the console as a separate window.
![Blox Fruits Dragon Rework Update [Full Stream]](http://i.ytimg.com/vi/EqDAp8udhm0/mqdefault.jpg)
Stay hard Odins
Team The Odin Project here
THE Odin Project
This is an invaluable series. Where was this 15 years ago? :-)
A bonus tip I just discovered: You can switch the docking position of the dev tools with the keyboard shortcut Cmd + Shift + D on Mac or Ctl + Shift + D on Windows.
It sure sounded like your dog answered the 1 + 1 question correctly.
Great tips that table command looks very useful 👌🏾
learned a lot, thank u. would love to learn more about the application tab in chrome devtools as well if u ever decide to do a more in depth video of what all the different options in that tab are for exactly like the application/storage/background services and the options in them like local and session storage, back/forward catche, and all the other ones that are important in ur experience. i'm sure a bunch of them are prob self-explanatory just from their name, but i've never messed with them before. either way, learned a lot, thanks
Application tab is coming soon
Awesome video. Love your dog in the back haha
great explanation, easy to understand thanks
At 7:12 of the video, you highlight error,warn,info then comment // out all 3 at once, How did you do that? Great video as whole too! Very informative!
In VS Code you can select multiple lines and then hit shift + / to comment out all the selected lines.
Very informative, thank you!
The "Verbose" level is for 'console.debug()'
Great video. It was quite helpful! Thanks, Steve.
I have no internet on my PC. A lighting affected it. Only my phone I have. I am learning JS with Chrome console alone. This helps a lot.
@@tomlaskar4226 good luck
Steve this is awesome do you have any video about JS for beginners I love the way you explain I don’t get tired of of watching your video one question how do you get ride of undefined in console I know by holding shift key and return we won’t get is but it’s annoying thank you
Which "undefined" are you talking about? Do you mean undefined appearing below a line of code that you type in the console? The console will and should always display the value that is returned from each line of code. For many lines that you will type, the return value will be undefined.
lol Steve said "1+1" and the dogs barked 2 times
Hi! Great video and very informative! I just have one question. Does console.dir(data); actually convert the variable into the JSON equivalent or even a string at all? Doesn't it just display the JavaScript object itself in a structured and interactive format? Like, its still a JavaScript object , not a JSON string (property names must be in double quotes in JSON). I heard we use JSON.stringify to explicitly convert the object into a string for storage, transmission, or non-interactive display. Is that true? Thank you!
console.dir stands for display interactive. It is intended to display the variable as an interactive object so you can see the properties and prototype. For many objects, this won't make a difference with .log
It does make a difference with HTML elements. Like the two versions below.
```
some content
```
vs
```
HTMLParagraphElement
- id
- title
- etc
```
To convert to JSON and transmit, we can only use arrays, objects, string, number, boolean, and nulls. HTML elements have no equivalent in JSON. You could take an HTML string and save it as part of a JSON file, but not an HTML object.
The Odin Project recommended your video for our foundation Javascript course. Is it normal if I don't understand a single thing you're saying? :(
@ChocolateTaiyaki it depends. If you have been learning JS for a couple years and you don't understand then I might worry. If you are new to JS then you might be missing some of the context.
Many of these videos are things that I make for my own students. I point them to the appropriate videos when I know it is the right time.
When learning development tools, sometimes you just start by being aware that the tools exists. Then you will remember when you come across a situation that requires the tool.
please make more such useful content. respect from India
This maybe silly but how do you make a full page just the console it self.
when you open the tools, if you are on the elements panel there can be a bottom segment that has tabs including Console. However, Console has its own tab that can be opened. You can close the lower panel to just show the elements or the console.
Additionally, if you click on the 3 dot menu in the top bar there are options for "Dock side" which includes opening the console as a separate window.
@@SteveGriffith-Prof3ssorSt3v3 Thanks
very helpful like always
Good man
Thank you