ReddRadar
Agent skill
stackblitz-security-basics
Secure WebContainer deployments: CSP headers, sandbox isolation, input validation. Use when working with WebContainers or StackBlitz SDK. Trigger: "stackblitz security".
Install this agent skill to your Project
npx add-skill https://github.com/jeremylongshore/claude-code-plugins-plus-skills/tree/main/plugins/saas-packs/stackblitz-pack/skills/stackblitz-security-basics
SKILL.md
StackBlitz Security Basics
Overview
Secure WebContainer deployments: CSP headers, sandbox isolation, input validation.
Instructions
Step 1: WebContainer Security Model
WebContainers run in the browser sandbox -- no access to host filesystem, network is limited to HTTP, and all code runs in the user's browser tab. Key security points:
// WebContainers are inherently sandboxed:
// - No file system access to host
// - No raw network sockets
// - Memory isolated to browser tab
// - Cross-origin isolation via COOP/COEP headers
Step 2: Validate User Input
// If users can provide code to run in WebContainer, validate:
function sanitizeFileTree(tree: FileSystemTree): FileSystemTree {
const sanitized: FileSystemTree = {};
for (const [name, entry] of Object.entries(tree)) {
// Block path traversal
if (name.includes('..') || name.startsWith('/')) continue;
// Block sensitive files
if (name === '.env' || name.endsWith('.key')) continue;
sanitized[name] = entry;
}
return sanitized;
}
Step 3: Content Security Policy
Content-Security-Policy: default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; frame-src https://*.webcontainer.io;
Security Checklist
- COOP/COEP headers set correctly
- User-provided code sandboxed in WebContainer
- No secrets passed to WebContainer file system
- CSP headers configured
- Input validation on file paths
Resources
Next Steps
For production, see stackblitz-prod-checklist.
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
jeremylongshore/claude-code-plugins-plus-skills
dockerfile-generator
Dockerfile Generator - Auto-activating skill for DevOps Basics. Triggers on: dockerfile generator, dockerfile generator Part of the DevOps Basics skill category.
jeremylongshore/claude-code-plugins-plus-skills
branch-naming-helper
Branch Naming Helper - Auto-activating skill for DevOps Basics. Triggers on: branch naming helper, branch naming helper Part of the DevOps Basics skill category.
jeremylongshore/claude-code-plugins-plus-skills
readme-generator
Readme Generator - Auto-activating skill for DevOps Basics. Triggers on: readme generator, readme generator Part of the DevOps Basics skill category.
jeremylongshore/claude-code-plugins-plus-skills
makefile-generator
Makefile Generator - Auto-activating skill for DevOps Basics. Triggers on: makefile generator, makefile generator Part of the DevOps Basics skill category.
jeremylongshore/claude-code-plugins-plus-skills
gitignore-generator
Gitignore Generator - Auto-activating skill for DevOps Basics. Triggers on: gitignore generator, gitignore generator Part of the DevOps Basics skill category.
jeremylongshore/claude-code-plugins-plus-skills
pre-commit-hook-setup
Pre Commit Hook Setup - Auto-activating skill for DevOps Basics. Triggers on: pre commit hook setup, pre commit hook setup Part of the DevOps Basics skill category.
Didn't find tool you were looking for?