GitHub Profile README Site

Deploy your GitHub profile README.md as a static Astro site with profile photo, tagline and icon links using Actions.

Create Repository

Create a copy (recommended) of this repository by clicking here, or a fork by clicking here.

If you don't have a GitHub profile, name the copy the same as your username and edit the README.md to make it.

An example can be found here: r055a/r055a

Configure Site

To display your profile content in the site, edit the ./site.config.json file with at least the following:

• GitHub username: githubUsername
• GitHub profile display name: displayName
• GitHub profile site URL: siteUrl
• GitHub profile repo name: basePath

{
  "githubUsername": "",
  "displayName": "",
  "description": "",
  "tagline": "",
  "siteUrl": "",
  "basePath": "",
  "language": "",
  "themeCol": "",
  "links": {}
}

Each entry in the links {key: value} object maps a platform/icon ID (key) to its destination URL (value).

Example

{
  "githubUsername": "r055a",
  "displayName": "Adam Ross",
  "description": "A static Astro site for GitHub profile README markdown content",
  "tagline": "Just a guy who likes ☕",
  "siteUrl": "https://r055a.github.io",
  "basePath": "/r055a",
  "language": "en",
  "themeCol": "",
  "links": {
    "buymeacoffee": "https://example.com",
    "dev.to": "https://example.com",
    "email": "[email protected]",
    "github": "https://example.com",
    "gitlab": "https://example.com",
    "googleScholar": "https://example.com",
    "huggingface": "https://example.com",
    "kaggle": "https://example.com",
    "ko-fi": "https://example.com",
    "linkedin": "https://example.com",
    "mastodon": "https://example.com",
    "medium": "https://example.com",
    "orcid": "https://example.com",
    "researchgate": "https://example.com",
    "stackoverflow": "https://example.com",
    "website": "https://example.com",
    "x": "https://example.com",
    "youtube": "https://example.com"
  }
}

A visual of the example when deployed:

Supports dark and light mode.

Local Development

Install

npm install

Development

npm run dev

Build

npm run build

npm run preview

Contribute

Before making a Pull Request for an existing/created Issue, verify the branch passes:

npm run quality:fix