← Back to Examples

GitHub Profile Viewer

Search for any GitHub user and view their profile and repositories

@
Try: octocat, torvalds, gaearon, addyosmani

Fetching profile...

Error!
How This Works - Source Code
// GitHub API is public and doesn't require authentication for basic requests
const GITHUB_API = 'https://api.github.com';

// 1. Fetch user profile
async function fetchUser(username) {
    const response = await fetch(`${GITHUB_API}/users/${username}`);
    if (!response.ok) throw new Error('User not found');
    return response.json();
}

// 2. Fetch user repositories (sorted by recently updated)
async function fetchRepos(username) {
    const response = await fetch(
        `${GITHUB_API}/users/${username}/repos?sort=updated&per_page=6`
    );
    return response.json();
}

// 3. Display the data in the UI
async function searchUser(username) {
    try {
        showLoading();
        const [user, repos] = await Promise.all([
            fetchUser(username),
            fetchRepos(username)
        ]);
        displayProfile(user);
        displayRepos(repos);
    } catch (error) {
        showError(error.message);
    }
}

// Note: Promise.all() fetches user AND repos in parallel for speed!

← Back to Examples