~/leohuynh.dev/gists

Gists

Ready-to-use code snippets and small utilities I reach for often.

25 snippets

Typescript

Parse functions from string

Safely send JavaScript functions from your server to your client by serializing them as strings, then parsing them back into callable functions on the client side.

Bash

Disable characters popup when holding keys

How to disable popup showing accented characters when press and hold a key on macOS.

Hydrogen

Shopify Hydrogen Codegen Configs

How to configure Shopify Hydrogen Codegen to automatically generate types for your GraphQL queries.

Bash

Zipping files on macOS

Macos command to zip files and directories into a single file.

Typescript

Relative time-ago parsing

A simple utility function to parse relative time-ago into human-readable format.

GitHub

Connecting to GitHub using SSH

Using the SSH protocol, you can connect and authenticate to remote Github servers and services without supplying your username and personal access token at each visit.

Pnpm

Pnpm aliases

How to install and update pnpm, create a shell alias for it, and upgrade project dependencies efficiently.

VSCode

VSCode settings

My personal VSCode configurations, settings, and key bindings that I use across all my devices.

Npm

npm commands

Essential npm commands for local development, covering package installation, version control, and script management.

Remix

Remixing remix submission

Create a custom hook to manage in-route form submissions in a Remix app.

GitHub

Verify Github webhooks

Verify and process incoming GitHub webhooks. How to set up listeners, validate requests, and handle Github's webhook events.

Spotify

Display Spotify currently playing track

Retrieve a Spotify access token to display the currently playing track on your website or application.

Typescript

Casing utilities

A various ready-to-use string casing utilities in Typescript.

Git

Case sensitive renaming

Safely rename case-sensitive files or directories in a Git repository to avoid conflicts or case inconsistencies.

Javascript

Deep remove falsy

Recursively removes all falsy values (null, undefined, 0, false) from an object and its nested properties.

React

Use an async effect

Build a custom React hook to use asynchronous effects inside functional components.

Typescript

Color validator

Validate strings to ensure they represent valid colors in various formats (hex, RGB, and named colors).

Bash

Kill that process

Identify and terminate processes running on a specific port in your dev environment.

Markdown

Markdown code block syntax

A detailed overview of Markdown code block syntaxes, covering both basic and advanced use cases.

Javascript

Event Emitter

A lightweight pub/sub mechanism to handle custom events without adding a full-blown library.

Liquid

Manipulating dates in Shopify Liquid

How to manipulate dates (adding, subtracting, and formatting, etc) in Shopify's Liquid template language.

Bash

Read file names

A quick utility to read all file names in a directory using Node.js.

Javascript

VNese to plain English

Convert Vietnamese text to plain English by replacing accented characters with their equivalents.

Git

.gitignore tips

How to ignore all files in a directory except for a specific one.

React

Sync component state with local storage

Utilize a custom hook that syncs state with local storage, allowing for persistent state between sessions.