skills.rest
lklimek
lklimekCOMMUNITY
Explore all skills by this author →
GitHub

frontend-best-practices

Review frontend code against best practices for TypeScript, React, Vue, Svelte, CSS, accessibility, and testing.

1|Updated Feb 20, 2026
Search Tags:#typescript#testing#code review#best practices#accessibility#frontend#react
One-click install
npx skills add https://github.com/lklimek/claudius --skill frontend-best-practices-lklimek
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-best-practices
Source: https://github.com/lklimek/claudius/tree/main/skills/frontend-best-practices
Command: npx skills add https://github.com/lklimek/claudius --skill frontend-best-practices-lklimek

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides comprehensive guidance and checks for frontend development, ensuring code adheres to modern best practices, improves maintainability, and enhances user experience.

Core Features & Use Cases

  • Code Standards: Enforces TypeScript, ESLint, Prettier, and type safety.
  • Testing & Performance: Guides on Vitest/Jest, accessibility (axe-core), and performance (Lighthouse CI).
  • Best Practices: Recommends semantic HTML, CSS custom properties, component composition, and proper state management.
  • Use Case: When writing a new React component, use this Skill to ensure it follows established patterns for state management, accessibility, and testing, preventing common pitfalls.

Quick Start

Review the attached React component file 'UserProfile.jsx' for adherence to frontend best practices.

Frequently Asked Questions about frontend-best-practices

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

FAQPage Schema
How do I check my React component for accessibility and state management best practices?▼

Code review for frontend best practices identifies common pitfalls in TypeScript, React, and CSS by enforcing standards in type safety, accessibility, and component composition to recommend actionable solutions.

What are the best practices for enforcing TypeScript and ESLint standards in frontend code?▼

Frontend best practices enforce TypeScript and ESLint standards by mandating type safety, proper component composition, and CSS custom properties to improve code maintainability and quality assurance.

How do I set up testing and performance checks for Vue and Svelte components?▼

Set up testing and performance checks for Vue and Svelte using Vitest or Jest for unit tests, and Lighthouse CI for performance monitoring to ensure adherence to modern frontend standards.

Does this frontend review guidance work with CSS custom properties and Svelte frameworks?▼

Yes, this frontend review guidance works with CSS custom properties and Svelte frameworks, providing comprehensive checklists that enforce standards across TypeScript, React, Vue, and CSS.

Why should I use a checklist for frontend code reviews instead of manual checks?▼

Using a checklist for frontend code reviews systematizes quality assurance by identifying common pitfalls in accessibility, testing, and type safety that manual checks often miss during development.

Related Skills

Explore More Software Engineering Skills→
patricio0312revpatricio0312rev
5

eslint-prettier-config

Configure ESLint and Prettier for TypeScript and React projects.

Community
Advanced
HomericIntelligenceHomericIntelligence
18

run-tests

Execute Mojo or Python test suites and generate validation reports.

Official
Basic
guichefferguicheffer
3

web-accessibility

Enforce WCAG 2.1 AA compliance using semantic HTML, ARIA attributes, axe-core, and jest-axe automated tests.

Community
Intermediate
softsparksoftspark
161

lint

Detect and execute linters and type checkers for Python, JavaScript, PHP, Go, Dart, and Rust projects.

Community
Intermediate