nextjs-starter-kit 0.1.3 → 0.1.5

package/bin/cli.js

@@ -1,5 +1,6 @@
 #!/usr/bin/env node
-import fs from "fs";
+import { execSync } from "child_process";
+import { existsSync, mkdirSync, writeFileSync, copyFileSync } from "fs";
 import path from "path";
 import { fileURLToPath } from "url";
 
@@ -7,9 +8,25 @@ const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
 const projectName = process.argv[2] || "my-app";
-const targetDir = path.join(process.cwd(), projectName);
+const projectPath = path.resolve(process.cwd(), projectName);
 
-fs.cpSync(path.join(__dirname, "../template"), targetDir, { recursive: true });
+if (existsSync(projectPath)) {
+  console.error(`❌ Folder "${projectName}" already exists.`);
+  process.exit(1);
+}
 
-console.log(`✅ Project created at ${projectName}`);
-console.log(`👉 cd ${projectName} && pnpm install && pnpm dev`);
+console.log(`🚀 Creating Next.js app in "${projectName}"...`);
+mkdirSync(projectPath);
+
+// Copy template files
+const templateDir = path.join(__dirname, "../template");
+execSync(`cp -r ${templateDir}/* ${projectPath}`);
+
+// Init git
+execSync("git init", { cwd: projectPath, stdio: "inherit" });
+
+// Install deps
+console.log("📦 Installing dependencies...");
+execSync("npm install", { cwd: projectPath, stdio: "inherit" });
+
+console.log(`✅ Done! cd ${projectName} && npm run dev`);

package/package.json

@@ -1,81 +1,13 @@
 {
     "name": "nextjs-starter-kit",
-    "version": "0.1.3",
-    "private": false,
+    "version": "0.1.5",
     "bin": {
-        "create-nextjs-starter-kit": "bin/cli.js"
+        "create-nextjs-starter": "bin/cli.js"
     },
+    "type": "module",
     "files": [
         "bin",
-        "template",
-        "package.json",
-        "README.md"
+        "template"
     ],
-    "scripts": {
-        "dev": "next dev --turbopack",
-        "build": "pnpm lint && pnpm format &&  next build --turbopack",
-        "start": "next start",
-        "lint": "eslint",
-        "check-format": "prettier --check .",
-        "format": "prettier --write .",
-        "prepare": "husky"
-    },
-    "dependencies": {
-        "@hookform/resolvers": "^5.2.1",
-        "@next/third-parties": "^15.5.0",
-        "@radix-ui/react-accordion": "^1.2.12",
-        "@radix-ui/react-alert-dialog": "^1.1.15",
-        "@radix-ui/react-avatar": "^1.1.10",
-        "@radix-ui/react-checkbox": "^1.3.3",
-        "@radix-ui/react-collapsible": "^1.1.12",
-        "@radix-ui/react-dialog": "^1.1.15",
-        "@radix-ui/react-dropdown-menu": "^2.1.16",
-        "@radix-ui/react-label": "^2.1.7",
-        "@radix-ui/react-popover": "^1.1.15",
-        "@radix-ui/react-progress": "^1.1.7",
-        "@radix-ui/react-select": "^2.2.6",
-        "@radix-ui/react-separator": "^1.1.7",
-        "@radix-ui/react-slider": "^1.3.6",
-        "@radix-ui/react-slot": "^1.2.3",
-        "@radix-ui/react-switch": "^1.2.6",
-        "@radix-ui/react-tabs": "^1.1.13",
-        "@radix-ui/react-tooltip": "^1.2.8",
-        "@tabler/icons-react": "^3.34.1",
-        "@tanstack/react-query": "^5.85.5",
-        "@tanstack/react-query-devtools": "^5.85.5",
-        "axios": "^1.11.0",
-        "class-variance-authority": "^0.7.1",
-        "clsx": "^2.1.1",
-        "cmdk": "^1.1.1",
-        "date-fns": "^4.1.0",
-        "embla-carousel-react": "^8.6.0",
-        "input-otp": "^1.4.2",
-        "lucide-react": "^0.541.0",
-        "next": "15.5.0",
-        "next-themes": "^0.4.6",
-        "react": "19.1.0",
-        "react-day-picker": "^9.9.0",
-        "react-dom": "19.1.0",
-        "react-hook-form": "^7.62.0",
-        "recharts": "2.15.4",
-        "sonner": "^2.0.7",
-        "tailwind-merge": "^3.3.1",
-        "vaul": "^1.1.2",
-        "zod": "^4.0.17"
-    },
-    "devDependencies": {
-        "@eslint/eslintrc": "^3",
-        "@tailwindcss/postcss": "^0.6.14",
-        "@tanstack/eslint-plugin-query": "^5.83.1",
-        "eslint": "^9",
-        "eslint-config-next": "15.5.0",
-        "eslint-config-prettier": "^10.1.8",
-        "eslint-plugin-react-hooks": "^5.2.0",
-        "husky": "^9.1.7",
-        "lint-staged": "^16.1.5",
-        "prettier": "^3.6.2",
-        "prettier-plugin-tailwindcss": "^0.6.14",
-        "tailwindcss": "^4",
-        "tw-animate-css": "^1.3.7"
-    }
+    "dependencies": {}
 }

