Skillzwave Logo
Skillzwave

frontend-dev-guidelines

6654 stars 850 forks
85
B

Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading, useSuspenseQuery, file organization with features directory, MUI v7 styling, TanStack Router, performance optimization, and TypeScript best practices. Use when creating components, pages, features, fetching data, styling, routing, or working with frontend code.

Third-Party Agent Skill: Review the code before installing. Agent skills execute in your AI assistant's environment and can access your files. Learn more about security

Installation for Agentic Skill

View all platforms →
skilz install diet103/claude-code-infrastructure-showcase/frontend-dev-guidelines
skilz install diet103/claude-code-infrastructure-showcase/frontend-dev-guidelines --agent opencode
skilz install diet103/claude-code-infrastructure-showcase/frontend-dev-guidelines --agent codex
skilz install diet103/claude-code-infrastructure-showcase/frontend-dev-guidelines --agent gemini

First time? Install Skilz: pip install skilz

Works with 14 AI coding assistants

Cursor, Aider, Copilot, Windsurf, Qwen, Kimi, and more...

View All Agents
Download Agent Skill ZIP

Extract and copy to ~/.claude/skills/ then restart Claude Desktop

1. Clone the repository:
git clone https://github.com/diet103/claude-code-infrastructure-showcase
2. Copy the agent skill directory:
cp -r claude-code-infrastructure-showcase/.claude/skills/frontend-dev-guidelines ~/.claude/skills/
View on GitHub

Need detailed installation help? Check our platform-specific guides:

Claude Desktop Guide Claude Code Guide Troubleshooting

Related Agentic Skills

tailwind-shadcn-setup

by vanman2024

Setup Tailwind CSS and shadcn/ui component library for Next.js projects. Use when configuring Tailwind CSS, installing shadcn/ui, setting up design...

89
TECHjavascript
Marketplace

spanish-language-tutor

by sandraschi

Comprehensive Spanish language expert covering grammar, conversation, regional dialects, and language learning strategies

88
javascript
Marketplace

torch-geometric

by davila7

Graph Neural Networks (PyG). Node/graph classification, link prediction, GCN, GAT, GraphSAGE, heterogeneous graphs, molecular property prediction, ...

84
TECHjavascript
Marketplace

skill-writer

by pytorch

Guide users through creating Agent Skills for Claude Code. Use when the user wants to create, write, author, or design a new Skill, or needs help w...

76
javascript
Marketplace

Agentic Skill Details

Owner
diet103 (GitHub)
Repository
claude-code-infrastructure-showcase
Stars
6654
Forks
850
Type
Technical
Meta-Domain
development
Primary Domain
javascript
Market Score
85
Agentic Skill Grades →

Agent Skill Grade

B
Score: 85/100 Click to see breakdown

Score Breakdown

Spec Compliance
12/15
PDA Architecture
26/30
Ease of Use
21/25
Writing Style
8/10
Utility
18/20

Areas to Improve

  • Missing TOCs in long resources
  • Second-person voice usage
  • Repeated content across files

Recommendations

  • Add trigger phrases to description for discoverability
  • Add table of contents for files over 100 lines

Graded: 2026-01-05

Developer Feedback

Interesting project! This skill addresses a real need in the Claude Code ecosystem.

Browse Category

More development Agentic Skills

Report Security Issue

Found a security vulnerability in this agent skill?