In today's project, you'll be asked to not only write code to make live Ajax requests, but also write some HTML and CSS to bring a mockup to life.
- Start with the mockup below, and using the GitHub API, pull in the info to build yourself a virtual business card.
- Everything but the headers ("The Basics", "The Story") and the bio will be pulled in via GitHub's API. If it's not there on your GitHub profile, then add it.
- Make sure to pull your avatar in with GitHub and make it a circle.
Since there are no starter files provided, you'll need to create your own HTML, CSS, and JavaScript files and link them together properly. Before you start writing any JavaScript, we suggest you spend a few moments reading through the GitHub API docs listed below to get familiar with how you can obtain the data.
Once you have a decent grasp on that, start setting up your Ajax calls and setting up your callback functions to work with the data you retrieve. Insomnia will be helpful to do this as you get started.
- Show your repositories, organizations, and any other interesting data you can request from GitHub that you'd like to add.
- Read up on the hCard microformat and make sure your page conforms to the hCard standard.
- Full Screen Mockup
- GitHub User API - change
usernamein this url to your own username - GitHub API Docs
- Sawtooth banners with CSS
- Getting Started with Insomnia -- Download the Core app, not the Designer app.