Can I choose between Biome and ESLint?

Yes, while the skill recommends Biome for its speed and unified linting/formatting, it provides an option to use a traditional ESLint and Prettier setup if preferred.

What is a feature-based directory structure?

It is an organizational pattern where code is grouped by domain or functionality (e.g., /features/auth) rather than by file type, making large projects easier to navigate.

When does this skill activate?

It activates automatically when you use prompts like 'create a Next.js project', 'initialize a new app', or 'set up a new project' within Claude Code.

Which package manager does it use?

The skill defaults to pnpm for its efficiency and speed, ensuring a faster installation process and better disk space management.

Does it support the Next.js App Router?

Yes, it specifically configures projects using the App Router, TypeScript, and the src directory to align with modern Next.js recommendations.

Next.js Project Initializer

Name: Next.js Project Initializer
Author: khw1031

bykhw1031

•

开发者工具

Automates the creation and configuration of production-ready Next.js projects using a scalable feature-based architecture.

This skill streamlines the entire Next.js project setup process by simulating a multi-expert team including a Frontend Architect, DevOps Engineer, and DX Specialist. It handles everything from environment preparation and pnpm installation to configuring shadcn/ui, setting up a feature-based directory structure, and integrating essential testing and linting tools like Vitest and Biome. By performing real-time web searches for the latest stable versions, it ensures your project starts with current industry best practices and an optimized developer experience.

主要功能

012 GitHub stars

02Integrated testing suite with Vitest and React Testing Library

03Automated environment setup with Node.js version management and pnpm

04Automated CLAUDE.md generation for project-specific rules and context

05Standardized feature-based directory architecture for enterprise scalability

06Pre-configured UI systems using shadcn/ui, Tailwind CSS, and CVA

使用场景

01Starting a new professional Next.js application with industry-standard defaults

02Standardizing project structure and toolsets across development teams

03Rapidly prototyping web applications with a production-grade boilerplate

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add khw1031/hynu-plugins nextjs-project-initializer

For use in Claude.ai and ChatGPT

Download Skill