Octo E-ShopCopilot Demos
Codespaces
Browse the guide

Demos

Code Quality

CodeQL, secret scanning, dependency review, and Copilot Autofix from the GitHub UI.

Core4 minCode security

What This Demonstrates

GitHub Code Quality features — CodeQL analysis, Copilot Autofix, dependency review, and secret scanning — work directly from the GitHub UI and PR workflow.

Prerequisites

  • Repository admin access (for enabling features)
  • GitHub web UI

a) Enable Code Scanning (CodeQL)

  1. Navigate to the repo on GitHub → Settings → Code security and analysis.
  2. Enable Code scanning with the default CodeQL setup.
  3. Show the auto-generated codeql.yml workflow detecting JavaScript/TypeScript.
  4. Trigger a scan and walk through the results under Security and quality → Code scanning alerts.

b) Copilot Autofix on Code Scanning Alerts

  1. Open a code scanning alert from the Security and quality tab.
  2. Click Generate fix (Copilot Autofix) on a finding.
  3. Walk through the suggested patch — explain how it addresses the vulnerability.
  4. Commit the fix directly or open a PR from the suggestion.

c) Dependency Review in PRs

  1. Create a branch and add or bump a dependency in one of the services’ package.json.
  2. Open a PR — show the Dependency Review summary that appears.
  3. Point out how vulnerable or license-incompatible dependencies are flagged before merge.

d) Secret Scanning + Push Protection

  1. Navigate to Settings → Code security → Secret scanning — show it’s enabled.
  2. Show Push protection is on (blocks pushes containing detected secrets).
  3. Optionally demo by attempting to push a dummy secret pattern and showing the block.

e) Security Overview Dashboard

  1. Go to Security and quality → Overview at the repo or org level.
  2. Walk through the dashboard: open alerts, fixed alerts, coverage.
  3. Highlight how code quality findings, dependency alerts, and secret alerts roll up into one view.

f) Code Scanning in a PR (Inline Experience)

  1. Open a PR that triggers a CodeQL finding (e.g., missing input validation).
  2. Show the inline annotation on the PR diff with the finding details.
  3. Show Copilot Autofix suggesting a remediation inline.
  4. Accept or dismiss the suggestion.

Follow-Up Prompts

  • “What other CodeQL queries should we enable for this Node.js project?”
  • “Generate a dependency review action that blocks PRs with critical vulnerabilities.”