DEV Community

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

Posted on

πŸš€ 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. πŸš€

Top comments (0)