Skip to content

Instantly share code, notes, and snippets.

@kieranbarker

kieranbarker/index.html

Created March 20, 2022 19:19
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Embed
What would you like to do?
Learn more about clone URLs
Download ZIP
A simple demo of the top-level await keyword in vanilla JS.
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Users</title>
</head>
<body>
<h1>Users</h1>
<p>Check the JavaScript console.</p>
<script src="index.js" type="module"></script>
</body>
</html>
Raw
index.js
import users from "./users.js";
if (users instanceof Error) {
console.error(users);
} else {
console.log(users);
}
Raw
users.js
const API = "https://jsonplaceholder.typicode.com/users";
let users;
async function getJSON(response) {
if (response.ok) {
const data = await response.json();
return Promise.resolve(data);
}
const { status, statusText } = response;
const error = new Error(`${status} ${statusText}`);
return Promise.reject(error);
}
try {
const response = await fetch(API);
users = await getJSON(response);
} catch (error) {
users = error;
}
export default users;
@kieranbarker
Copy link
Author

JavaScript modules won’t run if you try to open an HTML file in the browser using the file:// origin. You need to run a local web server on your computer.

Here's a list of one-liners for starting up a web server.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment