frontend-dev-workflow

Standardize Vue 3 frontend workflows with zod validation aligned to .NET Minimal API backends.

1|Updated Jan 25, 2026
One-click install
npx skills add https://github.com/a35506322/Lab.Todo --skill frontend-dev-workflow
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-dev-workflow
Source: https://github.com/a35506322/Lab.Todo/tree/main/.cursor/skills/frontend-dev-workflow
Command: npx skills add https://github.com/a35506322/Lab.Todo --skill frontend-dev-workflow

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill solves the problem of inconsistent, ad-hoc frontend development processes for common tasks like new feature implementation, bug fixing, and code refactoring, which often lead to backend integration errors and deviation from project coding standards.

Core Features & Use Cases

  • Standardized Development Workflow: Provides a clear, step-by-step process for all common frontend development tasks to ensure consistency across development work.
  • Backend API Alignment: Guides developers to review relevant backend API specifications first to ensure frontend implementation matches expected request and response formats.
  • Validated Form Implementation: Enforces the use of zod for form validation that exactly matches backend API request validation rules to prevent integration issues.
  • Use Case: When adding a new todo item creation feature to the Vue 3 todo-web frontend, this skill guides you to first review the corresponding backend API spec, design the UI following project standards, then implement code with matching zod validation.

Quick Start

Use the frontend-dev-workflow skill to implement the new todo item creation feature in the todo-web frontend project.

Frequently Asked Questions about frontend-dev-workflow

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

FAQPage Schema
How do I align Vue 3 frontend form validation with backend API request rules?

You can align Vue 3 frontend form validation with backend API rules by using zod to enforce exact matches between frontend validation schemas and backend API request validation rules. This prevents data integration errors and ensures consistency.

What is the best way to standardize a Vue 3 frontend development workflow for new features?

The best way to standardize a Vue 3 frontend development workflow is to follow a step-by-step process covering API specification review, UI design, and code implementation. This enforces coding standards and reduces backend integration errors for new feature implementation.

How do I prevent backend integration errors when refactoring frontend code?

To prevent backend integration errors when refactoring frontend code, review the relevant backend API specifications first, then implement changes while maintaining exact alignment between zod form validation and the API request validation rules.

Does this frontend workflow skill work with .NET Minimal API backends?

Yes, this frontend workflow applies directly to Vue 3 frontend projects paired with .NET Minimal API backends. It guides developers through API specification review and enforces zod validation alignment to eliminate integration inconsistencies.

Why do I need zod validation for frontend bug fixing tasks?

You need zod validation for frontend bug fixing tasks to enforce exact alignment between frontend form validation rules and backend API request validation. This prevents integration issues and ensures adherence to project coding standards during fixes.

What should I do if my Vue 3 form validation rules do not match the backend API?

If your Vue 3 form validation rules do not match the backend API, you should review the backend API specifications and update your zod validation schemas to exactly match the backend API request validation rules, ensuring successful build execution.