Tip
Live Demo: You can see an example of a finished portfolio generated by this tool here: https://oss-portfolio-template.netlify.app/.
This repository is a template that automatically generates a curated portfolio of your Open Source Software (OSS) contributions. It tracks Pull Requests (PRs), issues, code reviews, co-authored commits, and collaborations, providing a detailed, organized record of your impact in the community.
The content updates automatically via a Node.js script and a GitHub Actions workflow.
Choose how you want to start your project:
-
Option A: Click Use this template at the top of this repository.
-
Option B: Click Fork to create a linked copy, then clone it to your local machine:
git clone https://github.com/adiati98/oss-portfolio-template.git
Ensure Node.js is installed and run:
npm ciOpen scripts/config/config.js and and update your GitHub handle.
// scripts/config/config.js
// Change this to your GitHub handle
const GITHUB_USERNAME = 'your-github-username';To generate your files locally, you need a Personal Access Token (PAT) with public_repo scope.
-
Create
.envfileCopy the example environment file:
cp .env.example .env
-
Add your token
Open
.envand replaceyour_token_herewith your GitHub PAT. -
Initialize and run the project
Before your very first run, clear any template example data, then start the script:
npm run clean npm start
GitHub Actions remain disabled by default in repositories generated from a template.
-
Navigate to the Actions tab in your repository and click "I understand my workflows, go ahead and enable them."
-
Select the Update Contributions workflow and click Run workflow to execute the first sync manually.
-
The workflow uses the built-in
GITHUB_TOKEN. Once the manual run finishes, daily and monthly schedules will take over automatically.
After the script runs successfully, you can find your generated portfolio in the following locations:
- GitHub Markdown Portfolio: Navigate to
contributions/markdown-generated/README.md. This is the main "front page" of your logs on GitHub. The detailed breakdowns for every three months are stored incontributions/markdown-generated/YYYY/. - Static Website Files: If you are hosting a website, the ready-to-use HTML files are in
contributions/html-generated/.
The script generates optional HTML files for a more visual showcase.
- All HTML files are generated in
contributions/html-generated/. - Configure your host: Link your repository to a service like Vercel, Netlify, or GitHub Pages.
- Set Publish Directory: Ensure your host points to the
contributions/html-generated/directory.
Note
Deployment Setup: This project automatically pushes data updates. If your hosting provider requires a manual Build Hook (like Netlify) to trigger a build, you must write and set up your specific deployment action at the bottom of the .github/workflows/update-contributions.yml file.
If you choose to host the static website, you can change the theme by updating the COLOR_PALETTE in scripts/config/constants.js. The system automatically updates backgrounds, borders, and even the favicon to match your chosen hex codes.
const COLOR_PALETTE = {
primary: '#4338CA', // Your main brand color
success: '#10b981', // Color for Open items
merged: '#8b5cf6', // Color for Merged items
error: '#ef4444', // Color for Closed items
};An automation pipeline fetches, processes, and presents your GitHub activity using a Node.js script and a GitHub Actions workflow.
The script follows a clear pipeline: fetch data, process it, and generate output files.
- GitHub API (v3): The script communicates with the GitHub REST API to collect five distinct types of community activity: Merged PRs, Issues, Reviewed PRs, Co-authored PRs, and Collaborations.
- Auto-Discovery Logic: The system automatically scans your entire contribution history to determine your "Active Since" date.
- Smart Syncing: The script performs either a fast incremental update (fetching only recent activity) or a full sync to ensure it captures every historical contribution.
- Deduplication: The script resolves the latest status for every contribution and deduplicates items that might appear in multiple search queries.
- Caching: The script maintains
pr-cache.jsonandcommit-cache.jsonto dramatically speed up future runs by skipping already processed pull request data and co-author commit history.
- Markdown Reports: The script generates detailed quarterly logs (e.g.,
2024/Q1-2024.md) and a summaryREADME.mdin thecontributions/markdown-generatedfolder. These include visual progress bars and a list of your primary focus projects. - HTML Reports (Optional): The script generates a Tailwind-styled landing page and interactive dashboards in the
contributions/html-generatedfolder. These serve as a professional static website.
The "All-Time Impact" dashboard automatically assigns a persona title based on your contribution data patterns. This helps viewers quickly understand your primary impact style within the open source ecosystem.
| Priority | Persona Title | Focus |
|---|---|---|
| 1 | Community Mentor | Code review and technical guidance. |
| 2 | Core Contributor | Feature development and bug fixing. |
| 3 | Project Architect | Problem identification and feature planning. |
| 4 | Collaborative Partner | Pair programming and co-authoring code. |
| 5 | Ecosystem Partner | Technical discussion and community engagement. |
The workflow file in the .github/workflows folder defines the automation schedule:
- Monthly Sync: A full sync that removes old caches to force a fresh verification of all historical data.
- Daily Update: A lightweight incremental run to capture activity from the last 24 hours.
The workflow uses the repository's built-in GITHUB_TOKEN for authentication and automatically commits updated reports back to your branch.