Google Chrome Developer Tools Crash Course – Download



In this video we will be taking an intermediate look at the Google Developer Tools. You will learn how to do things such as…

Inspect & Examine HTML/CSS
Edit HTML/CSS
Enable/Disabled styles
Move & Delete Elements
Console Logs & Other Commands
Special Console Symbols
Examine Network & Resources
Use Snippets
Workspaces & Permanent Changes
View & Remove Browser Storage
Perform Audits

Add MailTag to your browser (it’s free) ➜ https://goo.gl/qZf5Pj
Thank you MailTag for sponsoring this video

MIZUXE THEME FILES:
http://www.traversymedia.com/downloads/mizuxe_bs4_theme.zip

GIST WITH SANDBOX CODE:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css">
<title>Devtools Test</title>
</head>
<body>
<h1>Hello World</h1>
<button>Button</button>
</body>
<script>
// console.log('Hello');
// //console.log(myvar);
// console.error('An error');
// console.warn('A warning');
// console.dir(document);
// console.table([{name:'John', email:'test@test.com', age:33}]);
// console.clear();
// console.group('Say Hello');
// console.log('Hello Brad');
// console.log('Hello John');
// console.log('Hello Sally');
// console.groupEnd('Say Hello');
// console.time('Run Loop');
// for (var i = 0; i < 20000; i++) {
// console.log(i);
// };
// console.timeEnd('Run Loop');
// function greaterThan(a,b) {
// console.assert(a > b, {"message":"a is not greater than b","a":a,"b":b});
// }
// greaterThan(5,6);
// document.querySelector('button').addEventListener('click', loadUsers);
// // Load Github Users
// function loadUsers(){
// var xhr = new XMLHttpRequest();
// xhr.open('GET', 'https://api.github.com/users&#39;, true);
// xhr.onload = function(){
// if(this.status == 200){
// var users = JSON.parse(this.responseText);
// var output = '';
// for(var i in users){
// output +=
// '<div class="user">' +
// '<img src="'+users[i].avatar_url+'" width="70" height="70">' +
// '<ul>' +
// '<li>ID: '+users[i].id+'</li>' +
// '<li>Login: '+users[i].login+'</li>' +
// '</ul>' +
// '</div>';
// }
// document.getElementById('users').innerHTML = output;
// }
// }
// xhr.send();
// }
// Set localstorage – will stay until delete/clear
localStorage.setItem('name','John');
// Set sessionstorage – will stay until browser close
sessionStorage.setItem('user', 'Will');
// Set cookie
document.cookie = "username=John Doe";
</script>
</html>
view raw
dtcrashcourse.html
hosted with ❤ by GitHub

BECOME A PATRON: Show support & get perks!
http://www.patreon.com/traversymedia

ONE TIME DONATIONS:
http://www.paypal.me/traversymedia

COURSES & MORE INFO:
http://www.traversymedia.com

FOLLOW TRAVERSY MEDIA:
http://www.facebook.com/traversymedia

http://www.instagram.com/traversymedia

Source

Do you love us?, Please donate to us ,thank you. BTC 38WPVc3xMYmoMp1GcnpDXd1fEzbfgujsCB Etherum 0x6c11844FD079b2490CDd44039e1C2f0940d098dc

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.