'Getting node.js output(from Mysql) to Javascript(client-side)

Title says it all I have a freelance project( first one and I promised it would be done by now) and I still can't figure it out. I just want the Name column from my MySQL database (that is being shown on my node.js when I console.log the results) into a JavaScript file. ( I feel like this is a simple solution staring me in the face and I can't figure it out)

**CLIENT SIDE** 
var results = ("server.js")
var nodes = new vis.DataSet([
  {label: "Pop"},
  {label: "Alternative"},
  {label: "Rock"},
  {label: "Jazz"},
  {label: "Hits"},
  {label: "Dance"},
  {label: "Metal"},
  {label: "Experimental"},
  {label: "Rap"},
  {label: "Electronic"},
]);
var edges = new vis.DataSet();

var container = document.getElementById('bubbles');
var data = {
  nodes: nodes,
  edges: edges
};

var options = {
  nodes: {borderWidth:0,shape:"circle",color:{background:'#F92C55', highlight:{background:'#F92C55', border: '#F92C55'}},font:{color:'#fff'}},
  physics: {
    stabilization: false,
    minVelocity:  0.01,
    solver: "repulsion",
    repulsion: {
      nodeDistance: 40
     
    }
  }
};
var network = new vis.Network(container, data, options);



// Events
network.on("click", function(e) {
  if (e.nodes.length) {
    var node = nodes.get(e.nodes[0]);
    // Do something
    nodes.update(node);
  }
});

container.on("mouse-wheel", function(event) {
  // prevents zooming with the mouse-wheel event
  event.stopPropagation();
});
console.log (results.name)

**SERVER SIDE** 
var mysql = require('mysql');
var express = require('express');
const path = require('path')
// var index = require("index.html")
app = express();
app.get('/',(request,response)=>{
    ;
    response.sendFile(path.join(__dirname, '/index.html'));
    app.use(express.static((__dirname)));
  });
  
  //Binding the server to a port(3000)
  app.listen(3000,()=>console.log("express server started at port 3000"));

var con = mysql.createConnection({
  host: "localhost",
  user: "Nate",
  password: "Black1022!",
  database: "new_schema"
});

con.connect(function(err) {
  if (err) throw err;
  console.log("Connected!");
  con.query("SELECT Name FROM test", function (err, result) {
    if (err) throw err;
    console.log(result);
    module.exports = result; 

});

});

#bubbles {
  position: absolute;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
}

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>CodePen - Apple Music Style Bubble UI</title>
  <link rel="stylesheet" type="text/css" href="./style.css">

</head>
<body>
<!-- partial:index.partial.html -->
<div id="bubbles"></div>
<!-- partial -->
  <script src='https://cdnjs.cloudflare.com/ajax/libs/vis/4.16.1/vis.min.js'></script>
  <script
  src="https://code.jquery.com/jquery-3.6.0.js"
  integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
  crossorigin="anonymous"></script>
  <script  src="./script.js"></script>

</body>
</html>

I would just remake the whole thing using MVC architecture but I feel like that would take too much time and then I feel like I would be at a loss again anyways.

edit: The "label" part will be replace by the names in the database. Thanks for the help in advance!!

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'Getting node.js output(from Mysql) to Javascript(client-side)

Sources

Related Questions