Dev Tips

Newsletter Image

Messages

4/20/2023
14 : 44

Visualise JS bundles with DevTools Lighthouse and bonus video

DevTools Lighthouse has a powerful Treemap visualiser. Also check out my new video on generating YouTube video summaries! Visualise JS bundles with Lighthouse, and a bonus AI video Hey friends! Got a
4/19/2023
6 : 14

An in-depth video 📺 on streaming data with JS, and tricks with CSS selectors

I made a new video on streaming data with the Fetch API Streaming with the Fetch API, and tricks with CSS Selectors Hey friends! Got two exciting videos for you today: How to consume streaming data
4/7/2023
16 : 34

Two new video tips for you

Some handy tips to use with DevTools and VS Code Two fresh video tips Hey everyone! Here are two new tips for you - you can watch the videos or read the text posts. Learn about CSS selector specificity
3/31/2023
19 : 44

Dev Tips: Two new tips with DevTools and HTML

Some handy tips to use with DevTools and HTML Two fresh video tips Hey everyone! Here are two new tips for you - you can watch the videos or read the text posts. Help users to download files with the
3/24/2023
17 : 54

Two new tips: DevTools and VS Code

Some handy tips to use in with DevTools and VS Code Two fresh video tips Hey everyone! Here are two new tips for you - you can watch the videos or read the text posts. VS Code: Automatically convert
3/17/2023
20 : 34

3 new tips with JavaScript and DevTools

Some handy tips to use in JavaScript, and DevTools Three fresh video tips Hey friend, I've got three new tips for you to check out. Each tip is a one minute video. In the past, a lot of you found
3/10/2023
18 : 24

3 new tips for you

New tips that are useful for web developers Three fresh video tips Hey friend, I've got three tips for you to check out. Each tip is a one minute video - hope you enjoy them! A simpler JavaScript
3/2/2023
17 : 34

New DevTools tips for you

Four new video tips for you! Four fresh video tips Hey friend, I've got four tips for you to check out. Each tip is one minute video - hope you enjoy this format. The best ways to take screenshots
2/20/2023
17 : 4

Here's an update on the Dev Tips mailing list

You can expect new tips, in video format! An update on the Dev Tips newsletter Hey friend, it's been a while since I've sent an email out! Things have been busy with family, work and general
11/12/2021
15 : 4

Dev Tips: DevTools: Copy CSS as JavaScript 💡

Dev Tips DevTools: Copy CSS as JavaScript Introduction You can now copy CSS styles as JavaScript, so the styles in your clipboard are compatible with CSS-in-JavaScript libraries. How to copy CSS as
11/5/2021
18 : 44

Dev Tips: DevTools: Record and playback your user journeys 🎥

Dev Tips DevTools: Record and playback your user journeys 📽 Introduction You can use the new Recorder Panel to record user flows (aka user journeys or user interactions) and play them back. The
10/29/2021
13 : 34

Dev Tips: DevTools: Visualise your JavaScript bundles 📊

Dev Tips DevTools: Visualise your JavaScript bundles 📊 Introduction The Lighthouse Treemap shows a visualisation of your JavaScript bundles. It's compatible with sourcemaps and is great for
10/18/2021
16 : 14

DevTips: DevTools: Easily change CSS units and values 🔢

Dev Tips DevTools: Easily change CSS units and values 🔢 Hey all, hope you have a great week! Introduction Changing CSS values/units ( 10px / 1rem / 20vh ) can be cumbersome. Canary DevTools has some
7/30/2021
17 : 34

Dev Tips: DevTools: Better accessibility inspection with the Source Order Viewer

Dev Tips DevTools: Better accessibility inspection with the Source Order Viewer 🔎 View this online: umaar.com/dev-tips/245-source-order-viewer / tweet Introduction The Source Order Viewer shows you the
7/23/2021
16 : 24

DevTips: DevTools: Easily control typography with the CSS Font Editor 🖊

Dev Tips DevTools: Easily control typography with the CSS Font Editor 🖊 Introduction The Font Editor within the Styles Pane helps you to quickly change typography on a web page - using a visual tool
7/16/2021
16 : 24

Dev Tips: DevTools: Using the CSS Grid & Flexbox Editor

Dev Tips DevTools: Better Debugging with the CSS Grid & Flexbox Editor ✨ Hey friends. I took a break from emailing for a while, but I'm grateful to have you all here, part of this amazing Dev
12/16/2020
11 : 24

Dev Tips: Only download JavaScript when it is appropriate

Learn a few techniques for selectively downloading web page resources Dev Tips Hey everyone! I have a different sort of tip for you today, hope it's useful. JavaScript: Conditional JavaScript, only
12/4/2020
4 : 4

Dev Tips: DevTools: Record tests with the puppeteer recorder

A test generator for puppeteer built into Canary DevTools Dev Tips DevTools: Record tests with the puppeteer recorder 🎥️ Introduction The Puppeteer Recorder feature in Chrome DevTools can monitor your
11/18/2020
13 : 34

Dev Tips: DevTools: Refactor your styles with CSS Overview

View different metrics on your styles and improve your overall CSS architecture Dev Tips DevTools: Refactor your stylesheets with CSS Overview Introduction The CSS Overview Panel provides interesting
11/13/2020
6 : 47

Dev Tips: DevTools: Create your own keyboard shortcuts  ⌨️

The Shortcut Editor lets you assign your own preferred keyboard shortcuts to common workflows. Dev Tips DevTools: Create your own keyboard shortcuts ⌨️ Introduction The DevTools Shortcut Editor lets