DEV Community

Cover image for Day 14: Keep on Spinning! ♻️
Valeria
Valeria

Posted on

2 1 1

Day 14: Keep on Spinning! ♻️

Today I'd like to share a tiny tool called nanospinner. It does one thing and one thing only: it shows a terminal spinner and a ✔ when complete!

As usual, install with deno add npm:nanospinner and create a file, e.g. main.ts with the following contents:

import { createSpinner } from 'nanospinner'

const spinner = createSpinner('Counting days till Christmas').start()

setTimeout(() => {
  spinner.success()
}, 2000)
Enter fullscreen mode Exit fullscreen mode

Start with e.g. deno run -A ./main.ts and behold:

Terminal spinner

In addition to spinner.success there's expectably spinner.warn and spinner.error.

All of those methods can be customised in a multitude of ways: from colors and symbols to custom animation frames!

Check it out and share you creations!

Liked the content and would love to have more of it all year long?

Buy Me A Coffee

Heroku

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site

Top comments (3)

Collapse
 
fyodorio profile image
Fyodor

Interesting thing is that such stuff doesn’t necessarily work as it is for all the environments. I saw that for instance spinners and similar animated stuff looks differently if the resulting CLI app is dockerized (with barebones primitive images) or run from similar minimalist environments — they are replaced with something like [loading started] or [loading ended] — which doesn’t look that fancy at all. So one should be aware of such things if they build CLIs for versatile environments and provide for some kind of graceful degradation. Because [loading started] may look ugly in the context of some ambitious CLI project 😅

Collapse
 
valeriavg profile image
Valeria

I didn’t find anything in the code of this particular library that would do that: it’s quite minimalistic and straightforward. Did this happen to you when your were using this library or something else?

Collapse
 
fyodorio profile image
Fyodor

That might be some different one for sure, it’s just the fact that there are some [probably implicit] fallbacks for such animated stuff — I’m going to revisit this fact soon anyway and I have noted to come back and leave the research results here just in case 📝

Cloudinary image

Video API: manage, encode, and optimize for any device, channel or network condition. Deliver branded video experiences in minutes and get deep engagement insights.

Learn more

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay