My Typical Music Selection For Focused Development Time

Firefox Developer Tools – Topher Inspector – look at HTML/CSS behind a web page Responsive Display Mode Console – look for errors (security/resource loading issues) Different results depending on when you open – loading vs loaded Debugger – for JavaScript Style Editor – for changing CSS Performance – monitoring page load performance Network – Storage – Local browser items, page cache, cookies, etc. Chrome Developer Tools – Brian Shortcuts – keyboard commands to open dev tools (CTRL-OPT-I[Mac OS X]/CTRL-SHIFT-I[ChromeOS]) Docking – SHIFT-CMD-D(Mac OS X) / CTRL-SHIFT-D(Chrome OS) Elements (inspector) Styles – Filter allows for viewing specific CSS states (i.e. :hover) Add specific element styles Color Swatch – has a color picker, can save swatches Computed Styles View a visual representation of spacing See the CSS that…