front end display data frmo database nodejs html

  1. Install required Node.js modules:
npm install express mysql ejs
  1. Create a Node.js server (app.js):
const express = require('express');
const mysql = require('mysql');
const app = express();
const port = 3000;

const connection = mysql.createConnection({
  host: 'your_database_host',
  user: 'your_database_user',
  password: 'your_database_password',
  database: 'your_database_name'
});

connection.connect();

app.set('view engine', 'ejs');

app.get('/', (req, res) => {
  connection.query('SELECT * FROM your_table_name', (error, results) => {
    if (error) throw error;
    res.render('index', { data: results });
  });
});

app.listen(port, () => {
  console.log(`Server is running on port ${port}`);
});
  1. Create an HTML file (views/index.ejs):
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Data Display</title>
</head>
<body>
  <h1>Data from Database</h1>
  <ul>
    <% data.forEach(item => { %>
      <li><%= item.column_name %></li>
    <% }); %>
  </ul>
</body>
</html>
  1. Run the Node.js server:
node app.js
  1. Access the data display page in a web browser at http://localhost:3000/.