frontend-dev-guidelines

Name: frontend-dev-guidelines
Availability: InStock
Author: ngocp-0847

Guide React development with Suspense, TanStack Query, and MUI v7.

1|Updated Dec 15, 2025

Search Tags:#typescript #suspense #frontend #react #tanstack #router

One-click install

npx skills add https://github.com/ngocp-0847/agent-kit --skill frontend-dev-guidelines-ngocp-0847

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: frontend-dev-guidelines
Source: https://github.com/ngocp-0847/agent-kit/tree/main/templates/skills/frontend-development
Command: npx skills add https://github.com/ngocp-0847/agent-kit --skill frontend-dev-guidelines-ngocp-0847

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a comprehensive guide for modern React development, focusing on Suspense-based data fetching, lazy loading, proper file organization, routing, styling with MUI v7, and TypeScript best practices. Use when creating components, pages, features, fetching data, styling, routing, or working with frontend code.

Core Features & Use Cases

Data fetching patterns: UseSuspenseQuery with TanStack Query for clean, loading-free components.
File organization & routing: Features directory structure, import aliases, and TanStack Router setup.
Styling & performance: MUI v7 styling rules and TypeScript best practices.

Quick Start

Create a new component or page following the guidelines and wire it into your app using Suspense boundaries, TanStack Query, and TanStack Router.