skills.rest
maneeshanif
maneeshanifCOMMUNITY
Explore all skills by this author →
GitHub

nextjs-setup

Create a Next.js 16+ frontend with TypeScript, Tailwind CSS, and App Router.

Updated Dec 11, 2025
Search Tags:#typescript#next.js#tailwind#zustand#app-router#axios
One-click install
npx skills add https://github.com/maneeshanif/todo-spec-driven --skill nextjs-setup
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nextjs-setup
Source: https://github.com/maneeshanif/todo-spec-driven/tree/main/.claude/skills/nextjs-setup
Command: npx skills add https://github.com/maneeshanif/todo-spec-driven --skill nextjs-setup

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a structured, repeatable approach to creating modern Next.js 16+ frontends with TypeScript, Tailwind CSS, App Router, and common tooling. It accelerates project initialization and ensures a consistent architecture for Phase 2 workstreams.

Core Features & Use Cases

  • Project bootstrap: Create a Next.js 16+ app with TypeScript, Tailwind, App Router, and a src/ directory.
  • Core dependencies: Install Zustand, Axios, Framer Motion, React Hook Form, Zod, and related utilities for robust state, HTTP, and forms.
  • Project structure: Scaffold UI components, stores, hooks, and utilities; configure Tailwind and import aliases.
  • Use Case: Kick off a new frontend for a Todo app with a scalable structure ready for Phase 2 enhancements.

Quick Start

Create the app with TypeScript and App Router, then install core dependencies (zustand, axios, framer-motion, react-hook-form, zod) and set up the recommended folder structure for a maintainable frontend.