NodeJS Express Setup with Typescript, ESLint, Prettier

After extensive research and hands-on work, I've refined the best approach to set up a new Node.js project with Express, TypeScript, ESLint, and Prettier. Follow these steps to quickly get started and have your project ready for development.

- Project Initialization: create a new Node.js project:

npm init -y

- Install Dependencies: Install required packages:

npm install express cors dotenv

npm install --save-dev typescript @types/node @types/express @types/cors ts-node

- Configure TypeScript: create a tsconfig.json file:

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "node",
    "outDir": "./dist",
    "rootDir": "./src",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true,
    "sourceMap": true
  },
  "include": ["src/**/*.ts"],
  "exclude": ["node_modules"]
}

- Update package.json scripts: Modify package.json to include:

{
  "type": "module",
  "scripts": {
    "start": "node dist/app.js",
    "build": "tsc",
    "dev": "ts-node-esm src/app.ts",
    "test": "echo \"Error: no test specified\" && exit 1"
  }
}

- Install ESLint & Prettier:

npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin

npm install --save-dev prettier eslint-config-prettier eslint-plugin-prettier

- Create eslint.config.mjs (updated ESLint configuration):

import { FlatCompat } from '@eslint/eslintrc';
import js from '@eslint/js';
import typescriptEslint from '@typescript-eslint/eslint-plugin';
import tsParser from '@typescript-eslint/parser';
import prettier from 'eslint-plugin-prettier';
import globals from 'globals';
import path from 'node:path';
import { fileURLToPath } from 'node:url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const compat = new FlatCompat({
    baseDirectory: __dirname,
    recommendedConfig: js.configs.recommended,
    allConfig: js.configs.all,
});

export default [
    ...compat.extends('eslint:recommended', 'plugin:@typescript-eslint/recommended'),
    {
        plugins: {
            '@typescript-eslint': typescriptEslint,
            prettier,
        },
        languageOptions: {
            globals: {
                ...globals.node,
            },
            parser: tsParser,
            ecmaVersion: 'latest',
            sourceType: 'module',
        },
        rules: {
            semi: 'off',
            quotes: ['error', 'single', { allowTemplateLiterals: true }],
            '@typescript-eslint/no-explicit-any': 'off',
        },
    },
];

- Configure Prettier:

• Create .prettierrc file:

{
  "tabWidth": 4,
  "singleQuote": true,
  "trailingComma": "all",
  "semi": true,
  "printWidth": 150,
  "pluginSearchDirs": false
}

• Create .pretterignore file:

**/.git
**/.svn
**/.hg
**/node_modules

- Recommended folder structure:

/src
   /config       → Configuration files  
   /routes       → Micro routes  
   /controllers  → Controller functions for handling requests  
   /services     → Service files for business logic  
   /types        → TypeScript interfaces and type definitions  
   /utils        → Utility functions  
.env  
.eslintrc.json  
.prettierignore  
.prettierrc  
package-lock.json  
package.json  
tsconfig.json  

- Additional useful packages

• Helmet - Security middleware

npm install helmet

• Passport - Authentication middleware

npm install passport

• Winston - Logging

npm install winston

This structured guide ensures an efficient setup for a clean, maintainable Node.js project. 🚀

Comments

[DinosaurGame]

Dinosaur game is the most popular game in the Google Chrome browser. This game was added to Google in 2014. This game is an iconic, offline, and mini-game in Google. The dinosaur game is an infinite running game. You can play this game even with the internet.