package/template/.github/PR_REQUEST_TEMPLATE.md

@@ -0,0 +1,18 @@
+## 📌 What’s changing?
+
+<!-- Briefly explain what this PR does -->
+
+## ✅ Checklist
+
+- [ ] I tested this change locally
+- [ ] I updated related docs (if needed)
+- [ ] This PR is rebased on the latest base branch
+- [ ] This PR is ready to squash & merge
+
+## 🚀 Deployment notes
+
+<!-- Optional: Add notes if anything special is needed during deploy -->
+
+## 🎯 Related Issues or Cards
+
+Closes #

package/template/.github/workflows/pr_check.yml

@@ -0,0 +1,38 @@
+name: PR Check
+
+on:
+    pull_request:
+        branches:
+            - development
+            - testing
+            - production
+
+jobs:
+    lint-and-build:
+        runs-on: ubuntu-latest
+
+        steps:
+            - name: Checkout
+              uses: actions/checkout@v4
+
+            - name: Use Node
+              uses: actions/setup-node@v4
+              with:
+                  node-version: 20
+
+            - name: Enable Corepack & Install
+              run: |
+                  corepack enable
+                  pnpm install
+
+            - name: Lint
+              run: pnpm lint
+
+            - name: Format Check
+              run: pnpm format-check
+
+            - name: Format
+              run: pnpm format
+
+            - name: Build
+              run: pnpm build

package/template/.husky/pre-commit

@@ -0,0 +1 @@
+pnpm lint-staged

package/template/.prettierignore

@@ -0,0 +1,7 @@
+/.vscode
+/node_modules
+./dist
+
+*.env
+.env
+.env.*

package/template/.prettierrc

@@ -0,0 +1,9 @@
+{
+    "singleQuote": false,
+    "bracketSpacing": true,
+    "tabWidth": 4,
+    "semi": true,
+    "trailingComma": "es5",
+    "plugins": ["prettier-plugin-tailwindcss"],
+    "tailwindFunctions": ["clsx", "cva", "cn"]
+}

package/template/README.md

