DEV Community

Cover image for Scotium: A Github Powers platform with 34 tools built-in, Discovery Engine and much more...
Hannan Naveed
Hannan Naveed

Posted on

Scotium: A Github Powers platform with 34 tools built-in, Discovery Engine and much more...

#devchallenge #weekendchallenge

DEV Weekend Challenge: Passion Edition Submission

This is a submission for Weekend Challenge: Passion Edition

scotium

Scotium: GitHub Power-User Platform — 34 Analysis Tools, Discovery Engine, and Code Editor

I built a GitHub intelligence platform with 34 analysis tools, a discovery engine, code editor, and README component generator—all without leaving one dashboard.

Powered by Google AI

Scotium - Discover Trending GitHub Repos

Find trending open source projects and repositories on GitHub.

favicon scotium.pages.dev

What I Built

Scotium is a comprehensive GitHub intelligence platform that transforms raw GitHub data into actionable insights. Here's what's included:

34 Built-in Analysis Tools:

  • Repository Analysis (12 tools): Health Score, Stars, Last Commit, PR Merge Speed, Issue Health, Bus Factor, Releases, Fork Activity, License, Repo Size, Tech Stack, Dependencies
  • Profile Insights (8 tools): Total Stars, Total Forks, Follower Ratio, Account Age, Repositories, Organizations, Top Repo, Top Languages
  • Discovery + Dashboard (10 tools): Rising Stars, Undiscovered Gems, Most Forked, Active Giants, Repo Health Table, Stale Repos Alert, Open PR Tracker, Star Leaders, Repo vs Repo comparison, User vs User comparison

Core Features:

  • 🔍 Discovery Engine — Find Rising Stars (new repos gaining traction), Undiscovered Gems (active but low-star repos), Most Forked projects, and recently active popular repos
  • ⚖️ Comparison Tool — Side-by-side analysis of repositories or users with visual progress bars showing wins on stars, forks, contributors, and more
  • ✏️ Code Editor — Browse any repository's files, edit code with syntax highlighting, create branches, commit changes, and open Pull Requests—all without leaving Scotium
  • 🧩 README Components — 30 ready-to-copy components for your GitHub README (stats cards, streak counters, trophies, activity graphs, badges)
  • 📊 Dashboard — Personal GitHub command center with all your repos (including private), stale repo tracking, open PR monitoring, and star rankings
  • 🔎 Smart Search — Cmd+K search modal with live results as you type

The entire platform is a client-side React SPA that communicates directly with GitHub's REST API—no backend infrastructure required.

Demo

Live Site: https://scotium.pages.dev

