Linting & Formatting

Configure ESLint with the flat config format for a Next.js project using built-in presets.

Configure the most impactful ESLint rules for React, hooks, TypeScript, imports, and accessibility.

Install and configure ESLint plugins for React, TypeScript, accessibility, Tailwind CSS, and testing.

Install and configure Prettier for consistent code formatting across your React and Next.js project.

Make ESLint and Prettier work together without conflicts by separating concerns: ESLint for code quality, Prettier for formatting.

Use Biome as a single, fast tool for linting, formatting, and import organization — replacing both ESLint and Prettier.

Run ESLint and Prettier automatically on staged files before each commit to catch issues early.

Ensure consistent editor behavior across your team with EditorConfig, VS Code workspace settings, and recommended extensions.

Enable TypeScript's strict compiler options to catch more bugs at compile time and complement ESLint with type-level safety.

Run ESLint, Prettier, and TypeScript type-checking in GitHub Actions to enforce code quality on every pull request.

A condensed summary of the 25 most important best practices drawn from every page in this section.