New: 97,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Gh Action

by live-codes in live-codes/livecodes

Use the "Preview in LiveCodes" GitHub Action to generate preview playground links for pull request code changes.

MITAuto-check passedDevOps & Cloud

Install Gh Action

skills CLI
$ npx skills add live-codes/livecodes --skill gh-action -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install live-codes/livecodes gh-action --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/live-codes/livecodes.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/livecodes/gh-action .claude/skills/gh-action && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
gh-action
GitHub stars
1.5k
Token cost
~1.8k tokens
SKILL.md length
437 words
Files
1
Skills in repo
15
Repo updated
First seen
Licence
MIT

At a glance

Use the "Preview in LiveCodes" GitHub Action to generate preview playground links for pull request code changes.

  • Works in 3 steps: Deploy to Preview URL (Recommended) → Use CDN Mirroring GitHub → Data URLs (Small Files Only)
  • Tasks that involve CI/CD
  • SKILL.md covers How It Works, Setup, Action Inputs and Action Outputs, plus 6 more sections
  • Calls git and npm; reaches livecodes.io and github.com; needs GITHUB_TOKEN

What it does

Gh Action is an agent skill from live-codes/livecodes. Use the "Preview in LiveCodes" GitHub Action to generate preview playground links for pull request code changes. Automates playground creation and PR comments.

Its SKILL.md is about 1.8k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in DevOps & Cloud, covering CI/CD and Pull requests. It works with GitHub. The repository describes itself as: A Code Playground That Just Works! The licence is MIT.

When your agent uses it

  • Tasks that involve CI/CD
  • Tasks that involve Pull requests

Example prompts

  • “Preview in LiveCodes”
  • “/gh-action”

Requirements

  • Node.js
  • A credential in GITHUB_TOKEN

Workflow steps

3 steps, taken from the step headings in SKILL.md.

  1. Deploy to Preview URL (Recommended)
  2. Use CDN Mirroring GitHub
  3. Data URLs (Small Files Only)

What it can do on your machine

Read from SKILL.md and the folder at commit 5754e89. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • git
    • npm

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • livecodes.io
    • github.com
    • cdn.jsdelivr.net

    Also links to:

    • securitylab.github.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names these keys or tokens, usually read from environment variables:

    • GITHUB_TOKEN

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Gh Action loads about 1.8k tokens when it runs. Until then it costs about 43 tokens; SKILL.md has 437 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~43
When it runs · the whole SKILL.md, loaded when a task matches
~1.8k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from live-codes/livecodes at commit 5754e89, republished under its MIT licence (© live-codes). 437 words, ~1,827 tokens.

