TIL: Today I learned...

If you go to Window > Save Window Layout, it’ll save your current window layout in Visual Studio. For example, when I have to go from my monitor setup to just my laptop, I tend to set the solution explorer to auto-hide and make the Test Explorer smaller. Now I can do it with just a keyboard shortcut!

Using the builtin Emmet functionality, you select any arbitrary text or HTML and wrap it with new markup by executing the command Emmet: Wrap with Abbreviation and typing an Emmet abbreviation. I’m going to be using this all the time now! It even understands JSX so it’ll output className if you specify a css class.

If you click on a cell with json data in the results grid in Azure Data Studio, then it will automatically open a new tab with the json nicely formatted and syntax highlighted. Very handy for quickly checking the data stored in some rows with just a quick select *.

Even if a button is hidden with display: none, if it has a type of submit then it will still be activated if it’s the first button in a form and a user hits enter in a form field. So it’s a good reason to always explicitly specify the type of a button since submit is the default but most of the time you want type="button". FYI there’s an eslint rule for this for react....

Today I learned about a cool terminal UI tool for managing containers called lazydocker. I’m not really working with Docker on my current project but I’m bookmarking it for later. If you’re a fan of lazygit, lazydocker is from the same author.

If you hover over a CSS selector or property, VS Code will provide an HTML snippet that’s matched by the CSS rule, and it will also show the specificity. For example, this very specific rule that’s similar to one I came across recently: I also had to look up the ~ which is the General sibling combinator.

I learned how to correctly read sequence diagrams. I came across a recent post that suggests “Sequence diagrams are the only good thing UML brought to software development”. I’d never thought they were that useful but it turns out that was because I’d been misreading them. There’s probably been a few instances over the years where I’ve made a flowchart where a sequence diagram would have been better. For example, I tend to add a high-level overview of how a request moves through our application especially since Mermaid....

Pressing ctrl+enter in a comment field on Azure DevOps will submit the comment! For some reason, this isn’t listed on their keyboard shortcuts page but it’s so much nicer than using the mouse or pressing tab four times.

The Git Extensions git client is actually pretty powerful and has a lot more features than I thought. I’d seen others using it before but never looked into it until I saw a StackOverflow answer suggesting to use Git Extensions to view the git reflog… a feature I’ve only ever seen in Smartgit. Some nice features I noticed while playing with it for a bit: View commits from the reflog in the log view (makes it really easy to recover commits) Option to view First Parent only in the log view Stage individual lines Option to launch external editor for commit message The commit message window can autocomplete file names Show/Filter any number of branches in the log view Windows file explorer integration Completely free and open-source and cross-platform I think I still prefer Smartgit over Git Extensions but it’s tough to recommend Smartgit since it requires a license for Commercial use so I’m always keeping an eye out for good free options to recommend to others and now Git Extensions is my new recommendation (much better than SourceTree)....

You can get pretty good type checking in Javascript with just JSDoc comments and an editor like VS code or Visual Studio. You’ll get most of the same intellisense and warnings in your editor as you would with Typescript. Combine this with a library like Zod which can infer validation schemas from your types and you’ll have runtime checking also! See: https://blog.jim-nielsen.com/2023/types-in-jsdoc-with-zod/ https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html