index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, minimum-scale=1.0">

  <script
        src="https://code.jquery.com/jquery-3.5.1.min.js"
        integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
        crossorigin="anonymous"></script>
</head>
<body>
  <table class="data">
  </table>
  
  <script>
    $.getJSON('/api/files' , function( data ) {
      if ('error' in data)
        return $('.data').text('no files');
      for (const file of data) {

        let td = '<td><a href="/api/file'+file.path+'">'+file.path+'</a> (size: '+file.size+')</td>'
        let tr = '<tr>' + td + '</tr>'
        $('.data').append(tr)
      }
    });
  </script>
</body>
</html>