istiou-dev

Generate React components, CRUD services, Zustand stores, and routes for UmiJS projects.

Updated Mar 27, 2026
One-click install
npx skills add https://github.com/NoManPlay/my-skills --skill istiou-dev
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: istiou-dev
Source: https://github.com/NoManPlay/my-skills/tree/main/skills/istiou-dev
Command: npx skills add https://github.com/NoManPlay/my-skills --skill istiou-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Istiou Web projects often require repetitive, standards-compliant development of components, services, stores, and routes, which wastes time and risks inconsistency across the codebase.

Core Features & Use Cases

  • Component Generation: Creates React function components following project conventions for props, structure, and styling with @ant-design/use-emotion-css.
  • Service/API Scaffolding: Generates CRUD-style API service functions using @umijs/max request with consistent typing and request patterns.
  • State Management Setup: Produces Zustand store templates including basic state patterns and optional persist configurations.
  • Routing Configuration: Generates UmiJS module route configs, entry routing, and wrapper-based access control patterns.

Use case example: When onboarding a new feature module, you can ask the assistant to generate the page route, the required service layer CRUD functions, a Zustand store for the module state, and the core UI components that render the data.

Quick Start

Ask the assistant to generate a new module for your Istiou Web project by scaffolding a component, a page route, a CRUD service, and a Zustand store using the existing rules in the skill.

Frequently Asked Questions about istiou-dev

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

FAQPage Schema
How do I generate React components and CRUD services for UmiJS projects?

Generate React components and CRUD services for UmiJS projects by using deterministic templates that scaffold function components with @ant-design/use-emotion-css and API service functions with @umijs/max request patterns. This ensures consistent TypeScript typing and structure across your feature modules.

What is the best way to set up Zustand stores for new React feature modules?

Setting up Zustand stores for new React feature modules is done by producing store templates that include basic state patterns and optional persist configurations. This provides consistent client-side state management tailored to your module's specific requirements.

Can I scaffold UmiJS module routes and access control wrappers automatically?

Yes, you can scaffold UmiJS module routes and access control wrappers automatically. The generation process creates UmiJS 4.x module route configs, entry routing, and wrapper-based access control patterns to maintain consistent navigation structures.

Does this code generation tool support React 18 and Ant Design Pro conventions?

Yes, the code generation tool supports React 18 and Ant Design Pro conventions. It scaffolds components, services, and stores using TypeScript typing and adheres to the styling and structural standards required by Ant Design Pro.

How to scaffold a complete feature module with pages, services, and state management?

Scaffold a complete feature module by generating the page route, required service layer CRUD functions, a Zustand store for module state, and core UI components. This template-based approach ensures all parts of your feature module are wired together consistently.