Download SKILL.mdSave it as .claude/skills/gh-action/SKILL.md (or your agent's skills folder).
name
gh-action
description
Use the "Preview in LiveCodes" GitHub Action to generate preview playground links for pull request code changes. Automates playground creation and PR comments.
metadata.type
composition
metadata.library
livecodes
metadata.library_version
0.13.0
sources
live-codes/preview-in-livecodes:README.md, live-codes/livecodes:docs/docs/gh-action.mdx

LiveCodes — GitHub Action: Preview in LiveCodes

The Preview in LiveCodes GitHub Action generates preview links to LiveCodes playgrounds for code changes in pull requests and posts them as PR comments.

Use case: Library authors can preview changes in the playground before merging PRs.

How It Works

  1. PR is created or updated
  2. Action optionally installs dependencies and builds the project
  3. Action scans .livecodes/ folder for playground configurations
  4. Generates playground URLs with your new code
  5. Posts comment with preview links to the PR

Setup

Two Required Workflow Files

The action requires two workflow files that must be merged to the default branch first.

1. Trigger workflow .github/workflows/livecodes-preview.yml:

yaml
name: livecodes

on: [pull_request]

jobs:
  build_and_prepare:
    runs-on: ubuntu-latest
    name: Generate Playgrounds
    steps:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Build and generate
        uses: live-codes/preview-in-livecodes@v1
        with:
          # Optional: install-command: "npm install"
          # Optional: build-command: "npm run build"
          # Optional: base-url: "https://{{LC::REF}}.my-project.pages.dev"

2. Comment workflow .github/workflows/livecodes-post-comment.yml:

yaml
name: comment

on:
  workflow_run:
    workflows: ['livecodes']
    types:
      - completed

jobs:
  upload:
    runs-on: ubuntu-latest
    permissions:
      pull-requests: write
    if: >
      github.event.workflow_run.event == 'pull_request' &&
      github.event.workflow_run.conclusion == 'success'
    steps:
      - uses: live-codes/pr-comment-from-artifact@v1
        with:
          GITHUB_TOKEN: ${{ github.token }}

Two separate workflows are needed because each runs in a different security context. See GitHub security article for details.

Action Inputs

InputRequiredDescription
install-commandNoInstall command (e.g., npm install)
build-commandNoBuild command (e.g., npm run build)
base-urlNoBase URL for deployed assets. Supports dynamic values.
artifactNoArtifact name (default: pr)
GITHUB_TOKENNoGitHub token (default: ${{ github.token }})

Action Outputs

OutputDescription
messageMarkdown message with preview links for PR comment

Configure Playgrounds

Create JSON files in .livecodes/ folder. Each file becomes a playground link.

Example Configure Project JSON

.livecodes/hello-world.json:

json
{
  "title": "JavaScript Starter",
  "markup": {
    "language": "html",
    "content": "<h1>Hello, World!</h1>"
  },
  "script": {
    "language": "javascript",
    "content": "import { demo } from 'my-lib';\n\ndemo();"
  },
  "imports": {
    "my-lib": "{{LC::TO_DATA_URL(./index.js)}}"
  }
}

The title property becomes the playground name in the message. If omitted, filename is used.

Dynamic Values

Use these placeholders in project JSON and base-url:

PlaceholderDescription
{{LC::REF}}Branch or tag name of PR head
{{LC::SHA}}Full commit SHA
{{LC::SHORT_SHA}}Short SHA (first 7 characters)
{{LC::PR}}Pull request number
{{LC::REPO}}Repository name
Show full SKILL.md (178 more words)Show less
File Placeholders (project JSON only)
PlaceholderDescription
{{LC::TO_URL(./file.js)}}URL of file with base-url prepended
{{LC::TO_DATA_URL(./file.js)}}File converted to data URL (for small files)

Using Newly Added Code in Playgrounds

Three strategies to make PR code available to playgrounds:

Use Cloudflare Pages or Netlify for automatic preview deployments.

yaml
# workflow
base-url: 'https://{{LC::REF}}.my-project.pages.dev'

In project JSON:

json
{
  "imports": {
    "my-lib": "{{LC::TO_URL(./dist/index.js)}}"
  }
}
2. Use CDN Mirroring GitHub

Link to files via jsDelivr or similar:

yaml
# workflow
base-url: 'https://cdn.jsdelivr.net/gh/{{LC::REPO}}@{{LC::SHA}}/'
3. Data URLs (Small Files Only)

Encode files directly. Stored at dpaste.com (limit: 1M chars, expires after 365 days).

json
{
  "imports": {
    "my-lib": "{{LC::TO_DATA_URL(./index.js)}}"
  }
}

Common Mistakes

HIGH Workflow files not on default branch

The workflow files must be merged to the default branch (e.g., main) before the action can be triggered by PRs.

Wrong:

yaml
# Creating PR with workflow files
# Action won't run until merged to default branch

Correct:

bash
# First merge workflow files to default branch
git checkout main
git merge feature/add-gh-action
git push

# Now PRs can trigger the action

Source: GitHub Actions documentation on workflow_run event

MEDIUM Missing permissions for PR comments

The comment workflow needs pull-requests: write permission.

yaml
jobs:
  upload:
    permissions:
      pull-requests: write # Required!
MEDIUM Using data URLs for large files

Data URLs are limited to ~1M characters at dpaste.com. Large builds will fail.

Wrong:

json
{
  "imports": {
    "my-lib": "{{LC::TO_DATA_URL(./dist/bundle.js)}}" // Too large!
  }
}

Correct:

yaml
# Use base-url and TO_URL for large files
base-url: 'https://{{LC::REF}}.my-project.pages.dev'

Example PR Comment Output

markdown
## Preview in LiveCodes

**Latest commit:** abc1234  
**Last updated:** Jan 15, 2024 3pm (UTC)

|   Playground   | Link                                                               |
| :------------: | ------------------------------------------------------------------ |
| **JavaScript** | [https://livecodes.io?x=code/...](https://livecodes.io?x=code/...) |
|   **React**    | [https://livecodes.io?x=code/...](https://livecodes.io?x=code/...) |

See [documentations](https://github.com/live-codes/preview-in-livecodes) for usage instructions.
  • import-export - Understanding project configuration objects
  • self-hosting - Using custom appUrl for self-hosted playgrounds

© live-codes, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .agents/skills/livecodes/gh-action of live-codes/livecodes.

Open the folder on GitHubat commit 5754e89

Compare with similar skills

Gh Action next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Gh Action compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Gh Action this skilllive-codes/livecodes1.5k—~1.8kAutomated safety check: PassMIT
CIaiblueprinthq/ai-blueprint458—~2.2kAutomated safety check: PassMIT
Michel Monitor Pull Request GitHub ActionsPackmindHub/packmind317—~2.6kAutomated safety check: PassApache-2.0
CIopenJiuwen-ai/sciencediscovery148—~2.2kAutomated safety check: PassApache-2.0
Diy Netlifyswyxio/skills172—~1.1kAutomated safety check: PassMIT
ONNX Runtime CI Managementmicrosoft/onnxruntime22k—~4.1kAutomated safety check: PassMIT

Similar skills

  • CI

    aiblueprinthq/ai-blueprint

    Set up or normalize one project Verify command and matching GitHub Actions checks while preserving existing CI, with an optional local pre-push hook.

    458 GitHub stars~2.2k tokensUpdated 2 days ago
    DevOps & CloudAuto-check passed

  • Michel Monitor Pull Request GitHub Actions

    PackmindHub/packmind

    Diagnose a failed, stuck, or never-triggered CI run on a GitHub PR, apply a local fix if possible, push it, and document the result in a single running PR comment.

    317 GitHub stars~2.6k tokensUpdated yesterday
    DevOps & CloudAuto-check passed

  • CI

    openJiuwen-ai/sciencediscovery

    Read, diagnose, and change the CI pipeline: GitHub Actions on pull requests, the nightly schedule and the release tag.

    148 GitHub stars~2.2k tokensUpdated 5 days ago
    DevOps & CloudAuto-check passed

  • Diy Netlify

    swyxio/skills

    Build or audit an isolated Netlify/Vercel-style pull-request preview workflow using GitHub Actions and the project's existing hosting provider.

    172 GitHub stars~1.1k tokensUpdated 2 days ago
    DevOps & CloudAuto-check passed

  • ONNX Runtime CI Management

    microsoft/onnxruntime

    Official

    Triggers, re-runs and unblocks the CI checks on an ONNX Runtime pull request, after diagnosing whether a failure is transient or needs a code change.

    22k GitHub stars~4.1k tokensUpdated today
    DevOps & CloudAuto-check passed

  • Renovate Actions PR Review

    backnotprop/plannotator

    Reviews Renovate pull requests that bump GitHub Actions by checking pinned SHAs against upstream tags, scanning changelogs and confirming workflows stay compatible.

    9.2k GitHub stars~640 tokensUpdated yesterday
    DevelopmentAuto-check passed

More from live-codes/livecodes

All 15 skills in this repo

  • Language Support

    live-codes/livecodes

    Work with 90+ supported languages, compilers, CSS processors, and WASM-compiled languages for markup, style, and script editors.

    1.5k GitHub stars~1.6k tokensUpdated today
    Auto-check passed

  • Configuration

    live-codes/livecodes

    Configure playground behavior through Config object, query parameters, EmbedOptions, editor settings, processors, external resources, and custom settings.

    1.5k GitHub stars~4.5k tokensUpdated today
    Auto-check passed

  • Display Modes

    live-codes/livecodes

    Configure how the playground is displayed: full, focus, simple, lite, editor, codeblock, and result modes.

    1.5k GitHub stars~1.7k tokensUpdated today
    Auto-check passed

  • Framework Wrappers

    live-codes/livecodes

    Use SDK with React, Vue, Svelte, Solid, Preact, and Web Components.

    1.5k GitHub stars~2.8k tokensUpdated today
    Auto-check passed

  • Getting Started

    live-codes/livecodes

    Quick start for standalone app at livecodes.io, embedding playgrounds with CDN or npm, and self-hosting basics.

    1.5k GitHub stars~1.6k tokensUpdated today
    Auto-check passed

  • Headless Mode

    live-codes/livecodes

    Run playground without visible UI using SDK methods directly.

    1.5k GitHub stars~1.1k tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about Gh Action

What does Gh Action do?

Use the "Preview in LiveCodes" GitHub Action to generate preview playground links for pull request code changes. Gh Action is an agent skill from live-codes/livecodes. Use the "Preview in LiveCodes" GitHub Action to generate preview playground links for pull request code changes.

When should I use Gh Action?

Gh Action fits situations like: tasks that involve CI/CD; tasks that involve Pull requests.

How do I install Gh Action in Claude Code?

Run `npx skills add live-codes/livecodes --skill gh-action -a claude-code`. Or copy the skill folder (.agents/skills/livecodes/gh-action in live-codes/livecodes) into .claude/skills/gh-action in your project. Claude Code loads it when a task matches its description.

How do I install Gh Action in Codex?

Run `npx skills add live-codes/livecodes --skill gh-action -a codex`. Or copy the skill folder (.agents/skills/livecodes/gh-action in live-codes/livecodes) into .agents/skills/gh-action in your project. Codex loads it when a task matches its description.

Can I use Gh Action in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add live-codes/livecodes --skill gh-action -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/gh-action, .gemini/skills/gh-action, .github/skills/gh-action and .opencode/skills/gh-action in your project.

What does Gh Action need to run?

Going by SKILL.md and its folder, Gh Action needs the command-line tools its instructions call (git and npm) and credentials named GITHUB_TOKEN. Our summary lists: Node.js; A credential in GITHUB_TOKEN.

Does Gh Action access the network?

SKILL.md names 4 domains. In commands or code: livecodes.io, github.com and cdn.jsdelivr.net; the agent is likely to contact these when it follows the instructions. As links in the text: securitylab.github.com. This is read from the text; nothing was executed.

Is Gh Action safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Gh Action use?

Gh Action is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Gh Action use?

About 1.8k tokens (SKILL.md is roughly 7.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Gh Action?

Skills that share tags, products or a category with Gh Action: CI (aiblueprinthq/ai-blueprint, 458 stars), Michel Monitor Pull Request GitHub Actions (PackmindHub/packmind, 317 stars), CI (openJiuwen-ai/sciencediscovery, 148 stars) and Diy Netlify (swyxio/skills, 172 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Gh Action?

live-codes (a GitHub organization) maintains it in live-codes/livecodes, which has 1,512 GitHub stars. The repository holds 15 skills in this directory. The repository was last updated on October 6, 2026.

Source: live-codes/livecodes on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.