How to create table handlebars with nodejs - html

Question

Guys I have the following json server.js:
const express = require("express")
const app = express()
const http = require('http').Server(app);
const sqlite3 = require('sqlite3').verbose();
const db = new sqlite3.Database('./conta.sql')
const handlebars = require("express-handlebars");
const bodyParser = require("body-parser")
app.use(express.static(__dirname + "/css/"));
app.use(bodyParser.urlencoded({extended:true}));
app.engine('handlebars', handlebars({defaultLayout:false}));
app.set('view engine', 'handlebars');
function getallusers(req,res) {
try{
data = [
{
id: 1,
nome: 'Ronnica Hardison',
data: '2021-09-31 04-54-00',
email: 'test#gmail.com',
nome_bonus: 'John Watson',
cod_bonus: 'piwi20k9'
},
{
id: 2,
nome: 'Kellie Jean Abernethy',
data: '2021-09-31 23-50-00',
email: 'gobirob190#mnqlm.com',
nome_bonus: 'Ámelia Barton',
cod_bonus: 'piwiki20k9'
}
]
res.render(__dirname + "/index.handlebars")
}
catch(err){
console.log("\x1b[31m Problema ao carregar as informações do banco de dados!",err);
}
}
app.get('/', function(req,res){
getallusers(req,res)
});
http.listen(8083,() => {
console.log("Servidor escutando na porta 8083");
});
index.handlebars:
<center>
<div class="table">
<table cellspacing="0">
<thead>
<tr class="indices">
<th>Nome</th>
<th>Email</th>
<th>Data de Criação</th>
<th>Convidada de</th>
<th>Codico usado</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
{{data here}}
</tr>
</tbody>
</table>
</div>
</center>
So guys... what I needed to do was render the json data in the table, how can I do this? What I need is to create <th> tags according to the json information, but this has to be dynamic. The json information can be different, ie it's dynamic, so how can I render this?

Answer 1

Try this:
in your server.js pass data to index.handlebars file:
res.render(__dirname + "/index.handlebars",{data})
and in index.handlebars use this
<center>
<div class="table">
<table cellspacing="0">
<thead>
<tr class="indices">
<th>Nome</th>
<th>Email</th>
<th>Data de Criação</th>
<th>Convidada de</th>
<th>Codico usado</th>
<th>Status</th>
</tr>
</thead>
<tbody>
{{#each data}}
<tr>
<th scope="row">{{this.id}}</th>
<td>{{this.nome}}</td>
<td>{{this.email}}</td>
<td>{{this.nome_bonus}}</td>
<td>{{this.cod_bonus}}</td>
</tr>
{{/each}}
</tbody>
</table>
</div>
</center>