Does this skill enforce specific styling conventions?

Yes, it enforces a compact UI design system, particularly for Ant Design tables, using specific padding and line-height rules to ensure high information density.

How does this skill handle desktop-specific functionality?

It provides specialized patterns for Tauri command calls, ensuring all frontend-to-backend communication is handled through centralized bindings with proper error state management.

Why does this skill forbid the use of 'as any'?

To maintain high code quality and runtime reliability, the skill mandates the use of precise types or type guards, preventing common runtime errors associated with loose typing.

Can this skill help with frontend performance issues?

Absolutely. It includes guidelines for using React's memoization hooks and recommends virtualized scrolling for large data sets to keep the UI responsive.

React & TypeScript Frontend Architecture

Name: React & TypeScript Frontend Architecture
Author: cacr92

bycacr92

0•

设计工具

Enforces high-quality React and TypeScript development standards with Ant Design integration and Tauri desktop optimization.

This skill provides a comprehensive framework for building production-ready frontend interfaces using React, TypeScript, and Ant Design. It enforces strict coding standards, including the elimination of 'any' types through precise type guarding and the replacement of console logging with professional UI feedback. Specifically optimized for Tauri-based desktop applications, it centralizes command handling and implements high-performance patterns like list virtualization and compact UI layouts to ensure a consistent, efficient developer experience.

主要功能

01Centralized Tauri command integration via dedicated bindings for secure desktop interop.

02Standardized Ant Design patterns for compact, high-density table and form layouts.

03Performance optimization through useMemo, useCallback, and virtualized list rendering.

04Professional error handling utilizing Ant Design notification components over console logs.

05Strict TypeScript enforcement using type guards and precise interfaces instead of 'any'.

060 GitHub stars

使用场景

01Implementing robust, type-safe data fetching and state management patterns.

02Developing complex desktop application interfaces with React and Tauri.

03Standardizing UI consistency and performance across large-scale Ant Design projects.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cacr92/wereply react-typescript-development

For use in Claude.ai and ChatGPT

Download Skill