Do I need to run a server to use this skill?

Yes, the visualization requires the Backend Factory server to be running on localhost:7777. You can start it using the /backend-factory:start command.

Which backend frameworks does this skill support?

The analyze skill currently supports Express (Node.js), Flask (Python), FastAPI (Python), and Hono (TypeScript/JavaScript).

Can I export the visual map to other formats?

Yes, the visualization interface includes an 'EXPORT MERMAID' button that allows you to copy the architectural diagram as Mermaid.js code for your documentation.

Does this skill send my code to an external service?

The analysis is performed locally by Claude. The results are pushed to your own local server, ensuring your code structure remains on your machine.

What is the difference between a quick and deep analysis?

Quick analysis uses a pre-defined script to rapidly map known patterns, while deep analysis leverages Claude's full agent capabilities to exhaustively explore the codebase.

Backend Architecture Visualizer

Name: Backend Architecture Visualizer
Author: randyquaye

byrandyquaye

0•

API 开发

Transforms backend codebases into live, animated pixel-art factory visualizations by analyzing routes, databases, and background workers.

The Analyze skill serves as the analytical core of the Backend Factory plugin, scanning Express, Flask, FastAPI, and Hono projects to map out architectural components. It automatically identifies API routes, middleware, databases, and background tasks, enriching them with creative metadata and scenario animations. Whether performing a quick re-scan or a deep agent-driven analysis, it pushes real-time updates to a local dashboard, allowing developers to visualize their system's data flow and logic through an engaging, interactive factory interface that includes tooltips, zoomable views, and exportable Mermaid diagrams.

主要功能

010 GitHub stars

02Creative metadata enrichment including factory-themed roles and scenarios.

03Real-time visualization updates via local server and SSE.

04Automated architecture discovery for Express, Flask, FastAPI, and Hono.

05Interactive UI support with panning, zooming, and Mermaid diagram export.

06Deep background flow detection for workers, crons, and webhooks.

使用场景

01Generating visual documentation for architectural reviews and system design sessions.

02Verifying architectural implementations and identifying missing middleware or background processes.

03Onboarding new developers by providing a visual, interactive map of complex backend logic.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add randyquaye/backend-come-alive analyze

For use in Claude.ai and ChatGPT

主要功能

010 GitHub stars

02Creative metadata enrichment including factory-themed roles and scenarios.

03Real-time visualization updates via local server and SSE.

04Automated architecture discovery for Express, Flask, FastAPI, and Hono.

05Interactive UI support with panning, zooming, and Mermaid diagram export.

06Deep background flow detection for workers, crons, and webhooks.

使用场景

01Generating visual documentation for architectural reviews and system design sessions.

02Verifying architectural implementations and identifying missing middleware or background processes.

03Onboarding new developers by providing a visual, interactive map of complex backend logic.