Anima deploy integration

Skill jeremylongshore/claude-code-plugins-plus-skills/plugins/saas-packs/anima-pack/skills/anima-deploy-integration

425 plugins, 2,810 skills, 200 agents for Claude Code. Open-source marketplace at tonsofskills.com with the ccpi CLI package manager.

Install

npx -y skills add jeremylongshore/claude-code-plugins-plus-skills --skill anima-deploy-integration

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

What its author says it does

Copied from the file, not written here

'Deploy Anima design-to-code service as a backend API endpoint.

The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.

SKILL.md

3.1 KB, 679 tokens by cl100k_base, as published. Nobody here has run it

Anima Deploy Integration

Overview

Deploy the Anima SDK as a backend service. The SDK is server-side only, so deploy it behind an API endpoint that accepts Figma file/node references and returns generated code.

Instructions

Step 1: Express API Wrapper

// src/server.ts
import express from 'express';
import { Anima } from '@animaapp/anima-sdk';

const app = express();
app.use(express.json());

const anima = new Anima({ auth: { token: process.env.ANIMA_TOKEN! } });

app.post('/api/generate', async (req, res) => {
  const { fileKey, nodesId, settings } = req.body;

  if (!fileKey || !nodesId?.length) {
    return res.status(400).json({ error: 'fileKey and nodesId required' });
  }

  try {
    const { files } = await anima.generateCode({
      fileKey,
      figmaToken: process.env.FIGMA_TOKEN!,
      nodesId,
      settings: settings || { language: 'typescript', framework: 'react', styling: 'tailwind' },
    });
    res.json({ files, count: files.length });
  } catch (err: any) {
    res.status(500).json({ error: err.message });
  }
});

app.get('/health', (_req, res) => res.json({ status: 'ok' }));
app.listen(3000, () => console.log('Anima service on :3000'));

Step 2: Vercel Serverless Function

// api/generate.ts
import { Anima } from '@animaapp/anima-sdk';

const anima = new Anima({ auth: { token: process.env.ANIMA_TOKEN! } });

export default async function handler(req: any, res: any) {
  if (req.method !== 'POST') return res.status(405).end();

  const { fileKey, nodesId, settings } = req.body;
  const { files } = await anima.generateCode({
    fileKey, figmaToken: process.env.FIGMA_TOKEN!, nodesId,
    settings: settings || { language: 'typescript', framework: 'react', styling: 'tailwind' },
  });
  res.json({ files });
}

Step 3: Deploy Commands

# Vercel
vercel secrets add anima_token "$ANIMA_TOKEN"
vercel secrets add figma_token "$FIGMA_TOKEN"
vercel --prod

# Cloud Run
gcloud run deploy anima-service \
  --source . \
  --set-secrets=ANIMA_TOKEN=anima-token:latest,FIGMA_TOKEN=figma-token:latest \
  --region us-central1 --allow-unauthenticated

Output

Express API wrapping Anima SDK for internal design tooling
Vercel serverless function for lightweight deployment
Cloud Run deployment with Secret Manager

Resources

Next Steps

For webhook integration, see anima-webhooks-events.