<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Vishal Jagamani</title>
    <description>The latest articles on DEV Community by Vishal Jagamani (@vishal_jagamani).</description>
    <link>https://dev.to/vishal_jagamani</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1408615%2F9ae5eaef-6362-44b5-802f-5cd0d369a6e6.JPG</url>
      <title>DEV Community: Vishal Jagamani</title>
      <link>https://dev.to/vishal_jagamani</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/vishal_jagamani"/>
    <language>en</language>
    <item>
      <title>NodeJS Express Setup with Typescript, ESLint, Prettier</title>
      <dc:creator>Vishal Jagamani</dc:creator>
      <pubDate>Wed, 05 Feb 2025 17:39:33 +0000</pubDate>
      <link>https://dev.to/vishal_jagamani/nodejs-express-with-typescript-eslint-prettier-5a58</link>
      <guid>https://dev.to/vishal_jagamani/nodejs-express-with-typescript-eslint-prettier-5a58</guid>
      <description>&lt;p&gt;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.&lt;/p&gt;

&lt;p&gt;Updated setup for eslint, using &lt;a href="https://typescript-eslint.io/" rel="noopener noreferrer"&gt;typescript-eslint&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;- Project Initialization:&lt;/strong&gt; create a new Node.js project:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm init -y
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;- Install Dependencies:&lt;/strong&gt; Install required packages:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install express cors dotenv
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install --save-dev @types/node @types/express @types/cors eslint @eslint/js typescript typescript-eslint prettier
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;- Configure TypeScript:&lt;/strong&gt; create a &lt;code&gt;tsconfig.json&lt;/code&gt; file:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
  "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"]
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;- Update &lt;code&gt;package.json&lt;/code&gt; scripts:&lt;/strong&gt; Modify &lt;code&gt;package.json&lt;/code&gt; to include:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
  "type": "module",
  "scripts": {
    "start": "node dist/app.js",
    "build": "tsc",
    "dev": "node dist/app.js",
    "test": "echo \"Error: no test specified\" &amp;amp;&amp;amp; exit 1"
  }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;- Create eslint.config.mjs&lt;/strong&gt; (updated ESLint configuration):&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import eslint from '@eslint/js';
import tseslint from 'typescript-eslint';

export default tseslint.config(eslint.configs.recommended, tseslint.configs.recommended, {
    rules: {
        semi: 'off',
        quotes: ['error', 'single', { allowTemplateLiterals: true }],
        // '@typescript-eslint/no-explicit-any': 'off',
    },
});
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;- Configure Prettier:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Create &lt;code&gt;.prettierrc&lt;/code&gt; file:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
  "tabWidth": 4,
  "singleQuote": true,
  "trailingComma": "all",
  "semi": true,
  "printWidth": 150,
  "pluginSearchDirs": false
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;Create &lt;code&gt;.pretterignore&lt;/code&gt; file:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;**/.git
**/.svn
**/.hg
**/node_modules
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;- Recommended folder structure:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;/project
│── /src
│   ├── app.ts                # Main Express app file
│   ├── /routes               # All micro routes
│   │   ├── user.routes.ts    # Routes for users
│   │   ├── auth.routes.ts    # Routes for authentication
│   │   ├── index.ts          # Centralized router export
│   │
│   ├── /controllers          # Controllers handling HTTP requests
│   │   ├── user.controller.ts
│   │   ├── auth.controller.ts
│   │
│   ├── /services             # Business logic and data handling
│   │   ├── user.service.ts
│   │   ├── auth.service.ts
│   │
│   ├── /middlewares          # Middleware functions
│   │   ├── auth.middleware.ts
│   │   ├── error.middleware.ts
│   │   ├── validate.middleware.ts
│   │
│   ├── /utils                # Utility functions
│   │   ├── logger.ts         # Logging utility (e.g., Winston)
│   │   ├── response.ts       # Standardized API responses
│   │   ├── hash.ts           # Password hashing utilities
│   │
│   ├── /config               # Configuration files
│   │   ├── db.ts             # MongoDB connection setup
│   │   ├── env.ts            # Environment variable handler
│   │   ├── config.ts         # General app config
│   │
│   ├── /types                # TypeScript type definitions
│   │   ├── post.types.ts
│   │   ├── user.types.ts
│   │   ├── index.d.ts
│
│── .env                      # Environment variables
│── eslint.config.mjs         # ESLint configuration
│── .prettierrc               # Prettier configuration
│── .pretterignore            # Prettier ignore configuration
│── tsconfig.json             # TypeScript configuration
│── package.json              # Dependencies and scripts
│── README.md                 # Documentation 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;- Additional useful packages&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Helmet - Security middleware
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install helmet
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;Passport - Authentication middleware
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install passport
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;Winston - Logging
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install winston
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This structured guide ensures an efficient setup for a clean, maintainable Node.js project. 🚀&lt;/p&gt;

</description>
      <category>node</category>
      <category>express</category>
      <category>typescript</category>
      <category>eslint</category>
    </item>
  </channel>
</rss>
