Green Wall

Take a picture 📸 of your GitHub contributions, then share it!

Green Wall is a powerful web tool designed to help you easily review your GitHub contributions over the years. With this tool, you can generate an image of your contributions, which you can save and share with others.

How it works

This project uses the GitHub GraphQL API to fetch data and uses Next.js API Routes to send requests. You can read this file to learn how we handle your data.

Usage

you can embed a live preview of your contributions into your github README or website by using the below examples

HTML

<img src="https://green-wall.leoku.dev/api/og/share/[YOUR USERNAME]" alt="My contributions">

Markdown

![](https://green-wall.leoku.dev/api/og/share/[YOUR USERNAME])

which would give a preview similar to this

Credits

• Inspired by: GitHub Contributions Chart Generator.
• Framework: Next.js.
• Font: Rubik by Google Fonts.
• Icons: heroicons.

Running Locally

This project uses the GitHub API to fetch data, so you need a personal access token for authentication. For more information, see "Creating a personal access token ."

After creating personal access token, create a file named .env.local at the root of the project, then paste the token into it.

# .env.local

# The format should be: GITHUB_ACCESS_TOKEN="[YOUR TOKEN]"

# Example:
GITHUB_ACCESS_TOKEN="ghp_eQ81YcyFcwVjdJwBgUj150VPnxBf1N48Sep7"

Then you are ready to run pnpm dev to develop.