Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m

8.4 Chrome DevTools - Inspect + Debug

Chrome Develop Tools have powerful features that help us inspect, analyse, sort snippets, debug or even code right in the browser and save that version for our project. We use the nightly build of Chrome, Canary, to explore some of the new features. Resources
  1. Download Chrome
  2. Download Canary - nightly build for Chrome with the newest features
  3. Chrome DevTools docs
  4. Tutsplus course - Cross Platform browser testing
  5. Shortcuts to open the dev tools
  6. Code School - Explore and Master Chrome Dev Tools
  7. Chrome Network panel Nettuts tutorial

1.Introduction
1 lesson, 04:44

Free Lesson
1.1
Welcome
04:44

2.Boilerplates and Scaffolding
4 lessons, 1:00:43

Free Lesson
2.1
HTML5 Boilerplate
10:13

2.2
Twitter Bootstrap
09:29

2.3
Foundation
19:41

2.4
Yeoman
21:20

3.Markup Abstraction
2 lessons, 28:07

3.1
Emmet
15:48

3.2
Markdown
12:19

4.CSS Abstraction
3 lessons, 47:51

4.1
Sass + Compass
19:37

4.2
LESS
14:47

4.3
Stylus + Nib
13:27

5.HTML and Javascript Abstraction
2 lessons, 20:38

5.1
Jade
15:16

5.2
Haml
05:22

6.Javascript Preprocessing
1 lesson, 13:23

6.1
Coffeescript
13:23

7.Templating
2 lessons, 28:41

7.1
Mustache
15:17

7.2
Handlebars
13:24

8.Workflow
4 lessons, 44:14

8.1
Mobile Debugging
07:20

8.2
Local Web Servers
10:19

8.3
Autosave
08:38

8.4
Chrome DevTools - Inspect + Debug
17:57

9.Conclusion
1 lesson, 01:25

9.1
Conclusion
01:25