skills.rest
MileniumTick
MileniumTickCOMMUNITY
Explore all skills by this author →
GitHub

frontend-react

Create scalable React frontends with TanStack, Tailwind, and Eden API client.

Updated Mar 25, 2026
Search Tags:#react#tanstack#tailwind#ui-patterns#frontend-patterns#componentization#eden-api
One-click install
npx skills add https://github.com/MileniumTick/skills --skill frontend-react-mileniumtick
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-react
Source: https://github.com/MileniumTick/skills/tree/main/skills/frontend-react
Command: npx skills add https://github.com/MileniumTick/skills --skill frontend-react-mileniumtick

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a scalable React frontend pattern library to accelerate development and enforce consistency across teams by standardizing structure, tooling, and best practices.

Core Features & Use Cases

  • Pattern-based project structure for scalable apps using TanStack, Tailwind, and Eden client
  • Typed API integration and reusable UI components across features like auth, users, and dashboard
  • Guided patterns for state management with TanStack Query, Jotai, and Radix UI
  • Real-world use cases and onboarding guidance for rapid team ramp-up

Quick Start

Initialize a React project and wire in the Eden-based API client, TanStack hooks, and the feature-based layout described above.

Frequently Asked Questions about frontend-react

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

FAQPage Schema
How do I structure a scalable React frontend with TanStack and Tailwind?▼

Structure a scalable React frontend using a feature-first layout that modularizes auth, users, and dashboards. This pattern integrates TanStack Query, Tailwind, and Eden API client to enforce component reuse and typed data-fetching across teams.

What's the best way to integrate typed APIs in a React SPA?▼

Integrate typed APIs in a React SPA using the Eden API client. This pattern pairs Eden with TanStack Query to provide end-to-end typed data fetching, ensuring safe and reusable state management across feature modules.

How does state management work with TanStack Query, Jotai, and Radix UI?▼

State management combines TanStack Query for server state and Jotai for client state, while Radix UI handles reusable component behavior. These guided patterns ensure predictable data flow within modular React features.

Can I use this React pattern library for team onboarding and rapid ramp-up?▼

Yes, this React pattern library is designed for rapid team ramp-up. It provides real-world use cases and standardized feature-based layouts, allowing new developers to quickly understand modular structure and reusable UI component conventions.

Do I need a specific API client to use these React frontend patterns?▼

Yes, these React frontend patterns require the Eden-based API client. Wiring the Eden client alongside TanStack hooks and the feature-first layout is necessary to achieve typed API integration and self-contained modular features.

What limitations exist when building modular React features with Jotai and Radix UI?▼

These modular React patterns target SPA projects requiring self-contained feature structures. They are optimized for TanStack Query, Jotai, and Radix UI, meaning teams relying on Redux or non-feature-based architectures may need structural adjustments.

Related Skills

Explore More Software Engineering Skills→
agusmdevagusmdev
5

tanstack-shadcn-setup

Configure Tailwind CSS v4 and shadcn/ui for TanStack Start and Router projects.

Community
Advanced
mintlifymintlify
427

doc-helper

Draft and refine Markdown/MDX documentation within Mintlify-powered sites.

Official
Basic
newkubnewkub

elysia

Develop type-safe backend services with Elysia on the Bun runtime.

Community
Intermediate
michelhaussairemichelhaussaire

react-state-management

Implement React state management patterns with Redux Toolkit, Zustand, Jotai, or React Query.

Community
Advanced