Business Cards in the Terminal

October 23, 2020

I was looking around GitHub the other day, and I found this awesome idea by Anmol Singh on creating a NPX card to introduce himself. I thought it was a cool idea, so I made one for myself too.

I really liked the idea, and I wanted to share it with y'all too.

Getting Started

Let's create a new project. Skip ahead if you're familiar with this.

mkdir npx-card
cd npx-card

yarn init -y

yarn add boxen chalk clear open inquirer

I wrote this article back in October 2020 when Node.js didn't have an integrated watch mode. You can now just use the --watch flag.

Let's also install nodemon as a development dependency to automatically restart our Node application.

yarn add nodemon -D

Let's go to the scripts section in our package.json and setup nodemon

"scripts": {
  "dev": "nodemon card.js"

Building our card

Start by running the development server

yarn dev

Import your modules, clear the terminal before showing the card.

const boxen = require('boxen')
const chalk = require('chalk')
const inquirer = require('inquirer')
const clear = require('clear')
const open = require('open')


Creating the Prompt

Let's create a new prompt using Inquirer along with an array of objects which contain our questions.

const prompt = inquirer.createPromptModule()

const questions = [
    type: 'list',
    name: 'action',
    message: 'What do you want to do?',
    choices: [
        // Use chalk to style headers
        name: `Toss an ${chalk.bold('email')}?`,
        value: () => {
            '\nLooking forward to hearing your message and replying to you!\n'
        name: 'Exit',
        value: () => {
          console.log('Good bye, have a nice day!\n')

Adding Data

Let's create a new object, this time with data about us. I had to play around with this for a little bit to get the spacing right, having properly centred the fields.

const data = {
  name:'                     Harsh Singh'),
  handle: chalk.white('@harshhhdev'),
  fact: chalk.hex('#B10000')('I speak three languages'),
  twitter: chalk.hex('#00A1D9')(''),
  github: chalk.hex('#787878')(''),
  dev: chalk.hex('#330093')(''),
  dribbble: chalk.hex('#AB009C')(''),
  website: chalk.hex('#00AB9E')(''),
  npx: chalk.hex('#A1AB00')('npx harsh'),

  labelFact: chalk.hex('#FF6262').bold('          Fun Fact:'),
  labelTwitter: chalk.hex('#629DFF').bold('        Twitter:'),
  labelGitHub: chalk.hex('#9E9E9E').bold('         GitHub:'),
  labelDev: chalk.hex('#A959FF').bold('           Dev:'),
  labelDribbble: chalk.hex('#F259FF').bold('       Dribbble:'),
  labelWebsite: chalk.hex('#59FFC8').bold('        Website:'),
  labelCard: chalk.hex('#FFF976').bold('                  Card:'),

Let's create our card using those values.

const me = boxen(
    `${data.labelFact}  ${data.fact}`,
    `${data.labelTwitter}  ${data.twitter}`,
    `${data.labelGitHub}  ${data.github}`,
    `${data.labelDev}  ${}`,
    `${data.labelDribbble}  ${data.dribbble}`,
    `${data.labelWebsite}  ${}`,
    `${data.labelCard}  ${data.npx}`,
    `${chalk.bold("Hi there! I'm Harsh, I'm a passionate MERN stack ")}`,
    `${chalk.bold('developer and web designer from India, and have a ')}`,
    `${chalk.bold('hobby for creating beautiful, cool, and responsive ')}`,
    `${chalk.bold('web apps. Toss me an email if you want to collab!')}`,
    margin: 1,
    float: 'center',
    padding: 1,
    borderStyle: 'single',
    borderColor: 'blue',


Let's make sure that we handle the prompt properly.

prompt(questions).then((answer) => answer.action())


Start by creating an account on NPM and connect your user account.

yarn adduser
# npm adduser

Now, patch the version:

git commit -a -m "message"

yarn version
# npm version patch

yarn publish
# npm publish

If that worked, try to executing it using npx.

# npx harsh-dev
npx your-pkg


That's it, hopefully you enjoyed this cool little idea. If you end up making a card, I'd love to see it. Reach out at @harshhhdev.

Enjoy your day — until next time 👋