如何将动态 HTML 连接到 MySQL

Question

First, I'd like to say this is part of a university undergrad project, so my knowledge will be limited.

I have a MySQL database set up with data and I want to click a button in HTML that queries the database and updates HTML table elements with returned data. I have done A LOT of reading and it always returns to nodejs which I have absolute beginner experience with. I have code set up to query my database with nodeJS which works fine, however, I see absolutely no solution to update the HTML dynamically and I refuse to believe it is not in some way possible. I have read about expressJS templating but this dynamic updating of data is expected to occur hourly from the database (the database is a dummy stand-in for a real-life one) and the expressJS templates are not a good fit at all.

How can I return nodeJS data to a HTML page without serving a new page each time? perhaps return server-side JS data to client-side JS? how does nodeJS allow the HTML to then load client-side JS files? I am unable to get a PHP install working so it's unfortunately not an option. I am open to any alternatives that allows HTML to MySQL connections.

Thanks

Answer 1

I'm not 100% sure what you have set up or what your level of knowledge is, but I hope I can help.

Sounds like you have your server running and querying your DB just fine, so that's good. Now you need to route that to your frontend. This is where expressJS usually comes in. It's a backend framework for creating API's in node. Think of it as a middleman. You send a request to your API, and your API makes a request to the DB and gives you what you want.

To make the request from the frontend, you can use the fetch() API. It's an asynchronous function used to make https requests and receive data. You then need to use that data to dynamically populate your html. Since it's done with javascript, it won't force a reload of the page either.

Feel free to ask questions and hopefully we can get you pointed in the right direction at the very least.