Tags
All Posts
-
How to Build a Drop Down Menu with Modern CSS
You can build a drop down menu with advanced functionality with CSS alone, thanks to recent advancements to the language. No onMouseOut listeners in sight!
-
How to stop page scrolling when you have an open dialog element
A CSS one-liner to help with your <dialog> implementation.
-
Distraction Driven Development
You're now a distraction filter.
-
How I learned to code: the art of letting go
Inpsired by other articles, here is my journey to where I am today as an engineer, and beyond.
-
In praise of the switch statement
A tutorial on how to use an underused tool in Javascript - the switch statement.
-
Project stuck? Think about how you’re breaking it down & question everything
If you find yourself in the middle of a project that doesn’t seem to be moving forward - take a step back and question everything.
-
So how did the onboarding experiment go?
We tried the onboarding checklist that I had made previously - did it work?
-
Ideas for an Onboarding Checklist
Why I made an onboarding checklist for a new hire, and ideas of things to include on a list like this.
-
Why post mortems after an incident are fun and exciting.
-
If you think something is going south on a project, make noise about it early. You'll be glad you did.
-
How to mock fetch requests in React Testing Librarty tests
Creating a mock server with msw to make React Testing Librarty tests for your components.
-
There are a few crucial things that you can do to run really good meetings. I go over what has helped me run a lot of effective meetings over the years.
-
Adding the View Transitions API to my personal site
How I added smooth page transitions to my site using the View Transitions API.
-
A Lightweight Way to Read GraphQL Data
I share a lightweight function that will let you read a GraphQL endpoint without the need for heavy libraries. This is great for simpler use cases.
-
How to make a color changing favicon
Learn how to create a dynamic favicon with color-changing capabilities using JavaScript. This article goes line by line explaining how to do it. Additionally, discover how to update Safari's color scheme in real-time using the theme-color meta tag.
-
Using a Pros/Cons list to help navigate technical discussions
Discover the humble Pro's/Con's list, a tool that captures every pro and con in technical problem-solving discussions to avoid repeating the same objections and lead to healthier discussions.
-
How to use variable fonts from Google Fonts
Google Fonts makes a lot of great variable fonts available, but it's not terribly clear how to make use of those fonts. Here are some tips on how to take full advantage of their super powers.
-
A new website: now on Eleventy!
Announcing the new version of my personal website - this time around I built it in Eleventy.
-
Colorosetta: the VS Code Extension!
Announcing the VS Code Extension for my one-to-many color translation tool, ColoRosetta
-
Using CSS Custom Properties and Logical Properties Together
How to combine custom properties and logical properties for layout super powers.
-
Browser Dev Tools: Element Inspector Popover
Did you know? All three major browser engines offer an inspector popover for elements. Yeah, I didn't know.
-
The Link with rel=preload is a Seperate Thing
Note to self.
-
How to have Dark & Light Mode Images that also works with User Choice
When we added a 'dark mode' to PBS.org's appearance, we wanted to allow users to have a choice to turn it on. That introduces some complexities that you need to account for.
-
Don’t use Viewport Units for Font Size on their own
Be sure to pair viewport units with a relative unit when using them on font sizes, or you'll introduce an accessibility issue.
-
A little known Media Query: Aspect Ratio
Did you know? You can make a media query based on a viewports aspect ratio, not just it's width.
-
Meta thinking: Managing Decisions
Why it's important to think about what kinds of decisions you are faced with.
-
When capturing to-do's, be sure to include enough information that your future self isn't confused.
-
Say What the Impact is when Reporting Issues
When reporting an issue, make it clear what the impact is.
-
Firefighting 101: How to Manage Breakages
A playbook for tech managers in dealing with significant outages.
-
How to Deal With Large Pieces of Technical Debt
The smaller the individual pieces of work, the greater the chance that a large piece of technical debt will be addressed.
-
On improving your communication by making request clear and obvious, and not assuming the other person will figure it out.
-
Analytics events, HTML classes, and protecting against refactoring
A way to protect analytics events against refactors and unintentinal breakage - analyics classes in your HTML.
-
How We Removed jQuery from a large app
How we went about removing jQuery from a large application that had depended on it for many years.
-
What width and height attributes should you use with responsive images?
Best practice is to add `width` and `height` attributes to image elements in HTML to improve browser layout performance.
-
Django 3.1 gotcha: Referrer Policy has a new default, and it might break iframes and links
In Django 3.1 the project updated the default 'referrer-policy' to be 'same-origin', which might lead to unexpected results in your project.
-
A Javascript Component Pattern
A walk through the typical JavaScript pattern that we use at my work.
-
CSS min(), max() and clamp() Functions
A quick look at the relatively new, but well supported, min(), max() and clamp() functions and how you might use them.
-
Pointer Events and Inline Elements in Chrome
Something interesting I learned about using pointer-events and Chrome on inline elements.
-
Resolving a github repo and a new Create React App
A play in one act
-
How to POST *Data* with the Fetch API
How to go about using the Fetch API to POST data to an API.
-
I've launched a new tool to help check three colors at once, for when you have hyperlinks without underlines.
-
Advice on interviewing for Junior Developers
Some advice on how to stand out during an interview when your a Junior Developer - either right out of a bootcamp/school, or still early in your career.
-
How to Truncate Type at More Than One Line with Just CSS
Have a design where you want text to get cut off at 2 or 3 lines? You can do it with CSS alone.
-
Life Lessons Learned From Running a Marathon: How to do something really hard
What I learned from doing something really, really hard.
-
A (Brief) intro to Search Engine Structured Data
What is structured data, how does it help search engines understand your content, and how to add it to your site.
-
Javascript Fallback Values on Variables and Booleans - a hard lesson
A lesson I learned using fallback values on a JavaScript variable, but ran into trouble when it dealt with a boolean.
-
Alfred Tip: Quickly Access Common URLs
One of my simplest productivity hacks, but one of the most effective.
-
Making a Gatsby Site with Multiple Content Types
Making a site with different content types in Gatsby is not very straightforward — here is how I figured out how to do it, and while using a mix of Markdown or JavaScript page files.
-
How to Create and Use Fixtures in Cypress Tests
How to generate a fixture for use in a Cypress end to end test, and how to actually use it.
-
Fixing the 'Bad Interpreter' Error from AWS and Python 3.7
How to clear up the terminal message from AWS relating to Python 3.6 not being found.
-
Creating a Canonical Tag in a Django Template
A quick tip on adding a canonical tag within Django templates, and why.
-
Responsive spacing with viewport and ch units
How I used vw, vh and ch units to achieve responsive spacing in my new design.
-
Welcome to my New Design - 2019
My site gets a makeover for 2019. Here's all about it.
-
Django Templates: Block and If statements don’t work like you might expect
Django templates may not respect if statements around block usage the way you expect. I found that out the hard way.
-
7 of the best books I read last year - 3 fiction, 4 non-fiction.
-
Lifehack: 4 ways to help tame common email noise
A few handy tricks to cut down on the noise in your email inbox.
-
How to make better Pull Requests: Adding Steps to Test
Do your pull requests languish for days before someone finally gets around to looking at it? Is the feedback that you get unhelpful? Are you finding nasty bugs in your code only when someone looks at your PR's? I've been there. And I know a better way - follow along!
-
Troubleshooting Adding and Removing EventListeners: with Arguments, Debounced, and in a React Class
-
How to get rid of the "You have mail" message in your terminal
-
Why three typefaces rule the web, and what you can do about it
-
How to “preview” a click event tag in the Google Tag Manager console
-
Why SVG is so cool (or: what happens when you're late to the party on something)
-
How to apply classes to elements with CKEditor 4, in Drupal 7
-
How to use a more recent version of jQuery in Drupal (without jQuery Update)
-
My favorite 24Ways article so far: Your jQuery: Now With 67% Less Suck
-
Developing a Wordpress site locally, on more than one computer
