Skip to content

Instantly share code, notes, and snippets.

@MirzaChilman
Created August 6, 2018 11:50
Show Gist options
  • Save MirzaChilman/f4c82fec80b38820b0aba8e05346545c to your computer and use it in GitHub Desktop.
Save MirzaChilman/f4c82fec80b38820b0aba8e05346545c to your computer and use it in GitHub Desktop.
JS Bin // source http://jsbin.com/cecekowuja
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<link href="http://extjs.cachefly.net/ext-3.1.0/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/ext-core/3.1.0/ext-core.min.js"></script>
<div id="App"></div>
<script id="jsbin-javascript">
async function getData()
{
//await the response of the fetch call
let response = await fetch('http://jsonplaceholder.typicode.com/posts');
//proceed once the first promise is resolved.
let data = await response.json()
//proceed only when the second promise is resolved
return data;
}
//call getData function
getData()
.then(data => data.map(datum => {
const node = document.createElement('li')
const textNode = document.createTextNode(datum.title)
node.appendChild(textNode)
document.getElementById('App').appendChild(node)
}));//log the data
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<link href="//extjs.cachefly.net/ext-3.1.0/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/ext-core/3.1.0/ext-core.min.js"><\/script>
<div id="App"></div>
</body>
</html></script>
<script id="jsbin-source-javascript" type="text/javascript"> async function getData()
{
//await the response of the fetch call
let response = await fetch('http://jsonplaceholder.typicode.com/posts');
//proceed once the first promise is resolved.
let data = await response.json()
//proceed only when the second promise is resolved
return data;
}
//call getData function
getData()
.then(data => data.map(datum => {
const node = document.createElement('li')
const textNode = document.createTextNode(datum.title)
node.appendChild(textNode)
document.getElementById('App').appendChild(node)
}));//log the data</script></body>
</html>
async function getData()
{
//await the response of the fetch call
let response = await fetch('http://jsonplaceholder.typicode.com/posts');
//proceed once the first promise is resolved.
let data = await response.json()
//proceed only when the second promise is resolved
return data;
}
//call getData function
getData()
.then(data => data.map(datum => {
const node = document.createElement('li')
const textNode = document.createTextNode(datum.title)
node.appendChild(textNode)
document.getElementById('App').appendChild(node)
}));//log the data
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment