Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
JavaScript Debugging with Chrome DevTools [Part 1]
Search
Cassian LUP
July 31, 2013
Programming
2
160
JavaScript Debugging with Chrome DevTools [Part 1]
A brief introduction in Chrome Developer Tools.
Cassian LUP
July 31, 2013
Tweet
Share
More Decks by Cassian LUP
See All by Cassian LUP
Warping Time with Async/Await
cassilup
5
91
Docker for WebDevs
cassilup
0
83
TypeScript: The Good Cop
cassilup
0
160
NodeConf London 2016 Summary
cassilup
0
28
Working with the DOM and Living to Tell
cassilup
0
47
How To Hack (Together) An Environment
cassilup
0
81
Appium • Mobile Automation Made Awesome (Part II)
cassilup
0
72
Appium • Mobile Automation Made Awesome (Part I)
cassilup
0
110
Introduction into PhoneGap
cassilup
0
68
Other Decks in Programming
See All in Programming
Ruby on cygwin 2025-02
fd0
0
140
時計仕掛けのCompose
mkeeda
1
280
CloudNativePGがCNCF Sandboxプロジェクトになったぞ! 〜CloudNativePGの仕組みの紹介〜
nnaka2992
0
220
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
270
ISUCON14公式反省会LT: 社内ISUCONの話
astj
PRO
0
190
Introduction to kotlinx.rpc
arawn
0
650
Java Webフレームワークの現状 / java web framework at burikaigi
kishida
9
2.2k
JavaScriptツール群「UnJS」を5分で一気に駆け巡る!
k1tikurisu
10
1.8k
AWSマネコンに複数のアカウントで入れるようになりました
yuhta28
2
160
自分ひとりから始められる生産性向上の取り組み #でぃーぷらすオオサカ
irof
8
2.7k
SpringBoot3.4の構造化ログ #kanjava
irof
2
970
AWS Lambda functions with C# 用の Dev Container Template を作ってみた件
mappie_kochi
0
240
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
51
7.4k
Producing Creativity
orderedlist
PRO
343
39k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
44
9.4k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
20
2.5k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
366
25k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
Transcript
None
0 ) C o m m o n - s
e n s e ! c o n c e p t s . !
there%is%[SIMPLY]% no%such%thing% as%a% bug$free$ app%
learning% is%a%% ››%process%‹‹% ((not$ %% an%event%
without% a%debugger% is%like% going%to%war.$
without% a%debugger% is%like% going%to%war.$ Blindfolded.$
1 ) C h r o m e D e
v T o o l s. ! B a s i c U s a g e . !
Getting there:! % ›%%CTRL%+%SHIFT%+%J%%%%(COMMAND%+%OPTION%+%J)% % ›%%Right%Click%+%Inspect%Element% % ›%%Hotdog%Menu%(%%%%%%)%›%Tools%›%Developer%Tools%
2) HTML ! Elements ! Hands-on. ! [ “ H
T M L ” , “ e l e m e n t s ” ] ! %
[ “ H T M L ” , “ e
l e m e n t s ” ] ! %
3) JS Console! Hands-on. ! [ “ J S ”
, “ c o n s o l e ” ] ! %
[ “ J S ” , “ c o n
s o l e ” ] ! %
4) JS Sources! Hands-on. ! [ “ J S ”
, “ s o u r c e s ” ] ! %
[ “ J S ” , “ s o u
r c e s ” ] ! %
! › Google: “[error keywords] js”! (Stack Overflow, forums etc.)!
› https://developers.google.com/chrome-developer-tools/! › http://discover-devtools.codeschool.com/! › http://jsfiddle.net/! ! [ “ E n d i n g ” , “ t h o u g h t s ” ] ! %
[ “ E n d i n g ” ,
“ t h o u g h t s ” ] ! %