⚙️ Setting Up ESLint with TypeScript

ESLint is a powerful linter for identifying and fixing code issues. When working with TypeScript, combining it with typescript-eslint gives you even deeper static analysis and code quality checks.

Here's how to set it up using the modern ESLint flat config format (with eslint.config.mjs).

---

❓ Why Use ESLint (Even with TypeScript)?

You might wonder — "I’m already using TypeScript. Isn’t that enough?"

Not quite.

While TypeScript helps catch type errors, it doesn’t warn you about many code quality issues or bad practices. That’s where ESLint comes in.

Here’s why I found ESLint essential in my project:

• ✅ Detects unused variables and functions
  TypeScript compiles unused variables silently by default. ESLint can catch and flag them with rules like no-unused-vars, helping you keep your codebase clean.

• ⚠️ Warns about console.log, especially in production
  Accidentally logging sensitive data (e.g., console.log(user.password)) can expose security risks. With ESLint, you can enforce "no-console": "warn" or "error" to avoid this.

• 🧹 Keeps your code consistent and readable
  Using stylistic rules (like consistent quotes, spacing, ordering), ESLint helps you and your team follow the same coding style.

• 🔐 Adds a security layer
  With plugins like eslint-plugin-security, you can catch potential vulnerabilities in your code automatically.

In short: TypeScript checks types. ESLint checks everything else.
Together, they make your codebase cleaner, safer, and easier to maintain. So now let's see how to set this up in our project.

---

✅ Step 1: Install Dependencies

Run the following command in your terminal:

npm install --save-dev eslint @eslint/js typescript typescript-eslint

This installs:

• eslint: the core linter
• @eslint/js: ESLint's built-in recommended rule sets
• typescript: required to parse TS files
• typescript-eslint: parser + rules for TypeScript

---

📄 Step 2: Create eslint.config.mjs

In your project root, create a file named eslint.config.mjs. Then add the following:

// @ts-check

import eslint from "@eslint/js";
import tseslint from "typescript-eslint";

export default tseslint.config(
  eslint.configs.recommended,             // Base JavaScript rules
  tseslint.configs.strict,                // Strict TypeScript rules
  tseslint.configs.stylistic,             // Style-focused rules
  {
    rules: {
      "no-console": "warn",              // Warn on console.log (but allow for debugging)
      // Add more custom rules here if needed
    },
  }
);

🔍 Explanation:

• strict: catches more possible bugs, such as unsafe type assertions or unhandled promises.
• stylistic: helps maintain consistent code formatting (spaces, quotes, etc.).
• "no-console": "warn": helps catch forgotten console.logs before pushing to production.

Feel free to toggle "warn" to "error" to enforce stricter policies in production.

---

🧪 Step 3: Add NPM Script

To make linting easy, add this to your package.json:

"scripts": {
  "dev": "ts-node-dev --respawn --transpile-only src/server.ts",
  "lint": "npx eslint ./src",
  "test": "echo \"Error: no test specified\" && exit 1"
}

Now you can lint your code using:

npm run lint

---

🌟 Recommended

For VS Code users, install the ESLint extension

---

🧠 Notes

• You can use --fix to automatically fix fixable issues:

  npx eslint ./src --fix

---

🏁 Final Thoughts

This setup is a solid foundation for a clean, maintainable TypeScript backend project. You can always add plugins like eslint-plugin-import, eslint-plugin-prettier, or eslint-plugin-security as your app grows.

Let me know if you want a version with Prettier integration too!