What is the benefit of using Apidog MCP with this skill?

Apidog MCP acts as the single source of truth for your API, allowing the skill to automatically regenerate TypeScript types and ensure frontend/backend alignment.

Does this skill work with existing React projects?

Yes, it can be used as a reference to refactor existing SPAs toward a more maintainable, feature-based structure and modern TanStack-driven data layer.

How does this skill handle React 19 features?

It specifically configures the environment for the React Compiler, utilizes the Actions API for server mutations, and implements hooks like useOptimistic for seamless UI updates.

How are tests handled within this architectural pattern?

The skill enforces co-locating Vitest and React Testing Library (RTL) tests next to logic files, using MSW for network stubbing to ensure isolated and reliable testing.

React 19 SPA Core Principles

Name: React 19 SPA Core Principles
Author: MadAppGang

byMadAppGang

•

177

Aprendizaje y Documentación

Enforces architectural standards and production-grade best practices for modern React 19 Single Page Applications.

Acerca de

This skill provides a comprehensive blueprint for building robust React 19 applications using the TanStack ecosystem, Vite, and TypeScript. It establishes a strict project structure that separates UI from data logic, integrates the React Compiler for automatic performance optimization, and mandates the use of Apidog MCP as the source of truth for API types. Ideal for maintaining consistency across teams, it ensures every PR follows established rules for routing, state management, and testing while utilizing the latest React patterns.

Características Principales

177 GitHub stars
Enforced testing standards using Vitest and React Testing Library.
Standardized feature-based project architecture for scalable SPAs.
Type-safe data fetching patterns using TanStack Query and Apidog MCP.
React 19 Compiler integration for automated performance optimization.
File-based routing protocols with TanStack Router and prefetching.

Casos de Uso

Automating architectural reviews and code consistency during pull requests.
Onboarding developers to standardized frontend architectural patterns.
Bootstrapping new production-ready React 19 projects with a proven stack.

Acerca de

Características Principales

177 GitHub stars
Enforced testing standards using Vitest and React Testing Library.
Standardized feature-based project architecture for scalable SPAs.
Type-safe data fetching patterns using TanStack Query and Apidog MCP.
React 19 Compiler integration for automated performance optimization.
File-based routing protocols with TanStack Router and prefetching.

Casos de Uso

Automating architectural reviews and code consistency during pull requests.
Onboarding developers to standardized frontend architectural patterns.
Bootstrapping new production-ready React 19 projects with a proven stack.