frontend-dev

Builds FP-first UI components for Vue/Nuxt, React/Next.js, Svelte, Leptos, and plain HTML projects.

Updated Apr 4, 2026

Search Tags:#ui #frontend #react #vue #ddd #component #fp

Ready to run

npx skills add https://github.com/asalhamed/dev-agents --skill frontend-dev-asalhamed

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: frontend-dev
Source: https://github.com/asalhamed/dev-agents/tree/main/frontend-dev
Command: npx skills add https://github.com/asalhamed/dev-agents --skill frontend-dev-asalhamed

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Build FP-first frontend UI components to ensure pure rendering and predictable behavior.

Core Features & Use Cases

Reusable presentational components across frameworks (Vue/Nuxt, React/Next.js, Svelte, Leptos, plain HTML)
Enforces unidirectional data flow, domain-language naming, and separation of concerns
Accessibility and testing guidance embedded in the workflow

Quick Start

Implement a UI component following the project’s FP-first patterns.

Frequently Asked Questions about frontend-dev

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

FAQPage Schema

How do I build pure UI components with predictable behavior in React?▼

To build pure UI components in React, enforce unidirectional data flow and strict separation of concerns between UI rendering and API calls. This functional programming approach ensures predictable behavior by maintaining pure rendering.

What is the best way to enforce domain-driven design naming in frontend development?▼

Enforcing domain-language naming in frontend development involves mapping presentational component names directly to ubiquitous domain terms. This pattern ensures strict separation of concerns and unidirectional data flow across Vue, React, or Svelte projects.

Does this functional programming frontend approach work with Vue and Svelte?▼

Yes, this functional programming frontend approach works with Vue/Nuxt, Svelte, Leptos, and plain HTML projects. It applies unidirectional data flow and pure presentational components universally across these frameworks to ensure predictable rendering.

How do I separate API calls from UI components in frontend state management?▼

To separate API calls from UI components, you extract data fetching logic into isolated modules and pass data down through unidirectional data flow. This strict separation of concerns ensures presentational components remain pure and predictable.

Why should I use pure components for frontend state management integration?▼

You should use pure components for state management integration to guarantee predictable rendering and eliminate side effects. By enforcing unidirectional data flow, presentational components receive state as props without mutating external data directly.