How does it handle UI styling?

It enforces a TailwindCSS-only approach, avoiding custom blocks in favor of utility classes and Nuxt UI components.

Does this skill support NestJS backend development?

No, this skill is specifically for Nuxt 4 frontend development. For NestJS backend tasks, you should use the 'generating-nest-servers' skill.

How are backend API types managed?

The skill strictly uses generated types from 'types.gen.ts' and API calls from 'sdk.gen.ts' to ensure the frontend is always in sync with the backend.

Which validation library does this skill use for forms?

This skill utilizes Valibot for all form validation and type inference, following the preferred lenne.tech standard.

Is this compatible with older Nuxt 3 projects?

This skill is specifically optimized for Nuxt 4 patterns, including the 'app/' directory structure and specialized composable rules.

Nuxt 4 Frontend Development (lenne.tech)

Name: Nuxt 4 Frontend Development (lenne.tech)
Author: lenneTech

bylenneTech

设计工具

Develops production-ready Nuxt 4 frontend applications using strict TypeScript, Valibot forms, and automated API integration.

关于

This skill streamlines frontend development within the lenne.tech ecosystem by enforcing Nuxt 4 patterns, strict TypeScript standards, and seamless backend integration through generated SDK types. It enables Claude to build components using Nuxt UI 4, manage state with SSR-safe composables, handle programmatic modals via useOverlay, and implement robust form validation with Valibot. By automating the boilerplate of API consumption and ensuring directory structure compliance, it significantly reduces development time and prevents architectural errors in full-stack monorepos.

主要功能

Programmatic modal management via the useOverlay composable
Type-safe form building with Valibot validation schemas
Automated API integration using generated types and SDKs
TailwindCSS-only styling for consistent UI development
Nuxt 4 directory structure enforcement (app/ folder patterns)
0 GitHub stars

使用场景

Building complex data-driven dashboards with Nuxt UI 4
Integrating frontend components with NestJS backend APIs
Implementing multi-step forms with strict validation and error handling

关于

主要功能

Programmatic modal management via the useOverlay composable
Type-safe form building with Valibot validation schemas
Automated API integration using generated types and SDKs
TailwindCSS-only styling for consistent UI development
Nuxt 4 directory structure enforcement (app/ folder patterns)
0 GitHub stars

使用场景

Building complex data-driven dashboards with Nuxt UI 4
Integrating frontend components with NestJS backend APIs
Implementing multi-step forms with strict validation and error handling