Project goal: I am trying to create a language converter app. It will take a string from one textarea, convert all string values via a stored dictionary on a DB, and append this converted string into a second textarea. All of this conversion will be happening on the same index.ejs page (no refreshing/redirecting/etc.).

What works: I am able to POST the string data from my first textarea to index.ejs and retrieve all matching dictionary entries in my app.js. The "/" path (shown below) is my index.ejs file. The values are stored in an array called "convertArrOfArrs". I am using Mongoose to do this on my app.js. I have prevented the page from infinite refreshing (due to my POST request) via res.status(204).send().

What doesn't work: I can't figure out how to send this array of converted values ("convertArrOfArrs") to my index.ejs. I think res.render() doesn't work since I need to stay on the same page.

This is my app.js which deals with the POST request.

app.post("/", async (req, res) => {
  // entire textarea string
  const txtareaStr = await req.body.phoneticTxtArea;
  // puts string into an array, lowercases it, and removes whitespaces
  const txtareaArr = txtareaStr.trim().toLowerCase().split(" ");

  const convertArrOfArrs = [];
  try {
    for (let i = 0; i < txtareaArr.length; i++) {
      // this retrieves the word object based on the database match
      let word = await Word.findOne({ phonetic: txtareaArr[i] });
      // stores array of conversions for each word (ARRAY TO BE SENT!!!)
      convertArrOfArrs.push(word.converted);
    }
  } catch (e) {
    console.log("ERROR", e);
  }
  // prevents page from infinite refreshing after POST request
  res.status(204).send();
});

Please let me know if any other details are needed!