bbeierle12/skill-mcp-claude
77 skills6.9k installs616 starsGitHub
Install
npx skills add https://github.com/bbeierle12/skill-mcp-claudeSkills in this repo
1Gsap Reactgsap-react is a React animation skill from bbeierle12/skill-mcp-claude covering GSAP integration with proper lifecycle handling. It documents installing gsap and @gsap/react, using useGSAP with scoped container refs, and applying cleanup patterns so animations do not leak across mounts. Developers reach for gsap-react when implementing timelines, tweens, or reusable animation hooks inside React components where naive useEffect GSAP calls cause double-fires or memory leaks.704installs2Gsap Scrolltriggergsap-scrolltrigger is a frontend animation skill from bbeierle12/skill-mcp-claude covering GSAP ScrollTrigger patterns for scroll-driven motion. Setup starts with `npm install gsap`, registering ScrollTrigger via gsap.registerPlugin, then configuring trigger, start, end, and scrub properties on tweens. The skill documents pinning sticky sections, scrub-linked progress animations, snap points, parallax layers, and progress indicators for landing pages. Frontend developers reach for gsap-scrolltrigger when CSS scroll animations fall short and timeline control tied to scroll position is required in JavaScript bundles.576installs3Gsap Fundamentalsgsap-fundamentals is a frontend development skill in bbeierle12/skill-mcp-claude that encodes core GreenSock Animation Platform patterns for browser UI motion. The SKILL.md covers four tween primitives—gsap.to(), gsap.from(), gsap.fromTo(), and gsap.set()—plus timing controls, built-in power/back/elastic eases, stagger blocks, SVG attr animation, callback hooks, and transform-first performance guidance that avoids layout-triggering properties. Agents activate it when implementing entrance animations, dashboard transitions, countdown digit flips, or learning GSAP before sibling skills like gsap-scrolltrigger and gsap-react in the same eight-skill animation collection. Install with npx skills add bbeierle12/skill-mcp-claude --skill gsap-fundamentals. Developers reach for gsap-fundamentals when a landing page or SaaS dashboard needs timeline choreography, staggered reveals, or GPU-friendly motion without reading scattered GSAP docs. Examples include fade/slide/scale patterns, infinite repeat loops, tween instance control, and temporal-collapse countdown effects using textShadow and rotationX flips.267installs4Shader EffectsTeaches shader-effect patterns for web graphics: GLSL snippets, uniform-driven animations, material hooks in Three.js or R3F, and practical guidance for gradients, noise, and post FX without breaking mobile performance.193installs5D3js VisualizationSkill for producing D3.js visualizations: bind data to DOM/SVG, configure scales and axes, animate updates, and add interaction. Targets dashboards, reports, and explorable datasets in SaaS or content products where off-the-shelf chart libraries are too limiting for bespoke layouts.178installs6Shader FundamentalsShader-fundamentals covers GPU shader basics—vertex and fragment stages, uniforms, textures, and lighting—for WebGL and similar clients so developers and agents can author correct, performant visual effects in games and interactive experiences.158installs7Gsap SequencingCovers GSAP sequencing patterns: master timelines, chained tweens, staggers, and scroll-linked animation for landing pages and product UI. Helps teams add premium motion without fragile CSS-only hacks, while keeping performance and accessibility considerations in view.154installs8Particles GpuGuides creation of GPU-driven particle systems for web experiences, covering emitter setup, shader-friendly buffers, performance budgeting, and integration patterns for cinematic backgrounds in SaaS and content sites.154installs9Audio AnalysisAudio-analysis is an MCP integration skill that lets Claude agents ingest and analyze sound files—transcribing, classifying, or summarizing audio—so multimodal workflows can reason over recordings without custom ad-hoc tooling.124installs10Particles PhysicsParticles-physics teaches how to build performant particle systems—emitters, forces, collisions, and lifetimes—for WebGL, canvas, and game clients so agents can implement convincing motion graphics and interactive visual effects correctly.116installs11Software ArchitectureThis skill encodes software design guidance including SOLID principles and Clean Architecture with concrete TypeScript examples. A developer uses it when designing a system, reviewing architecture, or making structural decisions, and it shows how to separate domain, application, and interface layers so dependencies point inward.116installs12R3f FundamentalsCovers React Three Fiber essentials for mounting Three.js scenes in React, including canvases, meshes, lighting, controls, and patterns for interactive 3D product viewers, games, and marketing experiences.107installs13Shader NoiseThis skill is a GLSL reference for procedural noise functions including Perlin, simplex, Worley/cellular, value noise, FBM, and turbulence. A developer uses it when writing shaders for organic textures, terrain, clouds, water, or fire, where coherent randomness is needed. It ships ready-to-paste noise implementations and guidance on when each noise type fits.103installs14Form Ux Patternsform-ux-patterns is a Claude Code skill for complex form UX, built on cognitive-load and aviation UX principles. It covers multi-step wizards, chunking fields into groups of 5-7, progressive disclosure, and conditional fields. A developer loads it when building checkout flows, onboarding wizards, or forms with many fields. It provides a useMultiStepForm hook and step configuration types.102installs15Frontend Dev Guidelinesfrontend-dev-guidelines is a Claude Code skill of React and TypeScript development conventions. It covers a feature-based project structure, functional components, Suspense and lazy loading, TanStack Query for server state, Zustand for global state, and performance patterns like memoization, code splitting, and virtual lists. A developer loads it when creating components, fetching data, styling, routing, or working on React frontend code. It also covers error boundaries, TypeScript typing, and testing.99installs16Postfx EffectsThis skill adds post-processing visual effects to 3D scenes, including chromatic aberration, vignette, depth of field, film grain, color grading, LUT support, tone mapping, scanlines, and god rays. It uses @react-three/postprocessing and provides patterns for cinematic, retro, and atmospheric looks. A developer uses it to add mood, style, and visual storytelling polish to Three.js scenes.97installs17Gsap Routergsap-router is a Claude Code router skill for GreenSock Animation Platform work. It classifies an animation request and routes to four skills covering fundamentals, sequencing, ScrollTrigger, and React integration, with signal matching and confidence scoring. A developer starts here when implementing GSAP tweens, timelines, scroll-based animations, or React animation. It includes common combinations and an easing quick reference.93installs18Audio ReactiveAudio Reactive connects audio analysis data to visual parameters. It covers smoothing frequency bands (bass, mid, high), beat-detection responses, and mappings from audio to scale, position, rotation, color, and opacity, including Three.js meshes. A developer uses it when building audio visualizers or music-reactive animations driven by audio input.91installs19PptxThis skill teaches an agent to create, edit, and analyze .pptx PowerPoint files by manipulating their underlying ZIP and OOXML XML structure. A developer uses it to generate slide decks from HTML using the bundled html2pptx.js library, or to extract and edit slide content directly. It ships a global.css slide framework and OOXML schema references so generated files stay valid and open in PowerPoint.89installs20Product Self KnowledgeThis skill gives an agent an authoritative reference for answering questions about Anthropic products such as Claude.ai, Claude Code, and the Claude API. It routes each question to the correct official documentation map or support page and insists on sourcing answers with official URLs. A developer uses it so the assistant stops guessing about product capabilities, access, pricing, or limits.89installs21Shader SdfThis skill is a GLSL reference for signed distance functions used to define procedural shapes in shaders. It covers 2D and 3D primitives, boolean operations, smooth blending, repetition, and raymarching fundamentals. A developer uses it when creating procedural shapes, text effects, smooth morphing, or raymarched 3D scenes in GLSL.83installs22R3f PerformanceThis skill covers performance optimization for React Three Fiber scenes through draw-call reduction, geometry optimization, smart loading, and profiling. A developer uses it when frame rate drops, scenes get large, or draw calls need cutting via instancing, merged geometry, or LOD. It gives a concrete per-frame time budget and adaptive-performance patterns.81installs23Systematic DebuggingThis skill enforces a systematic debugging process based on the scientific method: understand the problem, reproduce it consistently, and trace the bad value backward to its root cause. A developer uses it when encountering any bug, test failure, or unexpected behavior before proposing fixes, and it warns against changing multiple things at once or fixing symptoms.76installs24Writing PlansThis skill creates detailed implementation plans after the brainstorming or design phase, structured so any developer could execute them. A developer uses it to lay out ordered tasks with exact file paths, complete code, test-first steps, verification commands, and a rollback plan, then hands off to execution.76installs25Audio PlaybackAudio Playback covers audio playback and scheduling in the browser with Tone.js. It documents player control, the global transport clock, event scheduling, effects chains, and reusable patterns like a music player and sound-effects manager. A developer uses it when adding background music, sound effects, or timed audio events to a web application.73installs26Immersive Visuals Routerimmersive-visuals-router is a Claude Code master router for building immersive web visual experiences. It classifies a project and dispatches to six domain routers covering React Three Fiber, shaders, particles, post-processing, GSAP animation, and audio. A developer starts here when building 3D web experiences, visualizers, or creative-coding projects that combine multiple visual technologies. It provides project-type routes and domain-combination recipes.69installs27Postfx BloomThis skill implements bloom and glow effects using Three.js UnrealBloomPass with React Three Fiber. It covers luminance-based bloom parameters, selective bloom on specific meshes, emissive material setup, and animated or audio-reactive glow. A developer uses it for neon, cyberpunk, energy, and magic-spell lighting effects in 3D scenes.69installs28Structural PhysicsThis skill provides stability validation and damage systems for Three.js building games in the style of Fortnite, Rust, or Valheim. A developer uses it when implementing building placement rules, damage propagation, or cascading collapse, and it ships heuristic validators and a damage system with arcade, heuristic, and realistic modes.69installs29Building MechanicsBuilding-mechanics is a Claude skill providing a Three.js 3D building system with spatial indexing, structural physics, and multiplayer networking. It is used when creating survival games, sandbox builders, or any game with player-constructed structures. It covers performance optimization, structural validation modes, and multiplayer sync techniques like delta compression and client prediction.67installs30Form Reactform-react is a Claude Code skill with production React form patterns built on React Hook Form plus Zod, with TanStack Form as an alternative. It shows schema-driven forms, a reusable FormField component, FormProvider for nested sections, and blur-based validation timing. A developer loads it when building forms in a React application. It includes a comparison table for choosing between the two libraries.65installs31Form Accessibilityform-accessibility is a Claude Code skill that supplies WCAG 2.2 AA patterns for building accessible web forms. It shows how to bind labels, hints, and error messages with ARIA, manage focus on errors and multi-step changes, and meet keyboard and target-size criteria. A developer loads it when implementing forms that must work for keyboard and screen-reader users. It is framework-agnostic and pairs with framework-specific form skills.64installs32Shader RouterThis skill is a routing framework for GLSL shader work that decides which of four specialized shader skills to load for a task. It classifies the desired visual result by signal words, scores confidence, and recommends combining two to three skills for most shaders. A developer uses it when starting a shader project and unsure which noise, SDF, or effects techniques to combine.64installs33R3f RouterThis skill is a routing framework for React Three Fiber work that decides which of five specialized R3F skills to load for a given task. It classifies a request by signal words, scores confidence, and recommends combining two to four skills for most tasks. A developer uses it when starting an R3F project and unsure which geometry, materials, performance, or drei skills to combine.63installs34Scientific DocumentationThis skill generates exhaustive, research-style documentation for a completed coding project as a formal Word .docx file. It analyzes the development conversation to capture every feature, technique, and decision, then produces an academic-structured write-up that explains not just what code does but why. A developer uses it to turn a finished build into a learning resource or technical reference.63installs35Audio RouterAudio Router classifies an audio task from the user request and routes it to three specialized skills: audio-playback, audio-analysis, and audio-reactive. It uses signal matching and confidence scoring, and recommends which skills to combine for visualizers, beat-synced animations, and ambient soundscapes. A developer uses it as an entry point when deciding which audio skills to load for a web audio project.62installs36R3f MaterialsThis skill teaches how to define surface appearance in React Three Fiber using Three.js materials, from built-in PBR materials to custom GLSL ShaderMaterial. A developer uses it when choosing between material types, loading textures, or binding and animating shader uniforms. It includes a material comparison table and examples for clearcoat, transmission, toon shading, and rim lighting.62installs37BrainstormingBrainstorming is a Claude skill that guides collaborative design refinement through incremental questioning before implementation begins. A developer invokes it at the start of a feature or project to tease out the spec through conversation instead of jumping straight to code. It walks through understanding the goal, exploring approaches, proposing 2-3 alternatives, validating incrementally, then documenting the design.61installs38DocxDocx is a Claude skill for document creation, editing, and analysis of .docx files, with support for tracked changes, comments, formatting preservation, and text extraction. It bundles a docx JavaScript/TypeScript library tutorial and an Office Open XML technical reference with schemas. A developer uses it to programmatically generate or modify Word documents.61installs39Particles RouterThis skill is a decision framework that routes particle-system tasks to three specialized particle skills (gpu, physics, lifecycle) based on the effect type and scale. It classifies a request by signal words, scores confidence, and recommends which skills to combine, with recipes for effects like snow, fire, explosions, and confetti. A developer uses it when starting a particle effect and needing to pick the right techniques.61installs40R3f GeometryThis skill teaches how to define 3D shapes in React Three Fiber using BufferGeometry, built-in primitives, and custom vertex data in buffer attributes. A developer uses it when creating custom meshes, working directly with position/normal/uv arrays, or optimizing with instanced meshes to render many objects at once. It also covers indexed geometry and animating geometry per frame.61installs41Form Securityform-security is a Claude Code skill covering security patterns for web forms. It documents the full autocomplete attribute specification for identity, authentication, address, and payment fields, plus CSRF tokens, XSS prevention, and never blocking paste. A developer loads it when building authentication, payment, or other sensitive-data forms. It focuses on password-manager compatibility and preventing common form attacks.60installs42Form Validationform-validation is a Claude Code skill for schema-first form validation using Zod as the single source of truth for both runtime validation and TypeScript types. It defines validation timing (reward early, punish late), reusable auth, profile, address, and payment schemas, and async and conditional validation patterns. A developer loads it when implementing form validation in any framework. It is the foundation the framework-specific form skills depend on.60installs43Component LibraryComponent-library is a Claude skill that generates production-ready React components using shadcn/ui architecture, CVA variants, Radix UI primitives, and Tailwind CSS. It covers 30+ components across form, display, feedback, navigation, and layout categories with accessibility and dark-mode support. A frontend developer uses it to scaffold a consistent component system instead of hand-coding each component.59installs44Postfx ComposerThis skill covers EffectComposer setup and architecture for Three.js post-processing pipelines. It explains multi-pass rendering, correct effect ordering, custom Effect and shader passes, render target management, and reusable effect presets. A developer uses it as the foundation when combining post-processing effects or building custom passes.59installs45Frontend Designfrontend-design is a Claude Code skill that guides creating distinctive, production-grade frontend interfaces with strong aesthetic direction. It prompts choosing a bold tone, then covers typography, color, motion, spatial composition, and background details while listing generic AI aesthetics to avoid. A developer loads it when building web components, pages, or apps that need a polished, memorable look. It emphasizes intentional design over generic patterns.58installs46Particles LifecycleThis skill manages particle lifecycle in Three.js and React Three Fiber: emission and spawning, death conditions, object pooling, trails, and fade-in/out transitions. It provides emitter patterns (continuous, burst, sphere/box/circle/cone shapes) and CPU and GPU particle pools for memory-efficient recycling. A developer uses it when building continuous or bursting particle effects that need birth/death cycles.58installs47Terrain IntegrationThis skill adds terrain interaction to Three.js building games, covering slope analysis, foundation anchoring in the Valheim pattern, terrain modification, auto-leveling, and pillar generation. A developer uses it when implementing where and how structures attach to uneven ground, and it integrates with the structural-physics skill for stability.58installs48Multiplayer BuildingThis skill provides a networking layer for multiplayer building games, using a server-authoritative model with optimistic client prediction. It ships scripts for a server/client network manager, delta compression, client prediction with rollback, and conflict resolution for simultaneous builds. A developer uses it when adding networked construction and state synchronization to a building game.57installs49Aws SkillsAWS Skills provides AWS development guidance covering CDK project structure, serverless patterns, and event-driven architecture. It documents Lambda and API Gateway stacks, DynamoDB single-table design, EventBridge and SQS patterns, cost optimization, IAM least privilege, and CloudWatch monitoring. A developer uses it when deploying to AWS or writing infrastructure with the AWS CDK.56installs50Backend Dev GuidelinesBackend Dev Guidelines documents backend development patterns for Node.js, Express, and TypeScript applications. It defines a layered architecture from Routes to Controllers to Services to Repositories, plus error handling, input validation, middleware, database access, and testing. A developer uses it when creating routes, endpoints, controllers, services, or repositories.56installs51Builder UxBuilder-ux is a Claude skill for building-game user experience systems in Three.js. It covers prefab and blueprint save/load, undo/redo command patterns, ghost preview placement, multi-select, and copy/paste building mechanics. A game developer uses it to make block placement feel responsive when implementing player-constructed structures.56installs52Case Studies ReferenceCase-studies-reference is a reference-only Claude skill documenting building-mechanics case studies and decision frameworks for games. It analyzes the building systems of Fortnite, Rust, Valheim, Minecraft, No Man's Sky, and Satisfactory and provides matrices for choosing physics models, multiplayer architecture, and persistence strategy. A developer uses it when designing a building system or evaluating trade-offs.56installs53Form Vanillaform-vanilla is a Claude Code skill for framework-free form validation using the HTML5 Constraint Validation API enhanced with Zod. It covers built-in validation attributes, validity-state properties, custom error messages, and a createFormValidator helper with blur, input, and debounce timing. A developer loads it when building forms without React or Vue or for progressive enhancement. It relies on native browser APIs.55installs54Form Vueform-vue is a Claude Code skill with production Vue 3 form patterns using VeeValidate plus Zod by default, or Vuelidate. It shows Composition API forms with useForm and useField, a reusable FormField component, and a comparison table for choosing between the two libraries. A developer loads it when building forms in Vue 3 applications. It integrates Zod through the VeeValidate adapter.55installs55Performance At ScaleThis skill provides spatial indexing and world streaming for Three.js building games with thousands of pieces. It ships a spatial hash grid, an octree, a chunk manager for streaming large maps, and a performance profiler, plus a selection guide for choosing the right structure by piece count and distribution. A developer uses it to optimize spatial queries and performance in large building systems.55installs56Test Driven DevelopmentThis skill enforces test-driven development through the RED-GREEN-REFACTOR cycle, requiring a failing test before implementation code. A developer uses it when starting a feature or fixing a bug, and it defines good-test qualities (fast, isolated, repeatable, self-validating, timely) plus a commit-after-each-phase strategy.55installs57Algorithmic ArtAlgorithmic Art creates generative art using p5.js with seeded randomness and interactive parameter exploration. It works in two steps: first writing an algorithmic philosophy (a manifesto for a generative movement), then expressing it as p5.js sketches with an HTML viewer. A developer uses it to produce original flow fields, particle systems, and other code-driven art rather than copying existing artists.54installs58Canvas DesignCanvas-design is a Claude skill for creating visual art in .png and .pdf documents using a design-philosophy approach. It runs a two-step process: first author a named visual philosophy as an .md manifesto, then express it visually on a canvas. A user invokes it to create a poster, piece of art, or other static design that is mostly visual with minimal text.54installs59Postfx RouterThis skill is a router for the Three.js post-processing domain. It classifies an effect request by signal words and routes to three specialized skills: composer for pipeline setup, bloom for glow, and effects for cinematic polish. A developer uses it when starting post-processing work and needing to decide which effect skills to combine.54installs60Router TemplateThis skill is a starting-point template for building new router skills that dispatch to multiple specialized skills. It provides the standard scaffolding: a routing protocol, tiered quick-route tables, signal-matching rules, confidence scoring, and fallback behavior. A developer copies and customizes it when creating a router for their own domain.53installs61Subagent Driven DevelopmentThis skill executes an implementation plan by dispatching a fresh subagent for each task and reviewing the changes between tasks. A developer uses it to keep context clean per task and catch issues early, approving or requesting fixes before moving to the next task.53installs62Building RouterBuilding-router is a Claude skill that routes 3D building-game mechanics work in Three.js to 9 specialized skills. It is the entry point for survival games, sandbox builders, and base builders, classifying a project by scale and features then matching it to performance, physics, multiplayer, terrain, decay, UX, and platform skills. A developer starts here for any building-mechanics project.52installs63Platform BuildingThis skill provides platform-specific building systems covering mobile touch controls, VR spatial input, and accessibility patterns. It ships a touch build controller, a VR building adapter with comfort settings, and an accessibility config for colorblind modes, high contrast, and screen readers, plus platform detection. A developer uses it to make a building game work well across mobile, VR, and assistive contexts.52installs64Forms Routerforms-router is a Claude Code router skill that dispatches web form work to seven specialized form skills. It classifies a task by framework and form type, then names which accessibility, validation, security, UX, and framework skills to load together. A developer starts here at the beginning of a form project to assemble the right skill set. It includes decision tables and common 3-4 skill combinations.51installs65Decay UpkeepDecay-upkeep is a Claude skill implementing building decay and upkeep systems for survival games. It covers timer-based decay, Rust-style Tool Cupboard protection radius, resource upkeep costs, and server performance management through automatic cleanup of abandoned structures. A game developer uses it to balance gameplay maintenance against server health.49installs66Skill CreatorThis skill is a guide for creating new skills or updating existing ones to extend an agent's capabilities with specialized knowledge, workflows, and tools. It explains the anatomy of a skill (a required SKILL.md with frontmatter plus optional bundled scripts, references, and assets) and principles like keeping context concise and matching degrees of freedom to task fragility. A developer uses it when authoring or refining a skill.49installs67Theme FactoryThis skill provides 10 pre-set themes, each with a color palette and font pairing, that can be applied to artifacts like slide decks, docs, reports, or HTML landing pages. A developer uses it to give an artifact consistent professional styling, showing a theme showcase, getting the user's choice, then applying the palette and fonts, or generating a custom theme when none fit.49installs68Brand GuidelinesBrand-guidelines is a Claude skill that applies Anthropic's official brand colors and typography to any artifact that benefits from the company look-and-feel. It supplies a fixed palette of main and accent hex colors and specifies Poppins for headings and Lora for body text. A developer uses it when brand colors, visual formatting, or company design standards apply to output.48installs69Doc CoauthoringDoc-coauthoring is a Claude skill that guides users through a structured workflow for co-authoring documentation such as proposals, technical specs, and decision docs. It runs three stages: context gathering, section-by-section refinement, and reader testing with a fresh Claude to catch blind spots. A developer uses it when writing structured content that others will need to read and act on.48installs70Internal CommsThis skill helps Claude write internal company communications such as status reports, leadership updates, 3P (Progress/Plans/Problems) updates, newsletters, and FAQ responses. It identifies the communication type from a request and loads the matching guideline file from its examples directory to follow that format. A developer uses it when they need a workplace update or newsletter drafted in a consistent house style.48installs71PdfThis skill is a PDF manipulation toolkit for extracting text and tables, creating new PDFs, merging and splitting documents, and handling forms. It documents Python libraries (pypdf, pdfplumber, reportlab) plus command-line tools (pdftotext, qpdf, pdftk) and bundles scripts for form-field extraction and filling. A developer uses it to programmatically process, generate, or analyze PDF documents at scale.48installs72Slack Gif CreatorThis skill provides Python utilities and knowledge for creating animated GIFs sized for Slack emoji (128x128) and messages (480x480). A developer uses it when a user asks to make an animated GIF for Slack, and it assembles frames with a GIFBuilder, applies easing, and validates the output against Slack's file constraints.48installs73Using Git WorktreesThis skill creates isolated git worktrees so feature work stays separate from a clean main branch. A developer uses it when starting new feature or bugfix work, and it handles directory selection, .gitignore verification, dependency install, initial test runs, and worktree cleanup after merge.48installs74Web Artifacts BuilderThis skill scaffolds and bundles multi-component claude.ai HTML artifacts using React, TypeScript, Vite, Tailwind CSS, and shadcn/ui. A developer uses it for complex artifacts needing state, routing, or shadcn components, initializing a project, developing it, then bundling everything into one shareable HTML file.48installs75Mcp BuilderThis skill is a guide for creating MCP (Model Context Protocol) servers that let LLMs interact with external services through well-designed tools. It walks through a four-phase workflow covering research and planning, implementation, review and testing, and building evaluations, with reference material for both TypeScript (MCP SDK) and Python (FastMCP). A developer uses it when wrapping an external API or service as an MCP server.47installs76XlsxThis skill creates, edits, and analyzes spreadsheets (.xlsx, .xlsm, .csv, .tsv) with support for formulas, formatting, data analysis, and visualization. A developer uses it to build financial models with proper color-coding and formatting, or to read and analyze data with pandas and openpyxl, recalculating formulas with a LibreOffice-backed recalc.py script and fixing any formula errors.47installs77DashboardDashboard is a Claude skill that routes data-dashboard development work to specialized sub-skills for charts, real-time updates, and filtering. It outlines a dashboard architecture with a data layer, chart components, filter panel, layout, and real-time manager. A developer uses it when building analytics applications with visualizations, live data, and faceted filters.8installs