skills.rest
grzlz
grzlzCOMMUNITY
Explore all skills by this author →
GitHub

skillful-svelte

Generate Spanish README.md files and Mermaid diagrams for Svelte 5 projects.

Updated Sep 1, 2025
Search Tags:#documentation#mermaid#spanish#svelte#runes#sveltekit
One-click install
npx skills add https://github.com/grzlz/vandeley --skill skillful-svelte
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: skillful-svelte
Source: https://github.com/grzlz/vandeley/tree/main/static/skillful/svelte
Command: npx skills add https://github.com/grzlz/vandeley --skill skillful-svelte

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the creation of production-ready Spanish documentation for Svelte 5 projects, delivering accurate explanations of runes and routing, plus Mermaid diagrams to visualize architecture.

Core Features & Use Cases

  • Svelte 5 Runes explanations: Clear explanations of $state(), $derived(), $effect() usage in this project.
  • Mermaid diagrams: system-architecture.mmd, component-hierarchy.mmd, routing-diagram.mmd, and state-flow diagrams to illustrate architecture and data flow.
  • Spanish README: Ready-to-publish documentation tailored for Spanish-speaking developers.
  • Use Case: A SvelteKit project can be documented quickly with framework-specific guidance and visuals.

Quick Start

Curl the framework-specific skill to generate the Spanish README and diagrams for your Svelte project by curling the SKILL.md for the Svelte skill at vandeley.art: curl vandeley.art/skillful/svelte/SKILL.md

Frequently Asked Questions about skillful-svelte

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate Spanish documentation for a Svelte 5 project?▼

Spanish documentation for Svelte 5 projects can be generated automatically with framework-specific analysis that produces a README covering setup, architecture, runes ($state, $derived, $effect), and dependencies, plus accompanying Mermaid diagrams for system visualization.

What are Svelte runes and how do I document them?▼

Svelte runes ($state, $derived, $effect) are reactive primitives in Svelte 5 that manage state and side effects. Production documentation should explain each rune's role in your codebase with concrete examples from your component usage patterns.

Can I create architecture diagrams for a SvelteKit project automatically?▼

Yes. Mermaid diagram generation automates visualization of system architecture, component hierarchy, routing flow, and state management patterns by analyzing your SvelteKit codebase structure and file-based routing.

Does this work with existing SvelteKit codebases?▼

This documentation generation targets SvelteKit projects with code analysis of file-based routing, load functions, server versus client components, and component props flow to produce accurate, project-specific Spanish README output.

What output files does the documentation generation produce?▼

Output includes a structured Spanish README.md with setup and architecture sections, plus separate Mermaid diagram files: system-architecture.mmd, component-hierarchy.mmd, routing-diagram.mmd, and state-flow.mmd for complete visual documentation.

Related Skills

Explore More Software Engineering Skills→
Tomlord1122Tomlord1122

svelte-kit

Apply Svelte 5 runes and SvelteKit routing guidance to projects.

Community
Advanced
microsoftmicrosoft
2.9k

wiki-vitepress

Package wiki Markdown into a VitePress static site with dark theme and Mermaid diagrams.

Official
Advanced
aguirrerjgaguirrerjg
1

svelte5-best-practices

Review Svelte 5 components for correct rune syntax and SvelteKit patterns.

Community
Intermediate
Sanali209Sanali209

svelte5-best-practices

Guide Svelte 5 component authors on runes, snippets, and SvelteKit patterns.

Community
Intermediate