DEV Community

Cover image for Build CLI Quiz App with nodeJs
Khyati Baria
Khyati Baria

Posted on

Build CLI Quiz App with nodeJs

In this blog, we will build a Food Fact CLI Quiz App in JavaScript. We will use repl.it to write a program. We will use two npm modules

  1. readlineSync -It will have a conversation with the user via a console.
  2. chalk: It is used for Terminal string styling and adding colors.

Planning our CLI App:

  1. We ask the user to enter name
  2. Then we welcome the user
  3. We will display the Rules of the game to user
  4. Then we let users to play game
  5. Check that user has entered the correct answer
  6. We will print the current score of a user on every given answer
  7. We will display the total score of users at the end of the game

Now Let’s Start the Build We need to take the user input through the console so we will require npm package: readline-sync. Firstly we will install npm packages.

var readlineSync = require('readline-sync');
const chalk = require('chalk');
Enter fullscreen mode Exit fullscreen mode

Using the above code in repl.it will automatically install these packages for us.

Asking user their Name

var userName= readlineSync.question( ("Please Enter Your Name?"));
Enter fullscreen mode Exit fullscreen mode

We need a variable to store the name of the user so we will create a variable called userName.

Welcome Message for User

console.log('WELCOME '+userName+ 'FOOD FACT QUIZ \n');
Enter fullscreen mode Exit fullscreen mode

Now we need to display customize welcome message for every new user. For welcome message we need name of user with some greeting message. So we use string concatenation to show welcome message.

Showing Rules of the game to the user

  console.log ("RULES OF THE GAME ARE SIMPLE"); 
  console.log ("1). All the QUESTIONS are COMPULSORY");
  console.log ("2). If you answer RIGHT you score 2 Points");
  console.log ("3). If you answer WRONG you Lose 1 Point");
  console.log ("----------LET’S START THE GAME------------");
Enter fullscreen mode Exit fullscreen mode

Use inbuilt JavaScript function console.log() to print Rules on screen.

Adding Question of the quiz

To store Questions of the quiz we create an array of an objects. And to ask question to user we use readlineSync.question(question).

var quesBank=[
  { question: `
  What country is renowned for chocolate?
  a) Finland
  b) Belgium
  c) Argentina\n`,
    answer: "b"
  },
  { question: `
  Which of these was called "food of the gods" in ancient India?
  a) Yogurt
  b) Potato
  c) Bread\n`,
    answer: "a"
  },
  { question: `
  Which is the most stolen food in the world?
  a) Candy
  b) Cheese
  c) Chips\n`,
    answer: "b"
  },
  { question: `
  One food that all races eat is what?
  a) Chocolate
  b) Bread
  c) Cheese\n`,
    answer: "b"
  }];
Enter fullscreen mode Exit fullscreen mode

We need a function which traverse throughout array of objects and displays the each question to user. So we need a for loop to access all elements inside an array.

function play(){
   for(var i=0; i<quesBank.length;i++){
     var currentItem= quesBank[i];
     check(currentItem.question, currentItem.answer)
   } }
Enter fullscreen mode Exit fullscreen mode

Check if user answer is correct

function check(question, answer)
{
   var userAns=readlineSync.question(question);

   if( userAns.toUpperCase() === answer.toUpperCase())
   {
    console.log();
    console.log(chalk.green.italic.bold("Your are Right!!!!!"));
    console.log();
    score=score+2;
   } else{
    console.log();
    console.log(chalk.red.italic.bold("Your are Wrong!!!!!"));
    console.log();
    score=score-1;
  } 
  console.log(chalk.bgWhite.blue.bold("Your Total Score is:",score));
}

Enter fullscreen mode Exit fullscreen mode

We create a function that compares user answer with correct answers in array of objects. We need a variable to store the user answer. So we create variable userAns to store user answer. Here we use branching if user answer is correct we increment score of user by 2 and if answer is wrong user score is decrease by 1. Once all questions are answered by user we will display Total score at the end of quiz Game.

So final program will look like this

const chalk = require('chalk');
var readlineSync = require('readline-sync');
var score=0;

function Welcome()
{
var userName= readlineSync.question("Please Enter Your Name?");
console.log(chalk.yellowBright.bold('WELCOME'+userName+'FOOD FACT QUIZ \n'));
console.log(chalk.cyanBright.bold("RULES OF THE GAME ARE SIMPLE")); 
console.log(chalk.cyanBright("1). All the QUESTIONS are COMPULSORY"));
console.log(chalk.cyanBright("2). If you answer RIGHT you score 2 Points"));
console.log(chalk.cyanBright("3). If you answer WRONG you Lose 1 Point"));
console.log(chalk.yellowBright.bold("-------LETS START THE GAME------"));
}

var quesBank=[
  {
    question: `
    What country is renowned for chocolate?
    a) Finland
    b) Belgium
    c) Argentina\n`,
        answer: "b"
  },
  {
    question: `
    Which of these was called "food of the gods" in ancient India?
    a) Yogurt
    b) Potato
    c) Bread\n`,
        answer: "a"
  },
  {
    question: `
    Which is the most stolen food in the world?
    a) Candy
    b) Cheese
    c) Chips\n`,
        answer: "b"
  },
  {
    question: `
    One food that all races eat is what?
    a) Chocolate
    b) Bread
    c) Cheese\n`,
        answer: "b"
  }];

function check(question, answer)
{
   var userAns=readlineSync.question(question);
   if( userAns.toUpperCase() === answer.toUpperCase())
   {
    console.log(chalk.green.italic.bold("Your are Right!!!!!"));
    score=score+2;
   } else{
    console.log(chalk.red.italic.bold("Your are Wrong!!!!!"));
    score=score-1;
  } 
  console.log(chalk.bgWhite.blue.bold("Your Score is:",score));
  console.log();
  console.log(chalk.yellowBright.bold("------------------------------")); 
  console.log();
}

function play(){
   for(var i=0; i<quesBank.length;i++){
     var currentItem= quesBank[i];
     check(currentItem.question, currentItem.answer)
   }
}

Welcome();
play();

Enter fullscreen mode Exit fullscreen mode

Thanks for reading. If you like this articles, consider following me.

Top comments (0)