Claude MarketplacesSubmit
levnikolaevich avatar

Ln 721 Frontend Restructure

levnikolaevich/claude-code-skills

Handles two distinct jobs: scaffolding a fresh React + Vite + TypeScript project from scratch (about 7 starter files), or taking an existing monolithic React codebase and breaking it into a proper component-based structure. The restructure mode is the interesting part. It analyzes your files, measures complexity, builds a migration plan, then extracts types, constants, hooks, and components into separate files with correct import ordering. Runs the build after to verify nothing broke. Good for when you've got a 500-line component file that needs splitting or inherited a messy frontend that never got organized. The transformation rules and thresholds are documented, so you know what triggers a split.

skills.sh installs
378
GitHub stars
591
last updated
Aug 21, 2026
View on GitHub

Install

$ npx -y skills add levnikolaevich/claude-code-skills --skill ln-721-frontend-restructure --agent claude-code

Installs into .claude/skills of the current project.

Files

Handles two distinct jobs: scaffolding a fresh React + Vite + TypeScript project from scratch (about 7 starter files), or taking an existing monolithic React codebase and breaking it into a proper component-based structure. The restructure mode is the interesting part. It analyzes your files, measures complexity, builds a migration plan, then extracts types, constants, hooks, and components into separate files with correct import ordering. Runs the build after to verify nothing broke. Good for when you've got a 500-line component file that needs splitting or inherited a messy frontend that never got organized. The transformation rules and thresholds are documented, so you know what triggers a split.

Browse the repository on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthlyAgent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any language

Details

Repository
github.com/levnikolaevich/claude-code-skills
Categories
Frontend Development, Code Review & Quality
First seen
Jun 3, 2026

More from levnikolaevich/claude-code-skills

All 128

Recommended

More Frontend Development
1galaxy-dawn avatarfrontend-designgalaxy-dawn/claude-scholarCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, 373skills.sh installs
2wsimmonds avatarnextjs-server-client-componentswsimmonds/claude-nextjs-skillsGuide for choosing between Server Components and Client Components in Next.js App Router. CRITICAL for useSearchParams (requires Suspense + 'use client'), navig364skills.sh installs
3existential-birds avatarshadcn-uiexistential-birds/beagleshadcn/ui component patterns with Radix primitives and Tailwind styling. Use when building UI components, using CVA variants, implementing compound components, 356skills.sh installs
4patricio0312rev avatarresponsive-design-systempatricio0312rev/skillsImplements responsive design systems with mobile-first breakpoints, container queries, fluid typography, and adaptive layouts using Tailwind CSS. Use when users353skills.sh installs
5borghei avatarsenior-frontendborghei/claude-skillsFrontend development for React, Next.js, TypeScript, and Tailwind CSS. Use when building React components, optimizing Next.js performance, analyzing bundle size351skills.sh installs
6jamesrochabrun avatarfrontend-designerjamesrochabrun/skillsBuild accessible, responsive, and performant frontend components with design system best practices, modern CSS, and framework-agnostic patterns.340skills.sh installs