TIL: Today I learned...

Today I learned that javascript has a handy built-in function called URLSearchParams() that you can use to build a url query string from an object. const petfinderData = { key: "12345", shelterID: "abc00", count: 20, animals: ["dogs", "cats"], }; const query = new URLSearchParams(petfinderData); // returns "key=12345&shelterID=abc00&count=20&animals=dogs%2Ccats" const queryString = query.toString(); Read more: https://gomakethings.com/how-to-build-a-query-string-from-an-object-of-data-with-vanilla-js/ You’ll want to be careful with complex object list arrays since it serializes to a form like animals=dogs,cats, which not be the format the server expects. Asp.net model-binding for instance, by default expects a format like animals=dogs&animals=cats (and some other variations).

I discovered that a reword option was added to --fixup back in git 2.32 The basic command looks like git commit --fixup=reword:<commit> and you can use it like you would the other autosquash commands. I recommend creating an alias for it though. Thanks to this post, I’ve had a fixup alias that uses fzf to select form recent commits so I created a similar one for reword: [alias] reword = "!git log -n 50 --pretty=format:'%h %s' --no-merges | fzf | cut -c -7 | xargs -o -I{} git commit --fixup=reword:{}" Note, if you’re on Windows, you can install fzf via Chocolatey. And you might also be interested in PSFzf which a Powershell module that wraps fzf.

Today I learned how you can view the Modelstate errors while debugging a controller in Asp.Net: ModelState.Where(x => x.Value.Errors.Count > 0).Select(x => x.Key).ToList() Just paste that in the watch window. If you’ve tried debugging to find what field is causing the Modelstate to be invalid, you’ll know how tedious it is to dig through but thanks to this post for this handy tip!

Today I learned about the new view transitions API and I was pretty impressed with how much of the heavy lifting the browser will now do for you to animate between states. Adam Argyle has a fun talk where he shows what you can do with this new API. I only had to add a couple of lines of javascript to animate reordering a list of items that would have required a more complicated technique like FLIP (first last invert play) in the past.

You probably don’t want to put a React error boundary at the root of a component (meaning, wrapping the component’s own render output). This is because error boundaries only catch errors in their child component tree. They won’t catch errors that occur within the error boundary component itself, including errors in its own render method or lifecycle methods. To use an error boundary effectively, you need to wrap the component you want to protect with the error boundary from the parent. ...

Today I learned about console.trace() when I needed to find out where a global function was being overridden: Object.defineProperty(window, 'setErrorMessage', { set(value) { console.trace('Global variable set:', value); } }); This little snippet outputs a stack trace anywhere code was trying to define this global function and let me right to the culprit. See more about .trace()

Today I learned that you can actually store state in the browser history via the history API (note this is not the query string). I came across in this post that uses it as a clever method for temporarily storing form data.

Today I learned that in a recent version of visual studio they added the keyboard shortcut ctrl+/ to toggle code comments so it works just like in vscode instead of the default of two different cumbersome hotkeys to comment/uncomment. This also led me to discover that Visual Studio comes with a builtin keyboard mapping scheme for VSCode hotkeys which has more modern defaults. For instance, it changes ctrl+p to open the fuzzy file finder instead of the print dialog… I don’t know that I’ve ever wanted to print a source code file… except one time long ago when I wanted to convince a higher-up the need to refactor a sql query so I taped together the 10+ page printout 😅.

Today I learned about Chain-of-Thought Prompting which is a technique to get potentially better results from an LLM where you craft your prompt with an example of the chain of thought or steps in reasoning to solve a complex problem. This gives a good explanation: https://www.promptingguide.ai/techniques/cot

Today I learned about .http files that you can use to make/test requests to any api endpoint from within most IDEs/editors. This started with the Rest client vscode extension and then Visual Studio 2022 added support somewhat recently. It kinda acts like an alternative to something like Postman but without leaving your editor, but for me the nice thing is it can act like a runnable form of documentation for your api that you can commit alongside your code.