cmd-frontend-frontend

Diagnose frontend project setups for UI components across React, Next.js, and Svelte.

2|Updated Jan 3, 2026

Search Tags:#frontend #react #framework #nextjs #design-system #ui-patterns

Ready to run

npx skills add https://github.com/jlaws/dotfiles --skill cmd-frontend-frontend

💬 Prompt for ChatGPT / Claude Chat▼

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Frontend Consultation Skill helps teams quickly diagnose and align frontend stacks by identifying the framework, styling approach, and component structure of a project, enabling faster design system decisions and implementation plans.

Core Features & Use Cases

Detect frontend framework automatically from config files and package.json
Identify styling approach (Tailwind, CSS modules, styled-components, design tokens)
Check component structure and design system readiness to scope work
Use case: when starting a new UI module, you can rapidly understand the existing stack and recommended integration paths.

Quick Start

Describe your target component or page and I will analyze the frontend setup and propose a plan.

Frequently Asked Questions about cmd-frontend-frontend

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

FAQPage Schema

How do I detect the frontend framework used in a project?▼

Frontend framework detection involves scanning config files and package.json to identify React, Next.js, or Svelte setups and assess the project's framework choices and architecture.

What is the best way to identify a CSS styling approach in an existing codebase?▼

To identify a CSS styling approach, scan the project structure to detect methods like Tailwind, CSS modules, styled-components, or design tokens used for UI components.

Can I use this to check design system readiness when starting a new UI module?▼

Yes, you can check design system readiness by evaluating the existing component structure and styling approach to scope work and propose an actionable integration plan.

Does this frontend consultation support React and Next.js project stacks?▼

Yes, this frontend consultation supports React and Next.js project stacks, alongside Svelte, to diagnose UI component setups and provide actionable framework recommendations.

How to scope work for a new UI page using existing frontend patterns?▼

To scope work for a new UI page, diagnose the current frontend setup, identify the framework and styling method, and map the component architecture to formulate an implementation plan.