GitHub Profile Finder

A profile analyzer built with React, TypeScript, and Tailwind CSS that searches, analyzes, and rates GitHub developer accounts.

Overview

This application acts as a visualization dashboard for public GitHub accounts. By parsing user data, repository information, language statistics, and contribution metrics, it compiles a detailed profile view with data visualizations, a custom rating score, and archetype analysis.

Why This Project Exists

This project was built to solve a simple problem: the standard GitHub profile is good for viewing a user's pinboard, but it does not make it easy to assess a developer's technical distribution, overall community engagement, or profile completeness in one place. The goal of this application is to compile public repository statistics into an intuitive dashboard to quickly evaluate a developer's primary languages, key contributions, and overall platform activity.

Features

• User search with debounced inputs to prevent API rate limit spamming
• Profile dashboard featuring user metadata, contribution metrics, and key profile indicators
• Developer scoring algorithm rating accounts from 0-100 based on weighted metrics
• Interactive repository language analysis and charts
• Responsive layout supporting desktop, tablet, and mobile displays
• Theme switching with persistent preference storage
• Clean skeleton states for asynchronous network requests

Tech Stack

Technology	Purpose
React	Frontend UI Library
TypeScript	Type safety and reliable code contracts
Vite	Frontend build tool and development server
Tailwind CSS	Utility-first styling framework
Recharts	SVG chart generation and rendering
TanStack Query	Data fetching, caching, and state synchronization

Project Structure

src/
├── components/
│   ├── Background/
│   │   └── MeshGradientBackground.tsx
│   ├── Charts/
│   │   └── LanguageChart.tsx
│   ├── DesignSystem/
│   │   ├── Alert.tsx
│   │   ├── Badge.tsx
│   │   ├── Button.tsx
│   │   ├── Card.tsx
│   │   ├── Toast.tsx
│   │   └── index.ts
│   ├── Profile/
│   │   ├── DeveloperScoreCard.tsx
│   │   ├── RepositoryAnalytics.tsx
│   │   └── RepositoryCard.tsx
│   ├── Search/
│   │   └── SearchInput.tsx
│   └── UI/
│       └── Skeleton.tsx
├── hooks/
│   ├── useGitHubData.ts
│   └── useTheme.ts
├── services/
│   └── githubApi.ts
├── styles/
│   ├── components.css
│   └── design-tokens.css
├── types/
│   └── index.ts
├── utils/
│   ├── developerInsights.ts
│   └── githubHelpers.ts
├── App.tsx
├── main.tsx
└── vite-env.d.ts

The application is structured into domain-specific directories to keep components, hooks, services, and utilities close to their functional scope. The design-tokens stylesheet acts as the single source of truth for color palettes, spacing, typography scales, transitions, and z-index ordering across light and dark modes.

Installation

Clone the repository:

git clone https://github.com/monogutsy/github-profile-finder.git

Change directory into the project root:

cd github-profile-finder

Install all dependencies:

npm install

Development

Start the development server:

npm run dev

Build the application for production:

npm run build

Preview the production build locally:

npm run preview

Environment Variables

By default, the application runs on unauthenticated GitHub API requests, which are limited to 60 requests per hour per IP. To increase this limit to 5,000 requests per hour, configure a Personal Access Token (PAT).

Create a .env file in the root directory:

VITE_GITHUB_TOKEN=your_github_personal_access_token

Developer Scoring System

The scoring system calculates a weighted value from 0 to 100 based on public profile properties:

• Followers (0 - 25 points): 1 point awarded per 10 followers, maxing out at 250 followers.
• Repositories (0 - 20 points): 1 point awarded per public repository, maxing out at 20 repositories.
• Stars (0 - 25 points): 2.5 points per star received on public repositories, maxing out at 10 stars.
• Forks (0 - 15 points): 3 points per repository fork, maxing out at 5 forks.
• Profile Completeness (0 - 15 points): 3 points awarded for each completed profile field (avatar, bio, location, company, and personal website).

Skill Tiers

• Beginner: 0 - 30 points
• Intermediate: 31 - 60 points
• Advanced: 61 - 85 points
• Expert: 86 - 100 points

Known Limitations

• High API reliance: Unauthenticated requests are highly prone to rate limits during peak usage.
• Repository size limits: The analysis is restricted to the top 100 public repositories based on push activity due to API payload boundaries.
• No historical analytics: Data is computed on demand and is not cached across sessions.

Future Improvements

• Add local database storage to persist past queries and comparison profiles.
• Integrate user-to-user comparison tools to analyze development patterns between two developers side-by-side.
• Add support for commit-level analysis to evaluate code push frequency and contribution timeframes.
• Implement automated export features for developer profile reports in PDF or image formats.

Contributing

Contributions are welcome. Please open an issue to discuss proposed changes before submitting a pull request to ensure the modifications align with the roadmap and architecture of the project.

License

This project is licensed under the MIT License. See the LICENSE file for details.