Try it out:

  1. Discover repos → Visit https://scotium.pages.dev/explore and filter by language or time range
  2. Analyze any repo → Go to any repo detail page (e.g., https://scotium.pages.dev/facebook/react) and see 12 analysis tools
  3. Compare projects → Visit https://scotium.pages.dev/compare to compare two repos or developers side-by-side
  4. Generate README badges → Check https://scotium.pages.dev/components and copy any of 30 components to your profile
  5. Edit code → Click the editor icon on any repo to browse files, edit code, create branches, and open PRs
  6. Track your projects → Sign in with GitHub to access https://scotium.pages.dev/dashboard for personal repo stats and alerts

Code

GitHub Repository: github.com/truehannan/scotium-dev

Tech Stack:

  • React 18 + Vite 5 — Component-based UI with lightning-fast builds
  • Tailwind CSS + Framer Motion — Utility-first styling with smooth animations
  • CodeMirror — Syntax-highlighted code editor
  • TanStack Query — Efficient data fetching and caching
  • React Router — Client-side routing
  • GitHub REST API — All data fetching
  • Cloudflare Pages — Serverless hosting with zero config
  • Cloudflare D1 — SQLite caching layer for performance

Project Structure:

scotium/
├── src/
│   ├── components/        # React components (analysis cards, dashboard, editor)
│   ├── pages/            # Route pages (/, /explore, /compare, /dashboard, etc.)
│   ├── lib/              # Utilities (GitHub API, analysis logic, formatting)
│   ├── hooks/            # Custom React hooks (useQuery, useGitHub, etc.)
│   └── App.jsx           # Main app routing
├── vite.config.js        # Vite build config
├── tailwind.config.js    # Tailwind theming
└── wrangler.toml         # Cloudflare Pages config
Enter fullscreen mode Exit fullscreen mode

Key Implementation Details:

  • GitHub OAuth Integration: No password database—pure GitHub OAuth for private repo access and authenticated code edits
  • Analysis Algorithms:
    • Health Score = composite of commit frequency, PR merge time, issue health, and dependency freshness
    • Bus Factor = core contributor count from commit history
    • PR Merge Speed = median time from open → merge across all PRs
    • Tech Stack = parsed from package.json, requirements.txt, go.mod, etc.
  • Performance: TanStack Query caches all API responses; D1 stores analysis results to reduce GitHub API calls
  • Rate Limiting: Handles GitHub's 5K request/hour free tier limit gracefully

All code is open source. Star on GitHub if you find it useful!

How I Built It

Planning & Research (Days 1-2)

I started by analyzing what GitHub doesn't surface natively. While GitHub shows basic repo stats, it doesn't answer questions like:

  • "Is this project healthy or abandoned?"
  • "How long do PRs actually stay open?"
  • "What's the real contributor bus factor?"
  • "Are there undiscovered gems in my language that are actually active?"

I researched competing platforms (GitStar, OSSInsight, Trendshift) to understand what matters, then designed 34 metrics across three categories.

Architecture & Setup (Days 3-4)

  • Scaffolded React 18 + Vite 5 for fast iteration
  • Integrated GitHub OAuth for private repo access
  • Set up TanStack Query for efficient data fetching with built-in caching
  • Configured Cloudflare Pages + D1 for serverless hosting and SQLite caching
  • Designed reusable component system for analysis tools

Repository Analysis Tools (Days 5-7)

Built 12 tools that analyze any public or private GitHub repository:

Core metrics:

  • Health Score — Composite score (1-10) based on commit frequency, PR merge speed, issue resolution rate, and dependency freshness
  • Bus Factor — Number of core contributors; how vulnerable is the project if one person leaves?
  • PR Merge Speed — Median time from PR open to merge; signals maintainer responsiveness
  • Issue Health — Ratio of resolved to open issues; are maintainers keeping up?
  • Tech Stack Detection — Automatically parse package.json, requirements.txt, go.mod, Cargo.toml, etc.
  • Fork Activity — Are forks actually being maintained or abandoned?
  • Release Tracking — How often are stable versions released?
  • License Detection — What's the legal status of this project?

Plus: Stars, Last Commit, Repo Size, Dependencies.

Profile Insights (Days 8-9)

Built 8 tools for understanding any GitHub developer:

  • Total Stars + Forks aggregated across all their repos
  • Follower Ratio (real influence metric)
  • Account Age and activity level
  • Top Repo and Top Languages they use
  • Organization memberships

Discovery Engine (Days 10-11)

Implemented four discovery modes:

  1. Rising Stars — Repos gaining traction (new but with momentum)
  2. Undiscovered Gems — Active repos with surprisingly few stars (hidden treasures)
  3. Most Forked — Projects people are actually building on top of
  4. Active Giants — Popular repos that are still actively maintained

Each mode sorts GitHub's 100M+ repos by different signals to surface what matters.

Dashboard & Comparison (Day 12)

  • Personal Dashboard — GitHub OAuth sign-in shows your repos, stale repos (no commits in 30+ days), open PRs, and star rankings
  • Comparison Tool — Side-by-side comparison of two repos or two users; visual progress bars show who wins on each metric

Code Editor & Components (Day 13)

  • Built-in Code Editor — Browse any repo's file tree, edit code with syntax highlighting via CodeMirror, create branches, commit changes, and open PRs—all without leaving Scotium
  • README Components — 30 pre-built copyable components (stats cards, streak counters, trophies, activity graphs, badges) so devs can instantly level up their profile READMEs

Search & Optimization (Day 14)

  • Cmd+K search modal for instant repo/user lookup
  • Performance optimization via aggressive query caching and D1 SQLite caching
  • Mobile responsiveness refinement
  • Framer Motion animations for polish

Deployment

Deployed to Cloudflare Pages (zero-config, auto-deploy from Git). D1 caching layer reduces GitHub API calls to stay well within the free tier limits.

Why Scotium Matters

GitHub is the home of the open-source universe, but its native tools don't answer the questions developers actually ask:

  • "Is this project actually maintained or a ghost town?" → Health Score tells you instantly
  • "How long will my PR sit here?" → PR Merge Speed shows the real tempo
  • "Are there cool projects in my stack that nobody knows about?" → Undiscovered Gems surfaces them
  • "Can I trust this codebase?" → Bus Factor reveals hidden dependency on key people
  • "What's the real engagement with this project?" → 12 analysis tools give you the full picture

Scotium fills that gap. It's built for power users, indie developers, and anyone who wants to make smarter decisions about which projects to contribute to, learn from, or depend on.

Stats

  • 34 analysis tools across 3 categories
  • 10 pages covering discovery, analysis, comparison, editing, and components
  • 100% client-side — No backend infrastructure needed
  • GitHub API-native — Direct integration with GitHub's REST API
  • Free to use — No sign-up required for public data; GitHub OAuth for private repos

Try It Now

Website: https://scotium.pages.dev

GitHub: github.com/truehannan/scotium-dev

Built by: Hannan

Top comments (0)