128 TILs and counting...

Dev containers

Today I learned that dev containers are an actual spec. I’d been hearing the term more lately but I thought it was a general term for containers used for local development but it’s actually an open spec for configuring an entire development environment within a container and it’s what you use to configure a github codespace for a repo. But the cool thing is you can use the vscode Dev containers extension and vscode will reopen in a docker container with all the dependencies, extensions, and configuration specified in a devcontainers....

September 11, 2023 · 1 min · Brandon Pugh

CSS accent-color property

Today I learned that browsers now support an accent-color property on some form inputs for customizing their color. This is especially nice for checkboxes and radio buttons because now I no longer need any workarounds I’ve used in the past to make a decent-looking checkbox. It will also ensure that it’s accessible by automatically adjusting the color of the check to an appropriate contrast: <input type="checkbox" class="yellow" checked /> <input type="checkbox" class="purple" checked /> <style> input { display: block; width: 30px; height: 30px; } input....

September 7, 2023 · 1 min · Brandon Pugh

Delta pager for Git

Today I learned that you can configure git to use a different diff viewer when displaying diffs from the command line. You do this by setting the pager config git config --global core.pager delta and delta is a cool one written in Rust that can even display line numbers and syntax highlighting. git show produces: Relatedly, it uses the same themes as bat which is a cat command line replacement with syntax highlighting that is pretty nice....

September 5, 2023 · 1 min · Brandon Pugh

Null values in javascript interpolated strings

Today I learned about a key difference between how javascript handles null values in interpolated strings compared to a language like C# In C#: var param1 = null; var queryString = $"param1={param1}"; // => param1= In Javascript var param1 = null; var queryString = `param1=${param1}`; // => param1=null the latter is probably not what you want since your api will likely set param1 to a string value of “null”.

September 1, 2023 · 1 min · Brandon Pugh

Object.fromEntries

Today I learned about Object.fromEntries() in javascript which essentially lets you convert a list of key/value pairs into an object (this is the same as the lodash function fromPairs). This came in handy when I needed to convert a list of entities into a lookup object like: Object.fromEntries( users.map((user) => { return [user.id, user.isSelected]; }) ); // => { '1': true, '2': false, '3': false }

August 30, 2023 · 1 min · Brandon Pugh

Emulate page focus

Today I learned about a devtools feature that helped me debug the styling of an element that would disappear when the input element lost focus which happens when you click over to the devtools. If you press ctrl+shift+p to open the command palette in DevTools, and type “focus”, you’ll see a command to “Emulate a focused page” which will leave the focus on the element in the page even when you click into the DevTools....

August 28, 2023 · 1 min · Brandon Pugh

Ternary in C# string interpolation

Today I learned you can have ternary expressions inside of interpolated strings, you just need to wrap it in parenthesis: $"{timeSpan.Hours} hour{(timeSpan.Hours > 1 ? "s" : "")} ago"

August 23, 2023 · 1 min · Brandon Pugh

Pretty Typescript errors Vscode extension

I recently discovered the Pretty Typescript errors Vscode extension that makes complicated Typescript errors much more readable in Vscode

August 21, 2023 · 1 min · Brandon Pugh

Ignore commits in Git Blame with –ignore-revs-file

Today I learned that you can ignore commits in Git blame on Github with a .git-blame-ignore-revs file in the root of your repo! I’d known about the git config blame.ignoreRevsFile config option where you can point it to a file with a list of commit IDs to ignore which is especially useful for those annoying commits in a repo where whitespace was cleaned up or every tab in the codebase was replaced with spaces....

August 17, 2023 · 1 min · Brandon Pugh

Git branch –force

Today I learned about the --force parameter of git branch which will take an existing branch and point it to a different commit. This is another handy alternative to git reset --hard for some common scenarios. For example, if I forgot to create a new feature branch and accidentally made some commits onto main, I can run the following: git checkout -b new-branch # create the new branch and switch to it git branch --force main origin/main # fix main back to what it should be vs what I would do before:...

August 16, 2023 · 1 min · Brandon Pugh