What is VS Code doing? π
I have been a VS Code user for many years now. It was a soft landing from Atom (RIP), and there haven't been any significant features from other edito [...]
seanmcp.com
Posts
Defaults 2026 π
Mail Client Gmail app and Zoho app Mail Server Gmail for personal email Zoho for professional email: I've tried other providers for @seanmcp.com but [...]
AI use case: Asking questions of large files π
Khan Academy uses GraphQL to handle all request to query and mutate data. Each service in the system contributes to the GraphQL schema, and everything [...]
Install curl with apt (and not snap) π
After switching my desktop to Linux from Windows[1], I ran into an issue installing Node. The official directions recommend using nvm, but the nvm ins [...]
Four perspectives on AI π
Maxi Ferreira writes in Fear and Curiosity and AI about the two stages of AI adoption among developers: A Stage 1 reaction looks something like this: [...]
Axe DevTools doesn't flag multiple h1 elements on a page π
The axe DevTools extension is valuable for testing the quality of your work. I use it multiple times per day when working on frontend tasks. So I was [...]
Writing code was never the bottleneck in software engineering π
Writing Code Was Never the Bottleneck by Pedro Tavares makes an important observation about using LLMs when writing software. The problem as stated by [...]
Colocate functionally-related code π
I read Colocation by Kent C. Dodds back in 2019 before I had an opinion on the topic. Six years later, I've come to a similar conclusion. Generally sp [...]
My on-again-off-again relationship with AI assistants π
For the past few years, I have been paying on and off for ChatGPT and Claude. I will read an interesting story about how someone transformed their wor [...]
Zed still isn't ready π
VS Code started acting up after a recent update, so I took the opportunity to try Zed again. It has improved since my last attempt and was a perfectly [...]
Deleting my GPTs π
Today I deleted all of my public and private GPTs. I thought I would feel sad: they were the feature that convinced me to start paying for OpenAI last [...]
Pittsburgh TechFest 2024 π
Yesterday I went to Pittsburgh TechFest 2024 at the Commonwealth Charter Academy building on the Waterfront. The venue was nice, the food was good, an [...]
Bypass "Error: There are no prompts" in promptfoo π
While evaluating different language models with promptfoo, I started running into the following error message: /Users/seanmcp/project-dir/node_modules [...]
Use state callbacks in React π
When you want to update state in React, you have two options: pass the next value, or pass a callback function that returns the next value. const [sta [...]
VIVO sit/stand desk π
In 2021 I purchased a 43" VIVO sit/stand desk from Amazon. It has served me well for the last few years, but I have encountered a few issues and solut [...]
Simplify event delegation with the Element.closest method π
Let's say you have a list of buttons and want to perform an action when one is selected. A solution is to add an event listener to each button with a [...]
Align content in Markdown tables π
You can set the align attribute on a table column in Markdown by using a colon in the header row separator. A typical table looks like this: | A | B [...]
CSS nesting is (almost) ready π
I've been hearing a lot about CSS nesting, but I figured that it was still years away from being ready for use even on a site like this. But a quick c [...]
Looking over the fence at Eleventy π
First of all: I'm happy with Astro. It's an exciting project that provides the tools necessary to build websites in the way I want to build them. The [...]
Getting started with Eleventy π
Eleventy has "Get Started" documentation that shows you how to get from a single markdown file to a built site. That is a nice "proof of idea", but I [...]
ChatGPT 4o isn't a good researcher yet π
I asked ChatGPT 4o for general recommendations for software release frequency, and it spouted out some information that seemed generally plausible. I [...]
Astro and release velocity π
This website is built with Astro, and overall I've been happy with my choice. The framework model makes sense to me, and I really enjoy using their te [...]
Render and effect call order in React π
Setup: Let's say I have a React tree like this: function Parent() { console.log("Parent render"); useEffect(() => { console.log("Parent effect [...]
Manage your photo archive π
A coworker at Khan Academy shared some advice (apparently secondhand from the New York Times) for managing your ever-growing photo archive: Every day [...]
Measuring and cutting π
I learned βmeasure twice, cut onceβ while working with my dad. He probably learned it from his dad and him from his dad. Itβs good advice, but in an i [...]
Create a custom search for a static site π
There are out-of-the-box solutions for searching on a static site. I previously used Pagefind for this site which remains a great option. But if you w [...]
Fix missing Astro files on GitHub pages π
I'm in the middle of a long project to migrate my projects from Netlify to GitHub pages. I was working on the GitHub actions for an Astro project and [...]
Create a useIsOnline React hook π
There are two browser features that enable you to detect an internet connection with JavaScript: The Navigator interface's onLine property for the cur [...]
Fix static file endpoints after Astro v4 upgrade π
Yesterday I upgraded to Astro v4 without any issues, but this morning I noticed that my RSS feed was broken. I have two static file endpoints that gen [...]
Why Microsoft Edge? π
I like trying out new browsers and try to avoid being tethered to one for too long. But ever since its switch to Chromium, I find myself coming back t [...]
Switching from Ubuntu to Linux Mint π
Ubuntu was running slow on my old personal laptop. Previously I had turned to Lubuntu, but I read online that Linux Mint has slighly better performanc [...]
Running Ollama without a GPU π
tl;dr You can run Ollama on an older device, but the response will be slow and/or low quality. I have successfully run Ollama with a new Macbook M2 an [...]
Use Ollama with the official Python library π
Ollama is a great way to get started with AI by using open-source and publically available large-language models locally on your computer. I wrote pre [...]
Get started prompt engineering with local LLMs π
Ollama is an application for running large-language models locally on your computer. It gives you access to open-source LLMs that you can prompt direc [...]
Python Reference π
Command-line arguments Permalink to βCommand-line argumentsβ # Use argparse to configure command-line arguments: import argparse VERSION = "1.0.0" p [...]
Did OpenAI's Web Browser GPT leak its prompt? π
I'm not an expert in LLMs or GPTs, but something about the interaction above feels wrong. When prompted with a simple getting started question, OpenAI [...]
Migrating from Google Domains to Porkbun was... π
Painless. They charged a fee of around $11.00 US to transfer the domain and then handled the rest seamlessly. I was hesitant to make the switch off of [...]
Normalizing data is a good idea π
On this site I have a few different types of content: articles, notes, gardens, and now art. There are subtle differences in the data structure for ea [...]
How I'm using AI in November 2023 π
AI products/services that I used regularly (multiple times per week): GitHub CopilotΒ β: Copilot continues to be a valuable resource when coding. Chat [...]
Sli.dev review π
I used sli.dev to create my slides for my recent talk at Pittsburgh TechFest 2023. I've previously used Google Slides--which is a great option--but I' [...]
Is it better to have one large file or multiple small files with GPTs? π
tl;dr: Using a single file seems to reduce the likelihood of a knowledge-base loading and improve response times overall. Introduction: Custom GPTs al [...]
What is the file limit for GTPs? π
As of 11/15/2023, the limit is 10 files. Although you wouldn't know it if you tried to upload more. The UI lets you upload more than 10 files, but you [...]
How I'm using AI in October 2023 π
This feels like the breakthrough month. I moved to a new project at Khan Academy working on AI, and I found myself reaching for AI-powered tools more [...]
GPTs read text files better than markdown π
tl;dr: Use text files instead of markdown with OpenAIβs custom GPTs I conducted an experiment to see if the file type of uploaded content had an impac [...]
Thoughts on Web Speech API π
Last week I spent time working with the Web Speech API for a hackathon at Khan Academy. Here are some quick lessons learned from my experience: Web Sp [...]
Declarative code and cognitive load π
If you had asked me ten years ago about my ability to handle cognitive load, I would have said that I was above average. Today? I would say that I am [...]
How I'm using AI in August & September 2023 π
Sorry for two months in one post, but I haven't been using AI much recently. I think the trend so far is that AI-powered products that are directly re [...]
See what object properties are accessed in JavaScript π
At work I was mocking an object to be passed to a React context provider. I knew the type for the object, but I wanted to learn what properties were b [...]
Remove duplicates from an array in JavaScript π
Removing duplicates, sometimes called de-duplicating or de-duping, is a common task in programming. There are many ways for removing duplicates from a [...]
How I'm using AI in July 2023 π
AI products/services that I used regularly (multiple times per week): GitHub Copilot β: Copilot continues to be a valuable resource when coding. I was [...]
Timeboxing types π
Two things that I currently believe: There is a lot of value in statically typed code Writing types is a potential time sink with diminishing returns [...]
CSS columns are neat π
I was looking for a solution to dynamically create two columns in a UI when I came across the columns CSS property. With a single property, you can te [...]
Quality requires iteration π
You're not going to get it right the first time. You might not even get it right the second time. But if you iterate enough, you're going to find a go [...]
A workable emoji picker on Ubuntu π
I like to use emojis and have missed them since moving to Linux/Ubuntu. They render fine, but there isnβt a good way to input emojis into a field like [...]
Writing Prompts for Programmers π
The most effective way I know to improve your writing is to do freewriting exercises regularly. -- Peter Elbow Prompts Permalink to βPromptsβ # What i [...]
Reviewing "Go By Example" π
I started Go By Example in April with the goal of learning the language for work. Khan Academy (and my old company Niche) use Go for their back-end se [...]
How I'm Using AI in June 2023 π
AI products/services that I used regularly (multiple times per week): GitHub Copilot β: Copilot continues to be a valuable resource when coding. AI Pr [...]
A quick comparison of JavaScript and Go executables π
Background: Bun and Deno, JavaScript runtimes, provide a native way to convert your JavaScript code into a single executable file. Bun: bun build --co [...]
Compairing Objects, Maps, and WeakMaps for lookup tables in JavaScript π
I use lookup tables/dictionaries/hashmaps/maps a lot when Iβm coding. Thatβs a data structure that stores key and value pairs that are easily retrieva [...]
Web-browser Accessibility Tools π
Khan Academy celebrates Global Accessibility Awareness Day with a whole week of activities. Yesterday on GAAD proper, we were encouraged to set aside [...]
Linux Update in 2023 π
Last year I experimented with using a Raspberry Pi as a home development environment. The device was ultimately too low powered, but my interest was p [...]
How I'm using AI in May 2023 π
As of May 2023, I use the following AI-powered products on at least a weekly basis: GitHub Copilot β Writing code: typically this is autocomplete to t [...]
Declaring variables in Go π
There are three ways to declare variables in Go: var, :=, and const. The var keyword is the standard method for declaring a variable. It can be used a [...]
What is nullish in JavaScript? π
Nullish-coalescing operator (?? or double question mark) is a handy tool that returns the right-hand operand when the left-hand is nullish. In JavaScr [...]
QA questions for everyone to ask π
My former colleague Michael Scotto recently wrote about quality assurance and asking questions: Many use phrases like βQA Engineerβ and βTesterβ inter [...]
Learning Go π
Niche and Khan Academy use Go for their backend services, so I've been "reading" Go since 2019. But as I progress in my career, I'm realizing that it [...]
Set up Decap CMS π
Decap CMS is the official successor to Netlify CMS and works well with the old tooling. Here are the steps to get up and running with Decap. Step-by-s [...]
Zed is a rocket-powered skateboard π
Zed is a new Rust-powered editor by the creator of Atom that focuses on speed but lacks a lot of features. My experience: I downloaded Zed after heari [...]
Fix failed Fastify deploy on Render π
To get a boilerplate Fastify app to deploy on Render.com, you need to read to listen on PORT environment variable. Background: When trying to deploy a [...]
Find and replace with Regex groups π
Create Regex groups with parentheses for powerful find/replace patterns. Setup: I have a markdown file with a lot of shorthand links to GitHub PRs, e. [...]
Fix SVG CSS animation issue in Safari π
Safari 16 has trouble with CSS animations on SVG child elements, but you can resolve them by using a combined transform property. Setup: You have an S [...]
Listen for class change in JavaScript π
There isnβt an event for class list changes, but you can write a function that listens for class changes on an element with the MutationObserver API. [...]
Create Axios-style articles with CSS π
You can style heading elements to look like the axioms in Axios articles with CSS. Step by step: Start with the following HTML markup for this example [...]
CSS :empty pseudo class π
:empty allows you to apply styles to an element when it has no child nodes This is useful for hiding empty elements to keep visual grids consistent It [...]
Fix trailing whitespace in Astro components π
A closed issue on GitHub appears to still be occurring Forcing your code onto a single line is a workaround When your Astro code is formatted onto mul [...]
Farewell Create React App π
The React team is looking to sunset βCreate React Appβ as a project scaffold They are leaning towards turning it into a βlauncherβ which would suggest [...]
Valid JavaScript variable names π
Iβve been working on a little library to help build little JavaScript applications. Something to fill the gap for me between little scripts and reachi [...]
Migrating to IndieWeb.social π
Today I migrated from fosstodon.org to indieweb.social. You can find me @seanmcp@indieweb.social. In the process, I found this guide by Josh Justice t [...]
Publishing a Qwik component π
After hearing creator MiΕ‘ko Hevery on every front-end podcast that I listen to, I decided to give his new Qwik library a look. My canonical approach t [...]
Fix Astro dev server hanging with new collections API π
This week I was in the process of upgrading this site to Astro v2 and its new features. Upgrading to version 2 went smoothly, but I encountered a frus [...]
Be careful parsing formatted numbers in JavaScript π
I was working on a script recently and ran into an unexpected issue. The work involved parsing a number-range string into an array of numbers, e.g. "1 [...]
New command palette π
Last month, I wrote about the new "command bars" UI pattern, and ever since the idea of adding one to this site has been kicking around my head. The d [...]
Fix "package esbuild-linux-64 could not be found" error on Netlify π
This morning my website's builds started failing on Netlify. Checking the deploy logs, I saw the following error: 10:29:09 AM: [astro:jsx] The package [...]
Portable custom search engines π
Custom search engines (or site search) are a useful tool for improving your workflow in the browser. By configuring shortcuts and URLs, you're able to [...]
A first look at Static CMS with Astro π
The first version of Static CMS, a community fork of Netlify CMS, is scheduled to drop today. As a Netlify user and a general fan of Netlify CMS, I am [...]
Astro components do not merge HTML attributes π
Over the past month I have been enjoying working in the Astro ecosystem recently, and have been working on some simple community packages. I've learne [...]
Run Netlify CMS and your dev server in one command π
If you're using Netlify CMS, there is a command that you can run to load it in development: npx netlify-cms-proxy-server This is useful, but it needs [...]
Fix Netlify Dev's 'Multiple possible start commands found' issue π
Netlify Dev attempts to guess what framework your project is using and what commands it should run in development. $ netlify dev β Netlify Dev β β Ig [...]
Astro components for Netlify features π
This morning, I released the first version of astro-netlify-components,a library of Astro components for Netlify. I was about to start dogfooding the [...]
Create a "Dave Rupert"-inspired activity graph π
This article was written when seanmcp.com was powered by Astro. I have left the content in place, but the activity graph described no longer renders. [...]
Use your domain on Mastodon with Astro π
Update: The solution in this article still works, but I think using a redirect as described here is probably a better option. Maarten Balliauw shared [...]
Are command bars the future? π
Maggie Appleton recently wrote about "Command K Bars", those command line bars that you pull up with a keyboard combination. In addition to giving a l [...]
Node.js is great for scripting π
This week I was working on a project that reads 6.4 MB of text files (the complete English Bible), does some processing and computation, and then outp [...]
There is no multi-tasking on the Raspberry Pi π
Maybe this isn't fair to file under the "Trying Linux 2022" series since it isn't commentary on the operating system writ large. However, it is a part [...]
Finding a Linux distro and software that work π
I wrote yesterday's article about giving Linux another try while things were still installing, i.e. too soon. Here is everything that I tried: Ubuntu [...]
Giving Linux another try π
I felt inspired by an article by Hey Homepage and recent episode of The Changelog podcast to give Linux another try. This description just sounds so n [...]
Awesome browser extensions π
Extensions can slow down your browser, so I try to only add ones that are necessary or super helpful. Here is a list of the extensions that make the c [...]
Using dynamic routes to organize blog posts in Astro π
If you create a new Astro project with the installer, it will organize blog posts as markdown files in a src/pages/blog/ directory. Each post will hav [...]
Jest π
Since 2017, I have only used Jest for JavaScript application testing. And while Vitest does look exciting, I think that it's safe to say that Jest wil [...]
How to use StackBlitz with Firefox π
StackBlitz is a great tool for rapidly prototyping web applications. In recent weeks, I has been my go-to tool for testing out new web technologies (C [...]
How to replace Math.random with crypto in JavaScript π
JavaScript has a method for generating random numbers from 0 to less than 1: Math.random(). If you've ever been working on an app that selects a rando [...]
Use multiple Chrome Profiles when debugging π
Awhile back, I read about using separate Chrome profiles[1] for debugging. The idea is to have specific environments that are specially configured to [...]
When to use React's memo HOC π
When React wants to render a component, it renders all of the components in the tree from that point. So if you have a parent component with two child [...]
Calculate the sum of everything up to a given number π
My wife showed me a Tik Tok series where someone was decluttering their life by getting rid of an increasing amount of items every day for 30 days. Th [...]
English words by consonant-vowel pattern π
When teaching people (or computers) to read, it's useful to group similar words into categories. One such grouping is by consonant-vowel patterns, whi [...]
Add a custom emulated device in Chrome π
Google Chrome provides a feature in the dev tools to emulate a device within the desktop browser. This is really helpful to get a quick preview of wha [...]
Upgrading an Eleventy site to 1.0.0 π
I initially published a note about how easy it was to upgrade to Eleventy 1.0.0, but I hit a snag which warrants a quick article. Here are the two ste [...]
Make a web component π
To make a web component, you need to create a new class. You can extend an existing component class if you want to preserve some semantic behavior, bu [...]
Prevent Chrome from adjusting audio input levels on Mac π
Starting Fall of 2021, I noticed that my bluetooth headphones would periodically mute me while I was speaking during video chats on Google Meet. I tri [...]
Helpful online tools for diagramming π
A good diagram can make a big difference when communicating a message. I often turn to a diagramming tool when trying to explain a complex idea or org [...]
What is a build.gradle file? π
When working on a React Native app, you will probably make some changes to the build.gradle file in your projects android/ directory. This file is the [...]
Three new games on Toollama π
I don't think I've written about Toollama.com yet on this site, so here's a quick introduction. Toollama is a loose collection of education-focused pr [...]
React Native Glossary π
Building applications with React Native requires a high-level understanding of mobile development on Android and iOS devices in addition to React and [...]
What happened to @react-native-community packages? π
When React Native was first released, it included extra modules that were helpful for mobile development like WebView, NetInfo, and AsyncStorage. Late [...]
Find an iOS simulator identifier π
When running a device simulator on macOS, it is possible to navigate that system's directly through the command line (or Finder, if you'd prefer). To [...]
Using BEM names in React Native π
When writing CSS classes, I prefer BEM's naming system. The pattern is clear to read and names are easy to generate. I believe the unwieldy length of [...]
What is Hermes in React Native? π
React Native is framework for building Android and iOS application using React and native capabilities. It allows developers to write JavaScript code [...]
Add a YouTube-embedder shortcode to your Eleventy site π
For a recent article, I wanted to add some embedded YouTube videos. Through the share menu beneath the video, you can select "Embed" to copy and paste [...]
Get innerHTML of Enzyme wrapper π
In Enzyme, wrapper's have a handle .html() method that will return the outerHTML for that element in the tree. It's handy in the rare instance when th [...]
Use remark to covert markdown into HTML π
I've used remark in a few different projects, and each time I found it difficult to get started. For such a popular project, the documentation is quit [...]
Count class methods in JavaScript π
If you have a class in JavaScript and want to know the number of methods it contains, there are a few steps that you need to follow. Let's say we have [...]
Git π
Here are some of the git commands that I find useful when doing by work as a software engineer. Hopefully you will find them helpful too! Commands Per [...]
Read URL search parameters with JavaScript π
Hello search params! The following parameters were detected on this page: To learn how I did this, read on or inspect the source code for this p [...]
Fix 'downloadable font: rejected by sanitizer' error in Firefox π
I ran into an issue today when I tried to serve a typeface I downloaded from Google Fonts. When I added the files and @font-face rules to my CSS, I go [...]
Fix Netlify CMS YAML error 'Implicit map keys need to be on a single line' π
When trying to setup Netlify CMS on a project, I kept getting this error on the /admin page: Error loading the CMS configuration Config Errors: YAMLS [...]
Copy the last git commit hash on macOS π
When responding to code-review requests, I like to point the reviewer to the specific commit where the issue was addressed with a message like: Fixed [...]
Add Heroicons to an Eleventy site π
In a recent Eleventy project, I wanted an easy way to add Heroicons. That lead me to creating an Eleventy plugin that adds some handy Heroicon shortco [...]
Create a URL shortener with Netlify π
After hearing of a few people doing the same, I set up a mostly-free URL shortener with Netlify: smcp.dev. Here's the steps I followed to get it done. [...]
Set innerHTML of an element in Svelte π
When working on a Svelte application, I wanted to replace newline characters in a string with <br> elements and render the result as HTML. If you do t [...]
Let's stop skinning cats π
Idioms are interesting. They're phrases that have a functional meaning that is independent of their literal meaning. In English, we have idioms like " [...]
Search all files for two strings π
To search the current directory for all files that contain two independent strings, you can use the following terminal command: grep -lr "common" $(gr [...]
Fix "Error: Could not resolve pagination key in template data" in Eleventy π
In a recent Eleventy project, I wanted to create a single collection for tags with two keys: alphabetical for an array of all tags, and popular for an [...]
Geddes' Guide to Crafting π
I spent some time this week enjoying Dave Geddes' content. Three resources in particular have left me with a lot to think about, and I'm combining the [...]
Send data to the window with Eleventy π
Static-site generators like Eleventy are great at building websites. But when you want to add additional functionality, like a search feature, it migh [...]
Checkout the previous git branch π
Today I needed to checkout a branch, pull the latest, then checkout dev, pull the latest, and merge dev into my branch. This flow is pretty typical of [...]
Make all properties required in TypeScript π
I have a type interface for shapes that looks something like this: interface Shape { height?: number; width?: number; } Now I want to extend my in [...]
Add text to the beginning of every file π
While converting a JavaScript create-react-app project to TypeScript, I wanted a single line of text to every .tsx file. Searching for an answer broug [...]
Sass converts hsla to hex incorrectly π
I ran into an issue where Sass was converting hsla() values to hex incorrectly. It would take an input like this: /* input.scss */ .subtle-blue { ba [...]
Increase the playback speed on any audio or video online π
I like learning from audio and video, from podcasts to YouTube videos. My favorite applications let you alter the playback speed of the audio and vide [...]
Standardize character width with CSS π
Authors note: Before you read this article, you will want to click the "Start timer" button below to enable the live demos. You can cancel it at any t [...]
See all package versions in npm cli π
At work, I ran into an issue that may have been related to an external dependency. I wanted to update the package to see if a future release fixed the [...]
TypeScript without TypeScript π
As a superset of JavaScript, TypeScript provides a lot of useful features. It's no mystery why it is one of the "most loved" languages in software eng [...]
Emulate iPhone & iPad in Safari π
To emulate an iPhone or iPad in Safari, you first need to have the developer tools enabled. Then when visiting a page that you want to test, select "D [...]
Make a POST request with fetch π
fetch is utility for making HTTP requests from the browser. It is available in all modern browsers and has a popular polyfill for older browsers. To m [...]
Remove an item at a given index in JavaScript π
Removing an item from an array at a given index is a pretty common task in programming. So it is a little disappointing that the Array prototype in Ja [...]
Tab focus not working in Safari? π
While doing some cross-browser testing in Safari, I noted that tab was not working as expected. I was looking at a focus-managed component, so my firs [...]
Fix 'EMFILE: too many open files' error in Jest π
When I tried to run jest --watch in a codebase, I received the following error: Error: EMFILE: too many open files, watch at FSEvent.FSWatcher._ha [...]
UpdatedΒ TypeScript mega-course on Egghead.io π
Last month, I embarked on a journey to learn TypeScript better. I hand-crafted a TypeScript"mega-course" on Egghead.io by cobbling multiple courses in [...]
Access the home directory in Deno π
If you want to access the home directory from you Deno program, you can use the Deno.env's get method with "HOME": Deno.env.get("HOME"); In unix envir [...]
Before You Debug π
Debugging, "the process of finding and resolving defects within a computer system"[1], is a critical skill for software development. It's how we figur [...]
Before Debugging π
Debugging, "the process of finding and resolving defects within a computer system"[1], is a critical skill for software development. It's how we figur [...]
Nodemon for Deno π
Update: As of Deno v1.4, there is a built in watch mode that you can enable with the --watch flag. Read more about that here. Nodemon, or as I read it [...]
Parse argument aliases in Deno π
You can parse command-line arguments in Deno with the standard flags module: import { parse } from "https://deno.land/std/flags/mod.ts"; console.dir( [...]
Await multiple promises in JavaScript π
Let's say I have two promises: the former resolves in three seconds, while the latter resolves in five. I need to wait for both of these before moving [...]
TypeScript mega-course on Egghead.io π
This playlist has been updated. Check out the latest version of my TypeScript "mega-course" on Egghead.io. I would say that I have "functional" unders [...]
Six video update π
A few weeks ago, I wrote about publishing my first YouTube video. In that article, I included my reasoning and what I hoped to gain from it. My goal i [...]
Read a json file in Deno π
Deno is a secure runtine for JavaScript, so to read a file the program needs explicit permissions. We can enable file reading with the --allow-read fl [...]
Read a json file in Node.js π
To read any file in Node.js, you need to import the fs or file system module. From there, you have two methods from which to choose: readFile, and rea [...]
Publishing my first YouTube video π
Yesterday, I published my first video on YouTube: "Three Ways To Open The Firefox DevTools". As the title suggests, it covers the three main ways of o [...]
How to get the browser and version in JavaScript π
For a recent project, I wanted to display the browser and version on the screen. I figured that this would be possible in JavaScript, so I went search [...]
Logging with Eleventy and Nunjucks π
This site was forked from the Eleventy base blog and uses Nunjucks templates. When everything is working, it is as smooth as can be. But when I run in [...]
Store readable data π
Imagine that you want to store data to look up the continent for every country in the world. The best data structure for this is a object/map/dictiona [...]
How to open the Dev Tools π
As a web developer, one of the most powerful tools in your arsenal is the browser's developer tools. Here is a list of all the ways to access the dev [...]
Tools for custom Slack emojis π
Custom emojis are a fun way to customize your Slack workplace. The fun, silly, and can provide some genuine utility for the rest of your team. Slack a [...]
Programming reads π
This is an alphabetical list that has helped shape the way that I think about software engineering. At some point in the future I may add some comment [...]
Free to grow π
I previously wrote about testing UI components, and why I recommend that you don't use snapshots. I finished that article with this line: Your tests s [...]
How to check npm scripts in current directory π
As a front-end engineer, I spend a lot of time jumping in-between JavaScript projects. Often times I want to run a command from those projects to star [...]
How to remove duplicates from an object array? π
Reviewing a recent code exercise at work, we came across a situation where a candidate wanted to ensure that there were no duplicates in an array of o [...]
Write a draft script for your SSG blog π
This site is powered by Eleventy, a simple static-site generator. All of the pages and articles exists as markdown files that are converted into HTML [...]
What default parameters do (and don't do) π
Default parameters are a handy feature in JavaScript. MDN has a more thorough explanation, but imagine a function that greets a user: function greetUs [...]
"Stop Teaching Code" in JavaScript π
At some time in the future, I would like to return to the classroom to teach programming to middle school students. That is the age when I first start [...]
5 Lessons from 10k open-source downloads π
In April of 2018, I wrote an article "How to use emojis in React". At the time, the default eslint configuration for Create React App would flash an e [...]
Should I snapshot my UI components? π
If you are writing tests for React components in 2019, you will probably find your way to Airbnb's Enzyme testing utilities. The recent industry stand [...]
Edit a previous commit message π
At my previous company, all commit messages need to begin with a ticket name and number from Jira. If I'm working on the Bananas project and am assign [...]
Arguments or parameters? π
I have a hard time remembering the difference between two common programming terms: arguments, and parameters. This simple inability leads to real ins [...]
Add event listener for class change π
π Update: I created a reusable function to listen for class changes on any element that is more robust that the solution here. If you're like me and [...]
Storing data in state vs. class variable π
This past week I was working with a new coworker who has previous experience developing but is new to React. After picking up a few syntax cues, he st [...]
Filter out premium Medium articles π
Medium has received a lot of flack recently for their push to monetize the platform. And while I don't fault them for moving some of their best articl [...]
Adding accessibility checks to your React app π
Updated - 3/9/19 This article was initially released with a reference to a third tool for React accessibility checking: react-a11y. Since publication, [...]
Three reasons to learn Python π
There are tons of reasons to learn a programming language. Maybe you are new to coding and are looking for a good place to start. Maybe youβre interes [...]
JS Basics: Generate a random number π
Whether you are simulating a die roll or pulling any index from an array, computers can be used to generate a random number. In JavaScript, random num [...]
JS Basics: Ternary Operator π
A ternary or conditional operator is like an inline if statement. In JavaScript, you can identify them by their unique use of a question mark, ?, and [...]
Convert class components to functions with React Hooks π
Last year, the React team announced hooks, a feature to more easily abstract logic into reusable components. On the day of the announcement, I wrote a [...]
Accessibility Wednesday π
In the fall of 2018, I had the good pleasure of attending the Connect.Tech conference in Atlanta, GA. There were great talks about React, user experie [...]
How to create a render prop component π
It's been a year since Michael Jackson published "Use a Render Prop!", which encouraged using render props instead of higher order components (HOCs). [...]