Introduction
Today, I’m going to show you how to build your own command line application and deploy it as a NPM package. I will be using npm, Node.js, and Clack to build this.
You can even try it out for yourself right now by running:
npx cli-trivia-game
Here's a sneak peek of the trivia game (full .gif of play-through + answers at the bottom):
Getting Started
1) Navigate to your command line and run:
npm init -y
This is going to initialize a new project, and the -y flag automatically answers “yes” to all the prompts. This generates a package.json file that has all the default settings without having to manually provide details.
2) Next, you will run:
npm -install @clack/prompts
Once you do that, you’ll have a framework that lets you create things like spinners, multi-selection, and self-validated cancel logic all with just a few lines of code.
3) Let’s leverage Clack’s built-in setup logic. To create an intro, I’m going to call intro here and pass in this string that let’s the player know they’re about to play in a trivia quiz that tests their CLI knowledge.
4) Since this is a trivia quiz, let’s ask some questions. First, I’ll create a class called Question that requires a question string, an array of potential answers, and the index of the correct answer.
5) Then, I’m going to create 10 question objects using this class template.
6) Now that we’ve got our questions, how do we display them on the command line? We’re going to use Clack’s select component to do this. All I have to do is pass in the question, initial value, and options, and voila.
7) To make it feel a little more sophisticated, I’m going to add a spinner after the user answers just so they have time to process the UI and makes the program feel intelligent.
8) And then to tie up, I’m going to declare a global variable called totalCorrect which will increment when the player answers a question correctly.
9) At the end, I’ll add some logic to display different outros based on how many questions the player got correct.
And the best part - we’re going to publish this as an npm package so that every developer in the world can download on their machines if they choose to. It’s actually pretty easy.
1) Go to package.json and add “bin”:”./index.js”
2) Run npm login
3) Run npm publish
4) Then run npx cli-trivia-game
3 Min Youtube version (if you prefer that) 👇
Done! But before you start this project for yourself, take into consideration that Clack is really lacking in the documentation. Anything fairly complex, you won’t benefit from the pre-made components of clack/prompts. Here's a list of other CLI frameworks you can use instead.
Check out the full code for the project here:
https://github.com/theRubberDuckiee/cli-trivia-game
Conclusion
Just like that, you have made and published your first CLI application! Congrats :)
And, if you'd like to know the answers to all 10 questions in my trivia game, here you go:
Top comments (13)
Random question to seed conversation since comment section is lonely:
What's a topic you feel like you should know about but you don't?
Typescript, hahaha, I'd been using JavaScript for years.
Worked in Typescript for a few years as webdev at Microsoft and DoorDash - it was pretty easy for me to learn and a very useful tool!
Wow, how cool. Yeah, I guess it isn't hard, that's one of the things I'd been procrastinating for quite some time. I'm maybe a bit purist, I used to be more of the kind... “I don't need a large setup to get the things done, most projects don't need to be so complicated” (I'm still a bit like that), but with tools such as Svelte I have changed my mind a bit about that.
What about you.... what is that thing you haven't learned, but you feel you should?
Well... Svelte. LOL.
I work as a developer advocate for Warp, which is why I post so many blogs around the terminal. So there are a lot of things around the command line I wish I knew better. Vim keyboard shortcuts, Neovim setup with Lua, third-party applications like fzf or exa, etc.
Well, Svelte is dead easy to learn, in a few hours you can learn the fundamentals. For me, now it feels like one of those tools I couldn't live without.
Hahaha, oh my. You are really taking it serious, well, for sure you are productive, kudos.
By the way, I tried your trivia game... I didn't search the answers at Google, and I didn't use ChatGPT... I only looked at the source code... does that counts as cheating?
haha YES. THAT'S CHEATING!
But clever cheating.
I actually like the topic of building node CLIs 👍 something more sophisticated would be interesting, like generating some code, or processing file system data — kinda dev tools and utilities — we all need some custom stuff from time to time
Hey! Yeah I've been wanting to do more complicated stuff. I'm been looking more into creating art on the command line though, more so than what you mentioned. We'll see where my ADHD brain takes me though - stay posted.
firebase
Same
Best devrel , your content is always 👌
awww... that really means a lot <3