Claude-code-plugins-plus-skills framer-security-basics

install

source · Clone the upstream repo

git clone https://github.com/jeremylongshore/claude-code-plugins-plus-skills

Claude Code · Install into ~/.claude/skills/

T=$(mktemp -d) && git clone --depth=1 https://github.com/jeremylongshore/claude-code-plugins-plus-skills "$T" && mkdir -p ~/.claude/skills && cp -r "$T/plugins/saas-packs/framer-pack/skills/framer-security-basics" ~/.claude/skills/jeremylongshore-claude-code-plugins-plus-skills-framer-security-basics && rm -rf "$T"

manifest: plugins/saas-packs/framer-pack/skills/framer-security-basics/SKILL.md

Framer Security Basics

Overview

Security best practices for Framer API keys, plugin development, and Server API access.

Instructions

Step 1: Credential Management

Credential	Scope	Where to Store
Server API Key ( `framer_sk_*` )	Per-site	Secrets vault
Site ID	Per-site	Can be in config
Plugin auth tokens	Per-user session	Never persist

# .env (never commit)
FRAMER_API_KEY=framer_sk_abc123...
FRAMER_SITE_ID=abc123

# .gitignore
.env
.env.local

Step 2: Plugin Security

// Plugins run in Framer's iframe sandbox — limited browser APIs
// Never store secrets in plugin code (it's client-side)

// Fetch external data through your own API proxy
const data = await fetch('https://your-api.com/framer-data', {
  headers: { 'Authorization': `Bearer ${sessionToken}` },
});

Step 3: Server API Key Rotation

# 1. Generate new key in Framer site settings
# 2. Update in secrets vault
# 3. Test connection
node -e "
  const { framer } = require('framer-api');
  framer.connect({ apiKey: process.env.FRAMER_API_KEY, siteId: process.env.FRAMER_SITE_ID })
    .then(() => console.log('OK'))
    .catch(e => console.error('FAIL', e.message));
"
# 4. Revoke old key in site settings

Step 4: Security Checklist

API keys in environment variables, never in code
```
.env
```
in
```
.gitignore
```
Plugin never stores or exposes API keys
Server API accessed only from backend, never client
Pre-commit hook scans for
```
framer_sk_*
```
leaks
HTTPS-only for all API communication

Resources

Next Steps

For production deployment, see

framer-prod-checklist