How to Build a Textual Progress Bar for CLI and Terminal Apps

I find textual interfaces extremely interesting and I'm trying to figure out how some common components can be creates

this is the time of a progress bar

to create a textual progress bar we need to understand two simple concepts

• you can control where the cursor Is programmatically

• There are ANSI escapes code to cancel the entire screen or the current line (\r)

One way to achieve this is to start a loop and on every iteration print the special escape code \r that will clear the line at the cursor position and then print one of the following to simulate a progress

[.        ]
[..       ]
[...      ]
[....     ]
[.....    ]
[......   ]
[.......  ]
[........ ]
[.........]

In this example, I'll be using Node.js

async function main() {
  /* using 20 to make the progress bar length 20 charactes, multiplying by 5 below to arrive to 100 */

  for (let i = 0; i  setTimeout(res, ms))
}

This was relatively simple but with somecustom colorscan have a huge impact in the UX of a tool, especially it takes some time to complete and there is no other feedback for the user that everything is going ok

full code available on the repo ongithub