Can I use this for existing projects?

While optimized for new projects, you can trigger this skill to help reorganize an existing codebase into a more maintainable, standardized structure.

Why is the /src directory used in this scaffolding?

The /src directory is used to separate source code from root-level configuration files, resulting in a cleaner project root and improved navigation.

What TypeScript settings are applied during scaffolding?

The skill configures a strict tsconfig.json that enables all strict type-checking and 'noUncheckedIndexedAccess' to ensure maximum type safety.

Does it include built-in state management?

Yes, it includes baseline dependencies for Zustand, providing a lightweight and scalable state management solution from the start.

Does this skill support the Next.js App Router?

Yes, it specifically scaffolds projects using the Next.js 14+ App Router directory structure, including specialized folders for API routes and server actions.

Next.js Project Scaffolder

Name: Next.js Project Scaffolder
Author: Agentient

byAgentient

0•

Productivity & Workflow

Scaffolds opinionated, production-ready Next.js 14+ project structures with strict TypeScript configurations and standardized folder patterns.

This skill streamlines the initialization of modern web applications by automatically implementing a standardized folder structure, robust TypeScript strict mode settings, and essential baseline dependencies. It promotes industry best practices such as the use of the /src directory, the App Router pattern, and organized utility layers, ensuring that every new project begins with a scalable, maintainable foundation optimized for AI-assisted development.

Key Features

01Standardized organization for components, hooks, lib, and server actions

02Architecture Decision Record (ADR) templates for documenting design choices

03Pre-configured tsconfig.json with strict type-checking and path aliases

040 GitHub stars

05Baseline dependency integration for Zod validation and Zustand state management

06Automated Next.js 14+ directory scaffolding using the App Router pattern

Use Cases

01Restructuring an existing project to follow modern App Router best practices

02Establishing a consistent boilerplate for team-based development environments

03Initializing a new full-stack web application with Next.js and TypeScript

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add agentient/vibekit nextjs-project-scaffolding

For use in Claude.ai and ChatGPT

Download Skill