Skip to content
tinkerise

Next.js App with ESLint, Prettier, and Docker

Goal

Section titled “Goal”

Create a production-ready Next.js project with linting, formatting, and Docker support using only supported tinkerise scaffolders and enhancements.

Prerequisites

Section titled “Prerequisites”
  • Node.js 20.11+
  • tinkerise installed (npm i -g tinkerise)
  • Docker Desktop or Docker Engine

Step 1: Scaffold the application

Section titled “Step 1: Scaffold the application”
Terminal window
tinkerise web next docs-next-app --typescript --tailwind --eslint
cd docs-next-app

Expected output includes a generated Next.js app with TypeScript and Tailwind files.

Step 2: Add formatting and container enhancements

Section titled “Step 2: Add formatting and container enhancements”
Terminal window
tinkerise add prettier docker

This applies enhancement modules on top of the generated app.

Step 3: Install and run checks

Section titled “Step 3: Install and run checks”
Terminal window
npm install
npm run lint

Expected result: ESLint passes with no errors for a fresh scaffold.

Step 4: Build and run the Docker image

Section titled “Step 4: Build and run the Docker image”
Terminal window
docker build -t docs-next-app .
docker run --rm -p 3000:3000 docs-next-app

Open http://localhost:3000 and verify the app renders.

Expected generated artifacts

Section titled “Expected generated artifacts”
  • package.json scripts from Next.js scaffold
  • prettier config artifacts from enhancement
  • Dockerfile and .dockerignore from Docker enhancement

Next steps

Section titled “Next steps”
  1. Add CI checks with tinkerise add ci.
  2. Add commit quality gates with tinkerise add husky commitlint.
  3. Review framework details in the Next.js guide.
Section titled “Related guides”