Skip to content

Instantly share code, notes, and snippets.

@abdulhadad
Created September 2, 2024 10:07
Show Gist options
  • Save abdulhadad/e834252183367eabd7e8dcd3e7e8f50f to your computer and use it in GitHub Desktop.
Save abdulhadad/e834252183367eabd7e8dcd3e7e8f50f to your computer and use it in GitHub Desktop.
github_user_info.html
<!doctype html>
<body>
<style>
.alert {
padding: 15px;
border: 1px solid #d6e9c6;
border-radius: 4px;
color: #3c763d;
background-color: #dff0d8;
}
.message {
padding: 15px;
border: 1px solid #c6e1e9;
border-radius: 4px;
color: #453c76;
background-color: #d8e5f0;
}
</style>
<div class="input" id="input">
<input type="text" onchange="printGithubUserInfo(this.value)" />
<input type="button" value="Github User Info" />
</div>
<div class="alert" id="div">
</div>
<div class="message" id="divmessage">
</div>
<script>
function printGithubUserInfo(username) {
fetch(`https://api.github.com/users/${username}`)
.then(res => res.json())
.then(response => {
alertResponse( 'Success:' + JSON.stringify(response) )
addMessage(response.name)
})
.catch(error => {
alertResponse('Error:' + error )
addMessage(error.message)
});
}
function alertResponse(result) {
div.innerHTML = "<strong>Github API Response</strong> <br/>" + result;
}
function addMessage(message) {
divmessage.innerHTML = message;
}
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment