The Bootstrap framework has a Modal component that serves a similar purpose to Modal dialogs in desktop applications. You pop up the Modal, it prevents interaction with other parts of the web page, you enter stuff into fields in the Modal, and then click a button to make it close.
This new segment of code replaces the existing segment defining the Edit and Delete buttons, in views/noteview.hbs:
{{#if user}}{{#if notekey}} <div class="row"><div class="col-xs-12"> <div class="btn-group"> <a class="btn btn-outline-dark" href="/notes/destroy?key= {{notekey}}" role="button">Delete</a> <a class="btn btn-outline-dark" href="/notes/edit?key= {{notekey}}" role="button">Edit</a> <button type="button" class="btn ...