I have made a NodeJS REST API, which returns JSON data of questions I have a static JS file which does DOM manipulations on client side to show different questions in an order, it takes questions from the questions array.
I am able to get data from the API on the pug render engine and to pass it on the main page, but unable to find a way to pass that data as a variable to the JS file which does DOM manipulation on the page.
I have thought of an approach to fetch data from API in the static js file itself but it doesn't seem to be an effective approach because request to API is done in the render engine itself.
My viewsConroller:
My pug template is able to access the questions:
but I can't find a way to send questions array as a variable to the static JS file which does the DOM manipulation.
I think fetching the json data in your static js file would be the best thing. Other than that you could do this:
let questions = document.querySelectorAll('.overview-box__text').map((el) => JSON.parse(el.innerText));