Chrome Developer Tools
Hadji Kouceyla
- Master en IA (USTHB-2011)
- Consultant / Formateur Web
- Intervenant, coach à plusieurs Events
-
Skills: HTML5/CSS3, PHP/Mysql,
JS/jQuery, Json/Ajax, Web Responsive,
Joomla, WordPress, Git
Web Developer?
Your favorite browser ?
How to debug ?
Who did not understand
my question?
you are not a
web programmer
What's chrome dev tools ?
Authoring & development workflow
- Drag-To-Right For Quicker Dock-Positioning
- Search, Replace, Navigate And Filter
- Live Editing Scripts & Styles
- Save AS
- Custom JavaScript Snippets
Editing styles & DOM
- DOM Elements Tree
- CSS Styles
- Box Model
- Properties
Managing application storage
- IndexedDB
- Web SQL
- Cookies
- Local and session storage
- Application Cache
Evaluating network performance
- Network panel overview
- Preserving the network log upon navigation
-
Adding and removing table columns
- Changing resource row sizes
- Timeline view, Sorting and filtering
- Saving and copying network information
- Network resource details
- HTTP headers, HTTP response
- Resource previews
- Cookies
- Resource network timing
Debugging JavaScript
- The Sources Panel
- Debugging With Breakpoints
- Pause on Next JavaScript Statement
- Breakpoints on JavaScript Event Listeners
Using the Console
- Basic operation
- Using the Console API
- Grouping output
- Selecting elements
- Measuring how long something takes
- Accessing recently selected elements and objects
Mobile emulation
- Emulating Touch Events
- Emulating Device Viewports
- Useragent Spoofing
- Network Bandwidth Throttling
- Geolocation Overrides
- Device Orientation Overrides
- CSS Media Type Emulation
- Frequently Asked Questions
NEED MORE ?
Of course Yes
ALSO
-
JavaScript Memory Profiling
- Profiling JavaScript performance
- Working with CSS Preprocessors
- Sample DevTools Extensions ()
- Remote Debugging on Android
REFERENCE
-
https://developers.google.com/chrome-developer-tools
-
User experience
THANK YOUUUUUUUU
- hadjikouceyla@gmail.com
-
/kouceyla.hadji
-
@kossa7
-
dz.linkedin.com/pub/kouceyla-hadji/34/b31/908/
-
http://be.net/kossa
-
kossahd
Chrom Dev Tools
By kouceyla hadji
Chrom Dev Tools
- 1,170