Upload Images to a NextJS Folder from anywhere on your Mac




# get the widthxheight dimensions of an image and
# append that to the file's basename.
# Legend: a = absolute path, a:r = path and basename, a:e = extension
# Usage: dim.zsh image1.ext image2.ext ... imagen.ext

for f in "$@"
    # generate widthxheight string by joining array elements w/'x' as separator
    wxh=${(j:x:)$(/usr/bin/sips -g pixelWidth -g pixelHeight ${f:a} |\
        /usr/bin/awk '{getline;print $2}')}
    echo "<Image src=\"/$localname\" width=\"${wxh:0:4}\" height=\"${wxh:5:4}\" />"

This script uses sips to get the dimensions of a image file, copies it to your public folder in a NextJS directory and writes a JSX string in the form of: <Image src="" width="" height="" />

You can add a Copy to Clipboard action right after to copy the image string to clipboard.


Read These Next

The Danger of Journaling IS Introspection

Too much introspection? Introspec-ception?

Using Mac Automator to Play Spotify when VSC is Opened

Taking programmer flow state to the next level

Stay in Touch

Each week, I send out something that looks like this. Sign up below if you want in!