Browser Developer Tools

Get to know various Browser Developer Tools for popular browsers & use them to debug & speed up your development process
3.7 (5 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
420 students enrolled
$80
Take This Course
  • Lectures 29
  • Contents Video: 3 hours
    Other: 23 mins
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 1/2015 English

Course Description

Learn how you can make use of browser development tools to make web pages better.

This course tells you everything that you as a web-developer or web-designer needs to know when it comes to debugging your JavaScript or style-sheets using developer tools for browsers

Learn how you can dynamically change HTML and apply style-sheets to your web-pages and then save the same back to your source files all directly from the browser.

You will also learn how you can read minified scripts

This course also covers various other important topics like managing memory, optimizing page load time of web pages.

All lectures are recorded in HD quality video which ensures that you will not miss a thing.

So lets start learning now..

What are the requirements?

  • HTML
  • CSS
  • JavaScript
  • Browser knowledge

What am I going to get from this course?

  • Know how to get most of the browser developer tools
  • Learn how to debug your code i.e javascript and css using debugger tools provieded by various browsers
  • Learn how to read minified scripts using different browsers
  • Learn how you can play with Document Object Model using tools provided by browsers
  • Learn how you can see what's affecting your page load time
  • Manage memory issues
  • Save your changes directly from browser to your code files

What is the target audience?

  • Web Developers
  • Web Designers
  • Aspiring Web Developers
  • Aspiring Web Designers
  • Testers

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Introduction to Browser Developer Tools
Introduction
Preview
01:34
Section 2: Chrome Developer Tools
06:18

Modifying DOM-(Document Object Model) on the fly

09:44

Learn how to use the network panel and analyze

Resource Info - size, type, etc

Server Response Details

Timeline of network details

Time of network requests

04:50

Learn how to

Modify application source files

Track file versions

Export changes

04:37

In this lecture we will cover

Rendering Performance

CPU Profiling

10:13

Debug live code with breakpoints

Reading minified code

Working with Local Storage

09:11

Working with console

Examining Exceptions

Element Selector Shortcuts

04:58

Finding Memory Leaks

02:48

Emulate Browsers, screen sizes

Section 3: Firebug for Mozilla Firefox
02:17

What is Firebug

How to install Firebug

07:15

Modifying DOM-(Document Object Model) on the fly

04:06

Learn how to use the network panel and analyze

Resource Info - size, type, etc

Server Response Details

Timeline of network details

Time of network requests

09:49

Working with console

Examining Exceptions

Element Selector Shortcuts

07:59

Debugging your code

07:21

Working with StyleSheets

02:38

Managing Cookies

Section 4: Internet Explorer Developer Tools - F12 Tools
08:40

Modifying DOM-(Document Object Model) on the fly

07:22

Working with console

07:50

Debugging your javascript

08:10

Learn how to use the network panel and analyze

Resource Info - size, type, etc

Server Response Details

Timeline of network details

Time of network requests

05:46

Analyze UI Performance

06:46

Profiling your script

10:29

Diagnosing memory problems

03:42

Emulate Browsers, screen sizes

Section 5: Popular JavaScript Framework Tools
React Developer Tool for Chrome
02:53
Ember JS - Ember Inspector
02:23
Angular JS - Batarang
02:39
Angular JS - ng-inspector
02:31
Section 6: Conclusion & Code Download
Conclusion & Code Download
Preview
23 pages

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

SkillBakery Studio, Start Learning Today...

SkillBakery is one of the fastest growing online education company.

Our vision is to provide high quality education which is affordable and accessible to everyone

We believe that every one has their own way of learning and grasping things and that's why we provide self-paced HD quality contents,so you can learn what you love at your convinience

We currently offer courses in web development and will soon be publishing new courses in other categories as well

We are committed to bring courses on new topics and we try to release one new course every month

So keep visiting us, you will surely find something for yourself here.

Ready to start learning?
Take This Course