Anima Deploy Integration

SkillCloud & infra

Lets your agent deploy Anima design-to-code conversions as a backend API endpoint.

Available today. Use it from your connected AI after setup.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the Anima Deploy Integration skill

About this capability

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

What this skill tells your AI

The instructions your AI receives, as published by jeremylongshore/tons-of-skills-marketplace in skills/.curated/anima-deploy-integration/SKILL.md and read by ahel’s review.

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.

Prerequisites

  • A private or authenticated service boundary with an allowlisted design-file registry; do not expose arbitrary fileKey and nodesId generation to the public internet.
  • Managed Anima and Figma secrets, separate staging/production credentials, request limits, and an audit trail that excludes token values and design content.
  • An approved generated-output path, validation pipeline, and rollback target for every deployment revision.

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: Object.keys(files).length });
  } catch (err: any) {
    res.status(502).json({ error: 'Generation failed', requestId: req.id });
  }
});

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 --no-allow-unauthenticated

Tool Discipline

Use Read and Grep to inspect the existing integration and generated diff before changing anything. Use Write or Edit only inside the approved generated-code, test, or configuration paths. Use the declared Bash commands only for the explicit install, validation, or diagnostic steps in this workflow; never print tokens, source designs, generated source, or private website captures.

Output

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

Examples

Deploy the service to a staging environment behind the organization’s existing identity proxy and invoke /api/generate with one allowlisted file/node pair. Verify the request is authorized, output remains in the approved generated-code location, logs contain only request metadata, and generated files pass the downstream formatter and test gate before a human reviews them. If an unauthenticated caller, unknown node, or secret-binding error reaches the service, reject the request, alert the operator, and keep the prior revision active rather than opening broad access or embedding credentials in the client.

Error Handling

FailureResponse
Caller is not authenticated or file/node is not allowlistedReject before contacting Anima or Figma.
Managed secret is unavailableFail closed and repair the deployment binding; never use a plaintext fallback.
Generation or validation failsReturn a sanitized failure, preserve the prior revision, and quarantine the output.
Rate limit or repeated bad requests occurApply bounded throttling and alert the owning service team.

Resources

Signals

GitHub stars
3k
Forks
396
Last commit
Sep 2026
Advanced
Catalog kind
skill
Gateway key
anima-deploy-integration
Source
github.com/jeremylongshore/tons-of-skills-marketplace