Anima Deploy Integration
SkillCloud & infraLets your agent deploy Anima design-to-code conversions as a backend API endpoint.
Available today. Use it from your connected AI after setup.
No other account needed.
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
fileKeyandnodesIdgeneration 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
| Failure | Response |
|---|---|
| Caller is not authenticated or file/node is not allowlisted | Reject before contacting Anima or Figma. |
| Managed secret is unavailable | Fail closed and repair the deployment binding; never use a plaintext fallback. |
| Generation or validation fails | Return a sanitized failure, preserve the prior revision, and quarantine the output. |
| Rate limit or repeated bad requests occur | Apply 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