Create the HTML - Amazon SDK for JavaScript
Services or capabilities described in Amazon Web Services documentation might vary by Region. To see the differences applicable to the China Regions, see Getting Started with Amazon Web Services in China.

The Amazon SDK for JavaScript V3 API Reference Guide describes in detail all the API operations for the Amazon SDK for JavaScript version 3 (V3).

Starting October 1, 2022, Amazon SDK for JavaScript (v3) will end support for Internet Explorer 11 (IE 11). For details, see Announcing the end of support for Internet Explorer 11 in the Amazon SDK for JavaScript (v3).

Create the HTML

This topic is part of a tutorial about building an app that transcribes and displays voice messages for authenticated users. To start at the beginning of the tutorial, see Build a transcription app with authenticated users.

Create an index.html file, and copy and paste the content below into it. The page features panel of buttons for recording voice messages, and a table displaying the current user’s previously transcribed messages. The script tag at the end of the body element invokes the main.js, which contain all the browser script for the app. You create the main.js using Webpack, as described in the following section of this tutorial.

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>title</title> <link rel="stylesheet" type="text/css" href="recorder.css"> <style> table, td { border: 1px solid black; } </style> </head> <body> <h2>Record</h2> <p> <button id="record" onclick="startRecord()"></button> <button id="stopRecord" disabled onclick="stopRecord()">Stop</button> <p id="demo" style="visibility: hidden;"></p> </p> <p> <audio id="recordedAudio"></audio> </p> <h2>My transcriptions</h2> <table id="myTable1" style ="width:678px;"> </table> <table id="myTable" style ="width:678px;"> <tr> <td style = "font-weight:bold">Time created</td> <td style = "font-weight:bold">Transciption</td> <td style = "font-weight:bold">Download</td> <td style = "font-weight:bold">Delete</td> </tr> </table> <script type="text/javascript" src="./main.js"></script> </body> </html>

This code example is available here on GitHub.