We are now going to take the exact same project we defined earlier, but add a graphical interface on top of it. Inside the JavaScript file we saw previously, you just need to add one line, as follows:
app.use(express.static('public'));Now we are going to code two files: one HTML file with the interface, and another file containing scripts that will make the link between the interface and the server. Let's start with the HTML file:
<head> <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <script src="js/script.js"></script> <link rel="stylesheet" href="css/style.css"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head>
As you can see, inside the <...