DEV Community

Cover image for πŸš€ Typeglide: A Simple Typing Effect Library for Node.js
Dieke Sydney
Dieke Sydney

Posted on

2

πŸš€ Typeglide: A Simple Typing Effect Library for Node.js

I've always been fascinated by JavaScript and have been learning how the npm registry works. As someone who loves animation and enjoys adding life to static text, I decided to build Typeglide to make the command line more interesting and engaging.

In the world of terminal applications and CLI tools, adding dynamic, eye-catching effects can significantly improve user experience. Whether you're building an interactive console application or just want to add some flair to your scripts, Typeglide is here to help!

Typeglide is a lightweight typing effect library designed for Node.js. It provides a smooth, customizable way to simulate typing animations in terminal applications. With built-in features for speed control, looping, shuffling, and more, Typeglide makes it easy to bring text to life.


πŸ“¦ Installation

Install Typeglide using npm:

npm install typeglide
Enter fullscreen mode Exit fullscreen mode

πŸš€ Quick Start

Setting up Typeglide is straightforward. Here's a basic example:

import typeglide from "typeglide";

var myArray = [
  "Good morning",
  "How are you today?",
  "Would you like a cup of coffee?",
];

typeglide({ strings: myArray });
Enter fullscreen mode Exit fullscreen mode

This will display the provided strings as if they were being typed in real-time.


⏱ Customize Speeds & Delays

Fine-tune the typing effect with typing speed, backspacing speed, and delays:

import typeglide from "typeglide";

typeglide({
  strings: myArray,
  typeSpeed: 70,   // Typing speed (milliseconds)
  backSpeed: 50,   // Backspacing speed
  startDelay: 10,  // Delay before typing starts
  backDelay: 100,  // Delay before backspacing
});
Enter fullscreen mode Exit fullscreen mode

This level of customization ensures that you can create the perfect typing animation.


πŸ” Looping Strings

Enable looping and define how many times to repeat:

import typeglide from "typeglide";

typeglide({
  strings: myArray,
  loop: true,       // Enable looping
  loopCount: 3,     // Number of times to repeat
});
Enter fullscreen mode Exit fullscreen mode

Perfect for CLI apps that need continuous messaging.


✨ Extra Features

Typeglide comes with additional options:

Name Required Default Description
backspace(bool) no true Disable backspace to type each string on a new line
backspaceLastString(bool) no true Whether to backspace last string on the array
shuffle(bool) no false Shuffle the strings on the array
singleLine(bool) no false Types strings on a single line
seperator(string) when singleLine is activated empty string Seperate strings on single line

For example, to shuffle the strings and keep them on a single line:

import typeglide from "typeglide";

typeglide({
  strings: myArray,
  shuffle: true,
  singleLine: true,
  separator: " | ", // Example: "Good morning | How are you today? | ..."
});
Enter fullscreen mode Exit fullscreen mode

🀝 Contributing

As I'm constantly exploring JavaScript/Typescript and learning about npm, I'm open to feedback and ideas to make Typeglide even better! πŸŽ‰

Feel free to create an issue if you encounter bugs or have suggestions.

You can also make a pull request to add new features!

Check out the repository on GitHub:
πŸ”— Typeglide on GitHub


πŸ“œ License

MIT License – Free to use, modify, and distribute.

πŸ“Œ Author: Dieke Sydney Sydney205


πŸ“₯ Install & Try It Today!

Ready to enhance your terminal applications? Install Typeglide now:

npm install typeglide
Enter fullscreen mode Exit fullscreen mode

Let me know what you think! I'm always open to feedback, ideas, and improvements. πŸš€

Image of Quadratic

Free AI chart generator

Upload data, describe your vision, and get Python-powered, AI-generated charts instantly.

Try Quadratic free

Top comments (0)

Playwright CLI Flags Tutorial

5 Playwright CLI Flags That Will Transform Your Testing Workflow

  • --last-failed: Zero in on just the tests that failed in your previous run
  • --only-changed: Test only the spec files you've modified in git
  • --repeat-each: Run tests multiple times to catch flaky behavior before it reaches production
  • --forbid-only: Prevent accidental test.only commits from breaking your CI pipeline
  • --ui --headed --workers 1: Debug visually with browser windows and sequential test execution

Learn how these powerful command-line options can save you time, strengthen your test suite, and streamline your Playwright testing experience. Practical examples included!

Watch Video πŸ“ΉοΈ

πŸ‘‹ Kindness is contagious

Explore a trove of insights in this engaging article, celebrated within our welcoming DEV Community. Developers from every background are invited to join and enhance our shared wisdom.

A genuine "thank you" can truly uplift someone’s day. Feel free to express your gratitude in the comments below!

On DEV, our collective exchange of knowledge lightens the road ahead and strengthens our community bonds. Found something valuable here? A small thank you to the author can make a big difference.

Okay