skills.rest
involvex
involvexCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

frontend-dev-guidelines

Enforce React and TypeScript frontend standards with Suspense-first data fetching.

Updated Mar 7, 2026
Search Tags:#typescript#architecture#best practices#suspense#react#frontend development
One-click install
npx skills add https://github.com/involvex/llms-remote --skill frontend-dev-guidelines-involvex
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-dev-guidelines
Source: https://github.com/involvex/llms-remote/tree/main/.agents/skills/frontend-dev-guidelines
Command: npx skills add https://github.com/involvex/llms-remote --skill frontend-dev-guidelines-involvex

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enforces opinionated, production-grade frontend development standards to ensure scalability, predictability, and maintainability in modern React + TypeScript applications.

Core Features & Use Cases

  • Architectural Enforcement: Guides development with Suspense-first data fetching, feature-based organization, and strict TypeScript.
  • Performance Optimization: Provides clear guidelines on lazy loading, memoization, and performance defaults.
  • Use Case: A senior engineer joining a new project can use this Skill to quickly understand and adhere to the established frontend best practices, ensuring consistency across the codebase.

Quick Start

Review the 'Core Architectural Doctrine' section to understand the non-negotiable standards for new development.

Frequently Asked Questions about frontend-dev-guidelines

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

FAQPage Schema
What is the best way to structure a scalable React and TypeScript application?▼

A scalable React and TypeScript application benefits from a feature-based architecture. This approach organizes code by domain features rather than technical roles, ensuring predictability and maintainability as the project grows.

How do I implement Suspense-first data fetching in modern React?▼

Implementing Suspense-first data fetching in modern React involves using Suspense boundaries to handle loading states declaratively. This standardizes asynchronous UI rendering, allowing components to suspend until data is fully resolved.

Does this approach enforce strict TypeScript standards for React development?▼

Yes, strict TypeScript standards are enforced for React development. This ensures type safety across feature-based modules, reducing runtime errors and improving overall code predictability and maintainability.

How do I configure lazy loading and performance defaults in a React app?▼

Configuring lazy loading and performance defaults in a React app requires clear guidelines on code splitting and memoization. This optimizes load times by deferring non-critical component rendering until explicitly needed.

Can I use TanStack Router conventions with a feature-based React architecture?▼

Yes, TanStack Router conventions integrate seamlessly with a feature-based React architecture. This combination enforces predictable routing structures alongside domain-organized modules, maintaining strict scalability and maintainability standards.

Related Skills

Explore More Software Engineering Skills→
martimramosmartimramos
1

forge-lang-node

Standardize Node.js project setup with jest or vitest, eslint, and prettier.

Community
Intermediate
omeraltnomeraltn

agency-api-tester

Validate RESTful API functionality, security, and performance in CI/CD pipelines.

Community
Advanced
locdinh209locdinh209

frontend-dev-guidelines

Guide React/TypeScript frontend development with Suspense, lazy loading, and TanStack Query.

Community
Advanced
andymsunandymsun
1

nextjs-app-router-patterns

Implement Next.js 14+ App Router patterns for Server Components and data fetching.

Community
Advanced