Skip to main content

Set Environment Variables

This guide explains how to set the PROJECT_NAME and ORG_NAME environment variables needed for the contributors section to work properly.

Why These Variables Are Needed

The contributors component uses these environment variables to:

  • Generate the correct GitHub repository URL
  • Display contributor avatars from contrib.rocks
  • Link to your project's contributors page

Setting Environment Variables

macOS and Linux (including GitHub Codespaces)

Temporary (Current Session Only)

Open your terminal and run:

export ORG_NAME="your-github-username"
export PROJECT_NAME="your-repository-name"

For example:

export ORG_NAME="facebook"
export PROJECT_NAME="docusaurus"

Permanent (All Sessions)

Add the exports to your shell profile file:

For Bash (~/.bashrc or ~/.bash_profile):

echo 'export ORG_NAME="your-github-username"' >> ~/.bashrc
echo 'export PROJECT_NAME="your-repository-name"' >> ~/.bashrc
source ~/.bashrc

For Zsh (~/.zshrc):

echo 'export ORG_NAME="your-github-username"' >> ~/.zshrc
echo 'export PROJECT_NAME="your-repository-name"' >> ~/.zshrc
source ~/.zshrc

Windows

Command Prompt (Temporary)

set ORG_NAME=your-github-username
set PROJECT_NAME=your-repository-name

Command Prompt (Permanent)

setx ORG_NAME "your-github-username"
setx PROJECT_NAME "your-repository-name"

PowerShell (Temporary)

$env:ORG_NAME="your-github-username"
$env:PROJECT_NAME="your-repository-name"

PowerShell (Permanent)

[Environment]::SetEnvironmentVariable("ORG_NAME", "your-github-username", "User")
[Environment]::SetEnvironmentVariable("PROJECT_NAME", "your-repository-name", "User")

Windows GUI Method

  1. Right-click "This PC" or "Computer" and select "Properties"
  2. Click "Advanced system settings"
  3. Click "Environment Variables"
  4. Under "User variables", click "New"
  5. Add ORG_NAME with your GitHub username as the value
  6. Click "New" again and add PROJECT_NAME with your repository name as the value
  7. Click "OK" to save

Verifying Your Setup

After setting the variables, verify they're correctly set:

macOS/Linux/GitHub Codespaces:

echo $ORG_NAME
echo $PROJECT_NAME

Windows Command Prompt:

echo %ORG_NAME%
echo %PROJECT_NAME%

Windows PowerShell:

echo $env:ORG_NAME
echo $env:PROJECT_NAME

Development vs Production

For Local Development

The environment variables you set locally will be used when running:

cd documentation
npm start

or

yarn start

For GitHub Actions (Production)

The deployment workflow automatically sets these variables using:

  • ORG_NAME: Extracted from GITHUB_REPOSITORY (the part before the /)
  • PROJECT_NAME: Extracted from GITHUB_REPOSITORY (the part after the /)

No manual configuration is needed for GitHub Actions deployment.

Troubleshooting

Contributors Image Not Loading

If you see "Contributors Not Available":

  1. Check your variables are set correctly using the verification commands above
  2. Restart your development server after setting environment variables
  3. Make sure your repository is public - contrib.rocks requires public repositories
  4. Verify the repository exists and has contributors

Common Issues

  • Variables not persisting: Make sure you added them to the correct shell profile file
  • Case sensitivity: Environment variable names are case-sensitive
  • Spaces in values: Wrap values with spaces in quotes
  • New terminal required: Open a new terminal window after setting permanent variables

Example

For the repository https://github.com/facebook/docusaurus:

  • ORG_NAME should be facebook
  • PROJECT_NAME should be docusaurus

The contributors component will then display avatars from:

https://contrib.rocks/image?repo=facebook/docusaurus