before-frontend-dev

Reads frontend development guidelines from .trellis/spec before starting coding tasks.

Updated Mar 24, 2026
One-click install
npx skills add https://github.com/yizhitangtongxue/opencode-switch --skill before-frontend-dev-yizhitangtongxue
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: before-frontend-dev
Source: https://github.com/yizhitangtongxue/opencode-switch/tree/main/.agents/skills/before-frontend-dev
Command: npx skills add https://github.com/yizhitangtongxue/opencode-switch --skill before-frontend-dev-yizhitangtongxue

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Developers often start writing frontend code without reviewing project-specific coding standards, leading to inconsistent components, hooks, and state management patterns that require rework. ## Core Features & Use Cases - Guideline Discovery: Reads .trellis/spec/frontend/index.md to identify all available frontend guidelines. - Task-Based Routing: Directs you to the relevant guideline file based on your task, such as component work, hook work, state management, or type safety questions. - Use Case: Before building a new React component, run this Skill to load the component guidelines and type safety rules so your code follows the project's established patterns from the start. ## Quick Start Read the frontend development guidelines before I start implementing my component task.

Frequently Asked Questions about before-frontend-dev

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

FAQPage Schema
How do I follow frontend coding guidelines before writing code?▼

Read the index file at .trellis/spec/frontend/index.md to see available guidelines, then open the specific file matching your task, such as component-guidelines.md for component work or hook-guidelines.md for hooks.

What guideline file should I read for React state management?▼

Read .trellis/spec/frontend/state-management.md when your task involves state management. For type-related questions, read type-safety.md instead.

When should I read the frontend development guidelines?▼

Read them before writing any frontend code. This step is mandatory prior to starting implementation so you understand the coding standards and patterns you need to follow.

What happens if the .trellis/spec/frontend directory is missing?▼

The Skill depends on guideline files existing under .trellis/spec/frontend. If that directory is absent from your project, there are no guidelines to load and the Skill cannot fulfill its purpose.