Does it support Tailwind CSS v4 migrations?

Yes, it specifically handles Tailwind v4 patterns, including the migration to the cn() utility, cva() variants, and the removal of deprecated v3 utility behaviors.

Which frameworks and libraries are supported?

It includes deep support for NestJS, TypeORM, Prisma, React 19, React Router v7, Tailwind CSS v4, TanStack Query, and infrastructure tools like Terraform and AWS.

Can I review the changes before they are applied?

Yes. The workflow requires the skill to present a detailed Refactoring Plan listing every file and specific change before asking for your confirmation to proceed.

Does this skill change my application's business logic?

No, the skill is explicitly designed to perform structural and pattern-only changes. It identifies and preserves existing business logic while moving it to the appropriate architectural layers.

How does it handle different coding standards for frontend and backend?

The skill uses a dynamic loading strategy, reading specific reference files (e.g., BACKEND_CONVENTION.md vs FRONTEND_CONVENTION.md) based on the file types detected in the refactoring scope.

Convention-Based Code Refactor

Name: Convention-Based Code Refactor
Author: sellernote

bysellernote

•

開発者ツール

Refactors existing code to align with specific architectural patterns and development conventions without altering business logic.

This skill automates the process of aligning legacy or non-compliant code with modern development standards across backend, frontend, and infrastructure layers. It intelligently analyzes source files against a comprehensive suite of conventions—ranging from NestJS 3-layer architecture and TypeORM patterns to React 19 components and Tailwind v4 styling—to perform structural transformations that ensure consistency and maintainability. By separating business logic from architectural concerns, it provides a safe, incremental path for modernizing codebases while maintaining strict adherence to project-specific rules like naming strategies, decorator usage, and dependency directions.

主な機能

01Priority-based application of changes (MUST, SHOULD, and RECOMMEND levels)

02Dynamic loading of domain-specific conventions from reference documentation

03Multi-layer refactoring across backend, frontend, and infrastructure files

04Structural-only transformations that preserve core business logic and behavior

051 GitHub stars

06Interactive refactoring plans requiring user approval before execution

ユースケース

01Migrating frontend components to React 19, React Router v7 framework mode, and Tailwind v4

02Standardizing database schemas, ORM entities, and infrastructure-as-code files to follow consistent naming conventions

03Modernizing legacy backend services to follow strict 3-layer architecture and DTO patterns

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add sellernote/sellernote-vibecode-plugin convention-refactor

For use in Claude.ai and ChatGPT

Download Skill