<!DOCTYPE html> <html> <head> <title>Hello WebSocket</title> <meta charset="UTF-8"> <link href="/node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> <script src="/node_modules/jquery/dist/jquery.min.js"></script> <script src="/node_modules/sockjs-client/dist/sockjs.min.js"></script> <script src="/node_modules/stomp-websocket/lib/stomp.min.js"></script> <script src="/app.js"></script> <style> #main-content { margin-top: 2em; } button, input { margin-left: 1em; } .row { padding-bottom: 1em; } </style> </head> <body> <noscript><h2 style="color: #ff0000">Seems your browser doesn't support Javascript! Websocket relies on Javascript being enabled. Please enable Javascript and reload this page!</h2></noscript> <div id="main-content" class="container"> <div class="row"> <div class="col-md-6"> <form class="form-inline"> <div class="form-group"> <label for="connect">WebSocket connection:</label> <button id="connect" class="btn btn-success" type="submit">Connect</button> <button id="disconnect" class="btn btn-danger" type="submit" disabled="disabled">Disconnect </button> </div> </form> </div> <div class="col-md-6"> <form class="form-inline"> <div class="form-group"> <label for="name">What is your name?</label> <input type="text" id="name" class="form-control" placeholder="Your name here..."> </div> <button id="send" class="btn btn-primary" type="submit">Send</button> </form> </div> </div> <div class="row"> <div class="col-md-12"> <table id="conversation" class="table table-striped"> <thead> <tr> <th>Greetings</th> </tr> </thead> <tbody id="greetings"> </tbody> </table> </div> </div> </div> </body> </html>