Sign in
Explore
Prompts · RulesWeb & UIReviewed

nextjs-app-router-cursorrules-prompt-file

Rules for Next.js development with the App Router.

Kind
Rules
Works with
Cursor
Languages
TypeScript / JavaScript
Source
Awesome Cursor Rules @ b044f956f021
Path
rules/nextjs-app-router-cursorrules-prompt-file.mdc
License
CC0-1.0
Jobs
Implementation
InstallCopy it from the source repository, or sign in and let the assistant adapt it for your project.
// Next.js App Router .cursorrules

// Next.js App Router best practices

const nextjsAppRouterBestPractices = [
  "Use server components by default",
  "Implement client components only when necessary",
  "Utilize the new file-based routing system",
  "Use layout.js for shared layouts",
  "Implement loading.js for loading states",
  "Use error.js for error handling",
  "Utilize route handlers for API routes",
];

// Folder structure

const folderStructure = `
app/
  layout.js
  page.js
  components/
  lib/
  styles/
public/
`;

// Additional instructions

const additionalInstructions = `
1. Use TypeScript for type safety
2. Implement proper metadata for SEO
3. Utilize Next.js Image component for optimized images
4. Use CSS Modules or Tailwind CSS for styling
5. Implement proper error boundaries
6. Follow Next.js naming conventions for special files
7. Use environment variables for configuration
`;