Skills
.Work. You
Rest

rule-frontend-utils

Community

Enforce consistent frontend utility conventions.

Software Engineering#typescript#testing#frontend#guidelines#coding-standards#utils#frontend-utils
Authorbtabaska
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Frontend development often suffers from inconsistent utility placement, naming, and testing practices. This Skill codifies conventions for when to extract utilities into a shared frontend/src/utils/ directory versus inline usage, promoting consistency and maintainability across the Simpler Grants frontend.

Core Features & Use Cases

  • Extraction vs Inline Rules: Clear criteria to decide when a helper belongs in frontend/src/utils/ and when a component-local helper is sufficient.
  • Naming & Structure Guidance: Naming conventions like dateUtil.ts, generalUtils.ts, and avoiding single-function files to reduce fragmentation; guidance on domain subfolders like applyForm/, attachment/, etc.
  • Runtime Safety & Testing: Guidelines for edge-runtime safety, middleware considerations, and colocated tests with a preference for pure functions and test coverage.

Quick Start

Review the current frontend utils usage in the repository and decide where to extract utilities and how to name them.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: rule-frontend-utils
Download link: https://github.com/btabaska/simpler-grants-documentation-automation/archive/main.zip#rule-frontend-utils

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.