forked from dkeiss/mac-hotkeys
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathcard2.html
More file actions
98 lines (85 loc) · 7.52 KB
/
Copy pathcard2.html
File metadata and controls
98 lines (85 loc) · 7.52 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<html lang="de"><head><meta charset="utf-8"><link rel="stylesheet" href="style.css"></head>
<body><div class="card">
<div class="hd">
<h1>Debugging · Web · iOS · Android</h1>
<div class="sub">Cheat-Sheet — DevTools, Simulator & Emulator</div>
<div class="legend">
<span><b>⌘</b> Command</span><span><b>⌥</b> Option/Alt</span><span><b>⌃</b> Control</span>
<span><b>⇧</b> Shift</span><span><b>⏎</b> Return</span><span><b>⎋</b> Esc</span><span><b>␣</b> Space</span>
</div>
</div>
<div class="cols">
<!-- ============ COLUMN A : WEB ============ -->
<div class="col">
<div class="sec">
<h2 style="background:#e8a400">Chrome DevTools</h2>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>I</kbd></span><span class="d">DevTools öffnen / schließen</span></div>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>J</kbd></span><span class="d">Direkt zur Konsole</span></div>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>C</kbd></span><span class="d">Element-Picker (inspizieren)</span></div>
<div class="r"><span class="keys"><kbd>⇧</kbd><kbd>⌘</kbd><kbd>M</kbd></span><span class="d">Geräte- / Responsive-Leiste</span></div>
<div class="r"><span class="keys"><kbd>⇧</kbd><kbd>⌘</kbd><kbd>P</kbd></span><span class="d">Befehls-Menü (alles finden)</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>R</kbd></span><span class="d">Seite neu laden</span></div>
<div class="r"><span class="keys"><kbd>⇧</kbd><kbd>⌘</kbd><kbd>R</kbd></span><span class="d">Hart neu laden (Cache leeren)</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>F</kbd></span><span class="d">Im Panel suchen</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>P</kbd></span><span class="d">Datei öffnen (Sources)</span></div>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>F</kbd></span><span class="d">In allen Dateien suchen</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>+</kbd><span class="sep">/</span><kbd>-</kbd><span class="sep">/</span><kbd>0</kbd></span><span class="d">Zoom rein / raus / Reset</span></div>
<div class="r"><span class="keys"><kbd>F8</kbd></span><span class="d">Pause / Fortsetzen (Debugger)</span></div>
<div class="r"><span class="keys"><kbd>F10</kbd></span><span class="d">Schritt über</span></div>
<div class="r"><span class="keys"><kbd>F11</kbd><span class="sep">/</span><kbd>⇧</kbd><kbd>F11</kbd></span><span class="d">Schritt rein / raus</span></div>
<div class="note">Netzwerk: DevTools ▸ <b>Network</b> öffnen, dann <kbd>⌘</kbd><kbd>R</kbd> – Aufzeichnung läuft automatisch. „Disable cache" anhaken.</div>
</div>
<div class="sec">
<h2 style="background:#0a84ff">Safari Web Inspector</h2>
<div class="note" style="border-color:#0a84ff">Erst aktivieren: Safari ▸ Einstellungen ▸ <b>Erweitert</b> ▸ „Funktionen für Webentwickler".</div>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>I</kbd></span><span class="d">Web Inspector öffnen</span></div>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>C</kbd></span><span class="d">Konsole</span></div>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>E</kbd></span><span class="d">Caches leeren</span></div>
<div class="r"><span class="keys"><kbd>⌥</kbd><kbd>⌘</kbd><kbd>R</kbd></span><span class="d">Neu laden vom Ursprung</span></div>
<div class="r"><span class="keys"><span class="hint">Menü</span></span><span class="d">Responsive Design Mode: <b>kein</b> Standard-Kürzel (Entwickeln-Menü)</span></div>
</div>
</div>
<!-- ============ COLUMN B : MOBILE ============ -->
<div class="col">
<div class="sec">
<h2 style="background:#1d1d1f">iOS Simulator</h2>
<div class="r"><span class="keys"><kbd>⇧</kbd><kbd>⌘</kbd><kbd>H</kbd></span><span class="d">Home <span class="hint">(2× = App-Switcher)</span></span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>←</kbd><span class="sep">/</span><kbd>→</kbd></span><span class="d">Gerät drehen</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>S</kbd></span><span class="d">Screenshot sichern</span></div>
<div class="r"><span class="keys"><kbd>⌃</kbd><kbd>⌘</kbd><kbd>C</kbd></span><span class="d">Screenshot in Zwischenablage</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>K</kbd></span><span class="d">Software-Tastatur ein / aus</span></div>
<div class="r"><span class="keys"><kbd>⇧</kbd><kbd>⌘</kbd><kbd>A</kbd></span><span class="d">Hell / Dunkel umschalten</span></div>
<div class="r"><span class="keys"><kbd>⌃</kbd><kbd>⌘</kbd><kbd>Z</kbd></span><span class="d">Schütteln (Shake)</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>1</kbd><span class="sep">/</span><kbd>2</kbd><span class="sep">/</span><kbd>3</kbd></span><span class="d">Größe: physisch / Point / Pixel</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>L</kbd></span><span class="d">Sperren</span></div>
</div>
<div class="sec">
<h2 style="background:#30b0c0">iOS – Web / WKWebView debuggen</h2>
<div class="tip"><b>1.</b> iPhone: Einstellungen ▸ Apps ▸ Safari ▸ Erweitert ▸ <b>Web Inspector</b> AN<br>
<b>2.</b> Per USB verbinden<br>
<b>3.</b> Mac-Safari ▸ <b>Entwickeln</b> ▸ [Gerät/Simulator] ▸ Seite wählen</div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>D</kbd></span><span class="d">React-Native Dev-Menü (iOS)</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>R</kbd></span><span class="d">React-Native neu laden</span></div>
</div>
<div class="sec">
<h2 style="background:#2aa84a">Android Emulator</h2>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>/</kbd></span><span class="d">Shortcut-Hilfe im Emulator</span></div>
<div class="r"><span class="keys"><kbd>⎋</kbd></span><span class="d">Zurück (Back)</span></div>
<div class="r"><span class="keys"><span class="hint">Seitenleiste</span></span><span class="d">Home · Recents · Drehen · Lautstärke · Screenshot</span></div>
<div class="r"><span class="keys"><kbd>⌘</kbd><kbd>M</kbd></span><span class="d">React-Native Dev-Menü (Android)</span></div>
<div class="r"><span class="keys"><kbd>R</kbd><kbd>R</kbd></span><span class="d">React-Native neu laden (2× R)</span></div>
</div>
<div class="sec">
<h2 style="background:#1f7a3a">Android – ADB & chrome://inspect</h2>
<div class="r"><span class="keys"><code>chrome://inspect</code></span><span class="d">WebView / Chrome am Gerät</span></div>
<div class="r"><span class="keys"><code>adb devices</code></span><span class="d">Geräte auflisten</span></div>
<div class="r"><span class="keys"><code>adb logcat</code></span><span class="d">Live-Logs</span></div>
<div class="r"><span class="keys"><code>adb install x.apk</code></span><span class="d">App installieren</span></div>
<div class="r"><span class="keys"><code>adb reverse</code></span><span class="d"><code>tcp:8081 tcp:8081</code> Metro-Port</span></div>
<div class="r"><span class="keys"><code>adb shell input</code></span><span class="d"><code>keyevent KEYCODE_BACK</code> u. a.</span></div>
</div>
</div>
</div>
<div class="ft">Picker/Inspector zuerst, dann Konsole & Network · 4×6″</div>
</div></body></html>