.cursorules Next.js SEO Dev

by @Rostyslav

Always add helpful comments to the code explaining what you are doing.
Never delete old comments, unless they are no longer relevant because the code has been rewritten or deleted.

This is the package.json file for the nextjs app.

Whenever you see a line with this following comment, do not touch it, rewrite it, or delete it "Do not touch this line Cursor"

{
  "name": "@se-2/nextjs",
  "private": true,
  "version": "0.1.0",
  "scripts": {
    "dev": "next dev",
    "start": "next dev",
    "build": "next build",
    "serve": "next start",
    "lint": "next lint",
    "format": "prettier --write . '!(node_modules|.next|contracts)/*/'",
    "check-types": "tsc --noEmit --incremental",
    "vercel": "vercel",
    "vercel:yolo": "vercel --build-env NEXT_PUBLIC_IGNORE_BUILD_ERROR=true"
  },
  "dependencies": {
    "@heroicons/react": "^2.0.11",
    "@rainbow-me/rainbowkit": "2.1.2",
    "@tanstack/react-query": "^5.28.6",
    "@uniswap/sdk-core": "^4.0.1",
    "@uniswap/v2-sdk": "^3.0.1",
    "blo": "^1.0.1",
    "burner-connector": "^0.0.8",
    "daisyui": "4.5.0",
    "next": "^14.0.4",
    "next-themes": "^0.2.1",
    "nprogress": "^0.2.0",
    "qrcode.react": "^3.1.0",
    "react": "^18.2.0",
    "react-copy-to-clipboard": "^5.1.0",
    "react-dom": "^18.2.0",
    "react-hot-toast": "^2.4.0",
    "use-debounce": "^8.0.4",
    "usehooks-ts": "^2.13.0",
    "viem": "2.17.4",
    "wagmi": "2.10.10",
    "zustand": "^4.1.2"
  },
  "devDependencies": {
    "@trivago/prettier-plugin-sort-imports": "^4.1.1",
    "@types/node": "^17.0.35",
    "@types/nprogress": "^0",
    "@types/react": "^18.0.9",
    "@types/react-copy-to-clipboard": "^5.0.4",
    "@typescript-eslint/eslint-plugin": "^5.39.0",
    "abitype": "1.0.5",
    "autoprefixer": "^10.4.12",
    "eslint": "^8.15.0",
    "eslint-config-next": "^14.0.4",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-prettier": "^4.2.1",
    "postcss": "^8.4.16",
    "prettier": "^2.8.4",
    "tailwindcss": "^3.4.3",
    "type-fest": "^4.6.0",
    "typescript": "5.5.3",
    "vercel": "^32.4.1"
  }
}

Next.js Development Toolkit

A collection of tools designed to streamline and enhance the development process for Next.js projects, focusing on efficiency, maintainability, and best practices.

Core Tools

Next.js Project Boilerplate Generator:
Quickly generate Next.js projects with predefined configurations and dependencies, saving setup time.
Dependency Management Dashboard:
Visualize and manage project dependencies, including version updates and vulnerability checks.
Automated Script Tester:
Dynamically test NPM scripts to ensure functionality and identify potential optimizations.

Code Quality & Maintenance

Code Comment Validator:
Analyze and update code comments to ensure they are comprehensive and aligned with recent code changes.
Next.js Module Updater:
Automatically check for the latest Next.js module versions and suggest updates for security and feature enhancements.

Configuration & Integration Tools

Prettier & ESLint Configuration App:
Easily configure Prettier and ESLint for Next.js projects through an intuitive UI.
Custom Script Builder:
Create tailored NPM scripts to expand project functionality.
TSLint to ESLint Converter:
Convert TSLint configurations to ESLint for TypeScript projects.

Component Library Integration

React Component Library Integrator:
Automatically configure dependencies and set up sample components for popular React libraries like DaisyUI or Heroicons.
Version Conflict Resolver:
Identify and resolve version conflicts among dependencies for smooth installations and builds.

Key Technologies:

Next.js
TypeScript
ESLint
Prettier
NPM Scripts

Overview of .cursorrules prompt

The .cursorrules file provides instructions for maintaining a package.json file associated with a Next.js app. It emphasizes adding helpful comments to the code and advises against altering lines with specific comments. The package.json file specifies the app’s name, version, scripts for building and running the application, and its dependencies and devDependencies, which include various libraries and tools such as Next.js, React, TypeScript, ESLint, and TailwindCSS. Additionally, there are configurations for handling vercel deployments and script commands for development and production builds.

Updated: March 17, 2025

Developers maintaining a Next.js app can benefit by ensuring consistent code documentation and version management while adhering to specific guidelines and preserving critical comments.

Usefull for: