JS Application to fetch github user data - View Demo

"I continue to push on... Longing to Master the Ways of JavaScript Ninjutsu"

An simple, well-commented, learning oriented, single page JS demo Project to practice ES6 programming concepts, using fetch API, Primses, async await (all that good stuff) and github API. Built with:

• HTML
• Vanilla JS - ES6
• Bootswatch CSS - A Bootstrap based CSS Theming tool
• Github API - You're all there yo.
• Awesomeness - Strictly for the love of coding Mehn!

• Finds Users on Keyup Event
• Manipulates DOM to display User Data
• Links Back to User Page
• Retreives and displays latest User Repos
• Link Back to Repos and Home Pages (if available)

• ES6 Classes
• Fetch API
• Promises
• Async Await
• Iternary and Template Strings
• DOM Manipulation & Traversal
• Event Handing & Delegation
• Creating & Appending Elements
• A lil Bootstrap 4 syntax n Alerts

I think its So Cool that you can make multiple requests using async await in a single function. (a method actually, of the Github() made in the github.js file). Much better (and imho more reliable than ES5 callbacks/Ajax):

async getUser(user) {
    const profileResponse = await fetch(
      `https://api.github.com/users/${user}?client_id=${
        this.client_id
      }&client_secret=${this.client_secret}`
    );

    const repoResponse = await fetch(
      `https://api.github.com/users/${user}/repos?per_page=${
        this.repos_count
      }&sort=${this.repos_sort}&client_id=${this.client_id}&client_secret=${
        this.client_secret
      }`
    );

    const profile = await profileResponse.json();
    const repos = await repoResponse.json();

    return {
      profile,
      repos
    };
  }

Also, perhaps I wasn't doing it properly, but I had issues with using the iternary operator within the string literal, for the Homepage Links (in the repo object forEach() loop). So a work around I did was this:

let a = `<a href='${repo.homepage}' target="_blank"> View Demo </a>`,
  b = `Null`;
`Homepage: ${repo.homepage ? a : b}`; // in the loop

Also (Just a thought), this is probably how Sourcer.io Works... pretty cool.

Naaa... This is just about done and dusted far as I'm concerned, lol ^-^

Contributions are highly welcome. Feel free to fork, clone, make pull requests, report issues etc.

• Many thanks to @bradtraversy for his awesome courses - i will not fail you sensei
• Thanks to @torvalds For Making the world a better place
• And To anyone reading this... You're awesome!

That being said

Adieu, Till I push again... I must return to my meditations on the Ways of JS Ninjustu