Tags: tips

Debugging Tips and Tricks [↗]

Writing code is only one small piece of being a developer. In order to be efficient and capable at our jobs, we must also excel at debugging. When I dedicate some time to learning new debugging skills, I often find I can move much quicker, and add more value to the teams I work on. I have a few tips and tricks I rely on pretty heavily and found that I give the same advice again and again during workshops, so here’s a compilation of some of them, as well as some from the community.

Lots of useful debugging advice, well worth a read.

Using DevTools to Tweak Designs in the Browser [↗]

Let’s look at some ways we can use the browsers DevTools to do design work. There are a few somewhat hidden tricks you mind find handy!

A good article with some handy tips. I’ve only recently discovered Firefox’s Screenshot Node feature, it’s covered in this article and is very nifty! I hope it comes to Chrome soon.

Scrape Images with wget [↗]

A quick tip for using wget to download all images at a given URL.

Writing Well [↗]

A couple of tips on how to write well. I think I’ve probably said before, but writing doesn’t come naturally to me, so I’ll take all the tips that come my way.

Disable Window Shadows on macOS Screenshots [↗]

A quick tip for disabling window shadows when taking screenshots in macOS. Terminals ready:

defaults write com.apple.screencapture disable-shadow -bool true

Followed by:

killall SystemUIServer


WordPress Security: This wp-config.php Protects Your Website [↗]

There are many ways to protect your WordPress-based website from getting hacked. The optimization of the wp-config.php can be considered to be an important part of a proper security strategy. Of course, the site won’t turn into the Bank of England, but you’ve made it a little harder for the hackers.

Some good tips for hardening your WordPress installation.

Style List Markers in CSS [↗]

It’s possible to do this styling now, though, thanks to CSS counters. The trick is to remove the list-style, then apply the markers through pseudo-element counters.

Nice tip for styling HTML list markers with CSS. See demo.

Native Browser Copy To Clipboard [↗]

It wasn’t that long ago where you couldn’t programmatically copy text to the clipboard from the web without using Flash. But it’s getting pretty well supported these days.

Interesting, I didn’t realise that native support for this had progressed this far. Nice.

Copy your ssh public key to a server from a machine that doesn’t have ssh-copy-id (E.g. MacOS)

ssh-copy-id is ace, but it when it doesn’t exist, the following will come handy:

cat ~/.ssh/id_rsa.pub | ssh $USER@example.com "cat >> ~/.ssh/authorized_keys"

Note: just change the “example.com” address to that of your server.

Learn CSS Flexbox in 3 Minutes [↗]

In this post you’ll learn the most important concepts of the flexbox layout in CSS, which will make your life easier if you find yourself struggling with CSS layouts from time to time.

We’ll only focus on core principles, while leaving out stuff you shouldn’t care about until you’ve understood the basics.

A super simple introduction to using flexbox.

◀ Older