mock-codegen

Generates JavaScript/TypeScript mock data for frontend list and pagination UI testing.

1.0k|71|Updated Apr 1, 2025
One-click install
npx skills add https://github.com/ChenyCHENYU/Robot_Admin --skill mock-codegen
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mock-codegen
Source: https://github.com/ChenyCHENYU/Robot_Admin/tree/main/.github/skills/mock-codegen
Command: npx skills add https://github.com/ChenyCHENYU/Robot_Admin --skill mock-codegen

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Developers often need realistic mock data during frontend development to test UI components and workflows without relying on backend APIs or data sources.

Core Features & Use Cases

  • Mock Data Generation: Create realistic datasets based on page specifications, including common fields like names, dates, and statuses.
  • Pagination Simulation: Generate paged mock responses to mimic backend API behavior for list views.
  • Use Case: When designing a new data table, generate mock entries to immediately visualize and test scrolling, filtering, and pagination features.

Quick Start

Invoke the script to generate mock data for your frontend component to test layout and interactions.

Frequently Asked Questions about mock-codegen

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

FAQPage Schema
How do I generate mock data for frontend UI testing without a backend API?

To generate mock data for frontend testing, you can use script-based data generators that create realistic datasets including common fields like names, dates, and statuses. This allows you to test UI components and workflows independently of backend APIs.

Can I simulate pagination responses for list views using JavaScript?

Yes, you can simulate paged mock responses in JavaScript to mimic backend API behavior for list views. This helps test scrolling, filtering, and pagination features in your UI components by providing structured pagination data.

Does the mock data generation work with TypeScript frameworks?

The mock data generators are implemented in JavaScript and TypeScript, making them compatible with frontend frameworks. This compatibility accelerates development workflows by seamlessly integrating mock data into your existing tech stack.

What is the best way to mock JSON list entries for data tables?

The best way to mock JSON list entries for data tables is to use a data generation script that creates realistic entries based on page specifications. This approach immediately visualizes and tests layout interactions without relying on real data sources.

When do I need mock data during frontend development?

You need mock data during frontend development when you are designing new UI components and must test layout, scrolling, and filtering features. It allows you to proceed with development without waiting for real backend data sources to become available.