@@ -0,0 +1,165 @@
+# Next.js Starter
+
+[![Next.js](https://img.shields.io/badge/Next.js-16%2B-blue?logo=next.js)](https://nextjs.org/)
+[![pnpm](https://img.shields.io/badge/pnpm-%E2%9C%94-green?logo=pnpm)](https://pnpm.io/)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)
+[![Prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?logo=prettier)](https://prettier.io/)
+[![ESLint](https://img.shields.io/badge/linting-eslint-blue?logo=eslint)](https://eslint.org/)
+
+> A modern Next.js starter template with modular structure, reusable UI components, and best practices for scalable web development.
+
+---
+
+## Features
+
+- **Next.js 15.5.0** with App Router
+- Modular folder structure (`src/animations`, `src/assets`, `src/components`, etc.)
+- Reusable UI components (Accordion, Button, Card, Table, etc.)
+- Context, hooks, and helpers for state management and utilities
+- Axios setup for API requests
+- QueryClient for data fetching and caching
+- Global styles and custom fonts
+- Linting and formatting with ESLint, Prettier, and lint-staged
+- PostCSS for advanced CSS processing
+- Husky for Git hooks
+- Tailwind CSS for utility-first styling
+- Prettier and Prettier-plugin-tailwindcss for code formatting
+- Embla Carousel, Recharts, Lucide, Tabler Icons, and more for UI/UX enhancements
+- Zod for schema validation
+- React Query for data fetching
+
+---
+
+## Getting Started
+
+### Prerequisites
+
+- Node.js 22+
+- pnpm (recommended) or npm/yarn
+
+### Installation
+
+```bash
+pnpm install
+```
+
+### Running the Development Server
+
+```bash
+pnpm dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) in your browser.
+
+### Building for Production
+
+```bash
+pnpm build
+```
+
+---
+
+## Project Structure
+
+```text
+src/
+  animations/         # Animation utilities
+  app/                # Next.js app router structure
+    (routes)/         # Route groups
+      (home)/         # Home page
+  assets/             # Static assets and logos
+  components/         # UI components, constants, context, helpers, hooks, lib, providers, schema, shared, styles, utils, validations
+    ui/               # Reusable UI elements
+    constants/        # App-wide constants
+    context/          # React context providers
+    helpers/          # Utility functions
+    hooks/            # Custom React hooks
+    lib/              # Libraries (axios, queryClient, utils)
+    providers/        # Context providers
+    schema/           # Validation schemas
+    shared/           # Shared resources (icons, etc.)
+    styles/           # Fonts and global styles
+    utils/            # Utility functions
+    validations/      # Validation logic
+```
+
+---
+
+## Scripts
+
+- `pnpm dev` — Start development server
+- `pnpm build` — Run lint, format, and build for production
+- `pnpm lint` — Run ESLint
+- `pnpm format` — Format code with Prettier
+- `pnpm check-format` — Check code formatting
+- `pnpm prepare` — Prepare Husky hooks
+- `pnpm start` — Start production server
+
+---
+
+## Dependencies
+
+### Main
+
+- next@15.5.0
+- react@19.1.0, react-dom@19.1.0
+- axios
+- @tanstack/react-query, @tanstack/react-query-devtools
+- @radix-ui/react-\* (Accordion, Dialog, Tabs, etc.)
+- @tabler/icons-react, lucide-react
+- embla-carousel-react
+- recharts
+- zod
+- input-otp
+- sonner
+- tailwind-merge
+- next-themes
+- date-fns
+- class-variance-authority, clsx
+- vaul
+
+### Dev
+
+- eslint, eslint-config-next, eslint-config-prettier, eslint-plugin-react-hooks, @tanstack/eslint-plugin-query, @eslint/eslintrc
+- prettier, prettier-plugin-tailwindcss
+- husky
+- lint-staged
+- tailwindcss, @tailwindcss/postcss, tw-animate-css
+
+---
+
+## Linting & Formatting
+
+- ESLint config: `eslint.config.mjs`
+- Prettier: integrated via lint-staged
+- Lint-staged: `lint-staged.config.js`
+- Husky for pre-commit hooks
+
+---
+
+## Customization
+
+- Add new UI components in `src/components/ui/`
+- Add new routes in `src/app/(routes)/`
+- Update global styles in `src/components/styles/globals.css`
+- Configure Axios in `src/components/lib/axios.js`
+- Add/modify validation schemas in `src/components/schema/`
+
+---
+
+## Author
+
+**Harshit Ostwal**  
+[codewithharshitjain@gmail.com](mailto:codewithharshitjain@gmail.com)
+
+---
+
+## License
+
+This project is licensed under the MIT License.
+
+---
+
+## Contributing
+
+Pull requests, issues, and suggestions are welcome!

package/template/components.json

@@ -0,0 +1,21 @@
+{
+    "$schema": "https://ui.shadcn.com/schema.json",
+    "style": "new-york",
+    "rsc": true,
+    "tsx": false,
+    "tailwind": {
+        "config": "",
+        "css": "@/styles/globals.css",
+        "baseColor": "neutral",
+        "cssVariables": true,
+        "prefix": ""
+    },
+    "aliases": {
+        "components": "@/components",
+        "utils": "@/lib/utils",
+        "ui": "@/components/ui",
+        "lib": "@/lib",
+        "hooks": "@/hooks"
+    },
+    "iconLibrary": "lucide"
+}

package/template/eslint.config.mjs

@@ -0,0 +1,42 @@
+import { dirname } from "path";
+import { fileURLToPath } from "url";
+import { FlatCompat } from "@eslint/eslintrc";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+const compat = new FlatCompat({
+    baseDirectory: __dirname,
+});
+
+const eslintConfig = [
+    {
+        ignores: [
+            "node_modules/**",
+            ".next/**",
+            "out/**",
+            "build/**",
+            "next-env.d.ts",
+        ],
+    },
+    ...compat.extends("next/core-web-vitals", "prettier"),
+    {
+        files: ["**/*.{js,jsx}"],
+        languageOptions: {
+            parserOptions: {
+                ecmaVersion: 2022,
+                sourceType: "module",
+            },
+        },
+        rules: {
+            "no-unused-vars": "warn",
+            "no-console": "warn",
+            "@next/next/no-document-import-in-page": "off",
+            "react-hooks/rules-of-hooks": "error",
+            "react-hooks/exhaustive-deps": "warn",
+            "@typescript-eslint/no-unused-vars": "off",
+        },
+    },
+];
+
+export default eslintConfig;

package/template/jsconfig.json

@@ -0,0 +1,7 @@
+{
+    "compilerOptions": {
+        "paths": {
+            "@/*": ["./src/*"]
+        }
+    }
+}

package/template/lint-staged.config.js

@@ -0,0 +1,6 @@
+const config = {
+    "**/*.{js,jsx}": ["eslint --fix", "prettier --write"],
+    "**/*.{css,scss,md,json}": ["prettier --write"],
+};
+
+export default config;

package/template/next.config.mjs

@@ -0,0 +1,6 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+    devIndicators: false,
+};
+
+export default nextConfig;

package/template/package.json

@@ -0,0 +1,72 @@
+{
+    "name": "nextjs-starter-kit",
+    "version": "0.1.0",
+    "private": true,
+    "scripts": {
+        "dev": "next dev --turbopack",
+        "build": "pnpm lint && pnpm format &&  next build --turbopack",
+        "start": "next start",
+        "lint": "eslint",
+        "check-format": "prettier --check .",
+        "format": "prettier --write .",
+        "prepare": "husky"
+    },
+    "dependencies": {
+        "@hookform/resolvers": "^5.2.1",
+        "@next/third-parties": "^15.5.0",
+        "@radix-ui/react-accordion": "^1.2.12",
+        "@radix-ui/react-alert-dialog": "^1.1.15",
+        "@radix-ui/react-avatar": "^1.1.10",
+        "@radix-ui/react-checkbox": "^1.3.3",
+        "@radix-ui/react-collapsible": "^1.1.12",
+        "@radix-ui/react-dialog": "^1.1.15",
+        "@radix-ui/react-dropdown-menu": "^2.1.16",
+        "@radix-ui/react-label": "^2.1.7",
+        "@radix-ui/react-popover": "^1.1.15",
+        "@radix-ui/react-progress": "^1.1.7",
+        "@radix-ui/react-select": "^2.2.6",
+        "@radix-ui/react-separator": "^1.1.7",
+        "@radix-ui/react-slider": "^1.3.6",
+        "@radix-ui/react-slot": "^1.2.3",
+        "@radix-ui/react-switch": "^1.2.6",
+        "@radix-ui/react-tabs": "^1.1.13",
+        "@radix-ui/react-tooltip": "^1.2.8",
+        "@tabler/icons-react": "^3.34.1",
+        "@tanstack/react-query": "^5.85.5",
+        "@tanstack/react-query-devtools": "^5.85.5",
+        "axios": "^1.11.0",
+        "class-variance-authority": "^0.7.1",
+        "clsx": "^2.1.1",
+        "cmdk": "^1.1.1",
+        "date-fns": "^4.1.0",
+        "embla-carousel-react": "^8.6.0",
+        "input-otp": "^1.4.2",
+        "lucide-react": "^0.541.0",
+        "next": "15.5.0",
+        "next-themes": "^0.4.6",
+        "react": "19.1.0",
+        "react-day-picker": "^9.9.0",
+        "react-dom": "19.1.0",
+        "react-hook-form": "^7.62.0",
+        "recharts": "2.15.4",
+        "sonner": "^2.0.7",
+        "tailwind-merge": "^3.3.1",
+        "vaul": "^1.1.2",
+        "zod": "^4.0.17"
+    },
+    "devDependencies": {
+        "@eslint/eslintrc": "^3",
+        "@tailwindcss/postcss": "^0.6.14",
+        "@tanstack/eslint-plugin-query": "^5.83.1",
+        "eslint": "^9",
+        "eslint-config-next": "15.5.0",
+        "eslint-config-prettier": "^10.1.8",
+        "eslint-plugin-react-hooks": "^5.2.0",
+        "husky": "^9.1.7",
+        "lint-staged": "^16.1.5",
+        "prettier": "^3.6.2",
+        "prettier-plugin-tailwindcss": "^0.6.14",
+        "tailwindcss": "^4",
+        "tw-animate-css": "^1.3.7"
+    }
+}