skills.rest
d0whc3r
d0whc3rCOMMUNITY
Explore all skills by this author →
GitHub

frontend-dev-guidelines

Define architectural standards for React projects with Suspense-first data fetching and TypeScript.

Updated Mar 21, 2026
Search Tags:#typescript#architecture#performance#suspense#frontend#react#routing
One-click install
npx skills add https://github.com/d0whc3r/hackaton-cubepath --skill frontend-dev-guidelines-d0whc3r
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-dev-guidelines
Source: https://github.com/d0whc3r/hackaton-cubepath/tree/main/.agents/skills/frontend-dev-guidelines
Command: npx skills add https://github.com/d0whc3r/hackaton-cubepath --skill frontend-dev-guidelines-d0whc3r

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Establishes strict architectural and performance standards for frontend code to improve maintainability, performance, and collaboration.

Core Features & Use Cases

  • Architectural Doctrine: Suspense-first data fetching, feature-based code organization, and strict TypeScript discipline.
  • Best practices for components, routing, styling, and data fetching across React apps.
  • Use case: when starting a new frontend project or refactoring large codebases to enforce consistency.

Quick Start

Adopt these guidelines to structure React projects with Suspense-first data fetching, feature-based organization, and strict TypeScript discipline.

Frequently Asked Questions about frontend-dev-guidelines

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

FAQPage Schema
What is Suspense-first data fetching in React?▼

Suspense-first data fetching is an architectural pattern that suspends component rendering until data loads, ensuring strict performance standards and maintainability across React applications.

How do I structure a React project using feature-based organization?▼

Implement feature-based organization by grouping React components, routing, and styling by domain feature rather than file type, enforcing strict TypeScript discipline to improve codebase maintainability.

Can I apply frontend coding standards to an existing React codebase?▼

Yes, these frontend guidelines provide a clear adoption path for existing codebases, allowing you to incrementally refactor components and routing to meet strict architectural standards.

What's the best way to enforce strict TypeScript discipline in frontend architecture?▼

The best way to enforce strict TypeScript discipline is applying architectural guidelines that cover canonical patterns for components, routing, and styling across your React application.

Do I need these frontend guidelines for a new React project?▼

Yes, adopting these guidelines when starting a new frontend project establishes architectural doctrine and performance standards immediately, preventing maintainability issues as the codebase scales.

Related Skills

Explore More Software Engineering Skills→
korchasakorchasa
3

af-skill-configure-strict-typescript

Configure Deno projects with strict TypeScript mode and enforced coding standards.

Community
Advanced
VoDaiLoczVoDaiLocz
24

lint-and-validate

Automate linting and static analysis of code in CI pipelines.

Community
Intermediate
gajjalaashok75-UIgajjalaashok75-UI
2

frontend-dev-guidelines

Define React and TypeScript frontend standards with Suspense and TanStack Query.

Community
Advanced
tmarsbrtmarsbr

frontend-dev-guidelines

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

Community
Advanced