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

8.1 Mobile Debugging

We explore how we can view the browser developer tools for a webpage we are viewing on a mobile phone. We also use an iPhone’s Safari browser and view the dev tools on the connected laptop’s Safari browser. Next we use an Android device’s Chrome browser and view the dev tools on the connected laptop’s Chrome browser.

Prerequisites
  1. Install Chrome and Safari browsers
  2. iPhone device with Safari browser or Android device with Chrome browser connected to your desktop/laptop
  3. Install XCode for iPhone
  4. Install Android SDK for Android devices
Resources
  1. Debugging web content on iOS – install XCode
  2. Remote debugging on Android – install Android SDK

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