Skip to main content

​
Quickstart

Get started with GitScope and analyze your first GitHub profile in under 2 minutes. This guide will walk you through accessing the live demo and performing your first profile analysis.

​
Try the live demo

The fastest way to experience GitScope is through the live demo hosted on GitHub Pages.
1

Open the demo

Visit the live demo at:https://david-andino.github.io/github-dashboard/You’ll see the main search interface with a hero section and suggested usernames.
2

Search for a GitHub user

You have two options to start analyzing:Option 1: Use quick suggestionsClick any of the pre-populated username chips below the search bar:
  • torvalds — Creator of Linux and Git
  • gvanrossum — Creator of Python
  • sindresorhus — Popular open source developer
  • tj — Creator of Express.js
  • yyx990803 — Creator of Vue.js
Option 2: Search any GitHub userType a GitHub username in the search field and click Analizar (or press Enter).
// The search is handled by App.jsx:35-57
const search = useCallback(async (username) => {
  setLoading(true)
  try {
    const [userData, reposData] = await Promise.all([
      getUser(username),
      getRepos(username, 1, PER_PAGE),
    ])
    setUser(userData)
    setRepos(reposData)
  } catch (e) {
    setError(e.message)
  } finally {
    setLoading(false)
  }
}, [getUser, getRepos])
3

Explore the profile

Once the search completes, you’ll see:Left sidebar:
  • User card with avatar, bio, and stats (repos, followers, following, gists)
  • Language distribution donut chart
Main content area:
  • Grid of repositories (30 per page)
  • Filter by minimum stars
  • Sort by recent updates, stars, or forks
  • Pagination controls
The user profile and first page of repositories load simultaneously using Promise.all() for optimal performance.
4

View repository commits

Click on any repository card in the grid to expand the commit panel below.You’ll see:
  • 10 most recent commits with author, message, and SHA
  • Repository metadata (stars, forks, open issues, size, license)
  • Direct link to view the repository on GitHub
Click the same repository again (or the × button) to close the panel.
// Commit fetching from useGitHub.js:53-55
const getCommits = useCallback((owner, repo, per_page = 10) =>
  request(`/repos/${owner}/${repo}/commits`, { per_page }),
  [request])
5

Try filtering and sorting

Experiment with the repository controls:Filter by stars:
  • Enter a minimum star count (e.g., 100)
  • Only repositories with ≥ that number of stars will display
Sort repositories:
  • Recientes — Most recently updated (default)
  • ⭐ Stars — Highest star count first
  • 🍴 Forks — Most forked repositories first
// Client-side filtering and sorting from RepoList.jsx:33-39
const filtered = repos
  .filter(r => r.stargazers_count >= minStars)
  .sort((a, b) => {
    if (sort === 'stars') return b.stargazers_count - a.stargazers_count
    if (sort === 'forks') return b.forks_count - a.forks_count
    return new Date(b.updated_at) - new Date(a.updated_at)
  })
6

Toggle dark mode

Click the 🌙/☀️ icon in the top-right header to switch between dark and light themes.Your preference is saved in localStorage and persists across sessions.

​
Understanding the interface

​
Header components

The header displays three key elements:
  1. GitScope logo — Returns to search when clicked
  2. Rate limit indicator — Shows remaining API requests
  3. Token API button — Add GitHub token to increase rate limit
  4. Theme toggle — Switch between dark/light mode

​
Rate limit indicator

Pay attention to the rate limit badge color:
  • 🟢 Green — More than 50% of requests remaining
  • 🟡 Yellow — Between 20-50% remaining
  • 🔴 Red — Less than 20% remaining (time to add a token!)
Without authentication, you’re limited to 60 requests per hour by the GitHub API. Once exhausted, you’ll see a rate limit error.

​
Adding a GitHub token (optional)

To unlock higher rate limits:
1

Generate a token

Visit GitHub Settings → Personal Access TokensRequired scopes:
  • ✅ public_repo
  • ✅ read:user
Generate the token and copy it (starts with ghp_)
2

Add to GitScope

  1. Click the Token API button in the header
  2. Paste your token in the modal
  3. Click Guardar (Save)
Your rate limit immediately increases from 60 to 5,000 requests/hour.
Your token is stored only in your browser’s localStorage — it’s never sent to any server except GitHub’s API.

​
What’s happening under the hood?

GitScope uses four main GitHub REST API endpoints:
EndpointPurposeCalled when
GET /users/:usernameFetch user profileSearch submitted
GET /users/:username/reposList repositoriesSearch submitted, page changed
GET /repos/:owner/:repo/commitsGet commit historyRepository clicked
GET /repos/:owner/:repo/languagesGet language statsLanguage chart rendered
// All API calls from useGitHub.js:47-59
const getUser = useCallback((username) => 
  request(`/users/${username}`), [request])

const getRepos = useCallback((username, page = 1, per_page = 30) =>
  request(`/users/${username}/repos`, 
    { page, per_page, sort: 'updated', direction: 'desc' }),
  [request])

const getCommits = useCallback((owner, repo, per_page = 10) =>
  request(`/repos/${owner}/${repo}/commits`, { per_page }),
  [request])

const getLanguages = useCallback((owner, repo) =>
  request(`/repos/${owner}/${repo}/languages`),
  [request])

​
Common issues

​
User not found

If you see “Usuario no encontrado”, the username doesn’t exist or the account is private.

​
Rate limit exceeded

If you see “Rate limit exceeded”:
  1. Wait for the rate limit to reset (shown in the header)
  2. Add a GitHub Personal Access Token to increase your limit to 5,000/hour

​
No repositories showing

If a user has no public repositories, the repository grid will be empty. Try searching for a different user.

​
Next steps

Install locally

Run GitScope on your own machine for development

GitHub API

Learn about all GitHub API endpoints used

Build docs developers (and LLMs) love

Get started for freeTalk to us