#Step 1 : Initialize the project
mkdir my-project
cd my-project
npm init -y
#Step 2 : Install necessary packages
npm install express mongoose cors dotenv --save
npm install typescript @types/node @types/express@4.17.21 --save-dev
npm install -D nodemon ts-node-dev eslint @eslint/js @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-config-prettier eslint-plugin-prettier prettier
#Step 3 : Create a folder structure
`my-project
│ .env
│ .gitignore
│ eslint.config.mjs
│ tsconfig.json
├───dist
├───src
│ │ app.ts
│ │ server.ts
│ │───app
| |
│ └───config
│ └───index.ts`
#Step 4 : Initialize typescript
tsc --init
#Step 5 : Configure TypeScript
Modify tsconfig.json with this following settings
{
"compilerOptions": {
"target": "es2016",
"module": "commonjs",
"rootDir": "./src",
"outDir": "./dist",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true
},
"include": ["src"]
}
#Step 6 : Initialize eslint configuration
npx eslint --init
Answer following questions like this
How would you like to use ESLint?
--> To check syntax and find problems
What type of modules does your project use?
-->JavaScript modules (import/export) //(you can require syntax by selecting commonjs)
Which framework does your project use?
--> None of these
Does your project use TypeScript?
--> yes
Where does your code run?
--> node
Would you like to install them now?
--> yes
Which package manager do you want to use?
--> npm //(you can choose pnpm or yarn)
#Step 7 : Configure the eslint.config.mjs file
import typescriptEslint from '@typescript-eslint/eslint-plugin';
import globals from 'globals';
import tsParser from '@typescript-eslint/parser';
import path from 'node:path';
import { fileURLToPath } from 'node:url';
import js from '@eslint/js';
import { FlatCompat } from '@eslint/eslintrc';
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 [
{
ignores: ['**/node_modules', '**/dist'],
},
...compat.extends(
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'prettier',
),
{
plugins: {
'@typescript-eslint': typescriptEslint,
},
languageOptions: {
globals: {
...globals.node,
process: 'readonly',
},
parser: tsParser,
ecmaVersion: 'latest',
sourceType: 'module',
},
rules: {
'no-unused-vars': 'off',
'prefer-const': 'warn',
'no-console': 'off',
'no-undef': 'error',
semi: ['warn', 'always'],
'@typescript-eslint/no-empty-object-type': 'off',
'@typescript-eslint/no-unused-vars': 'off',
'@typescript-eslint/no-unused-expressions': [
'warn',
{
allowShortCircuit: true,
allowTernary: true,
allowTaggedTemplates: true,
},
],
},
},
];
#Step 8 : Setup Prettier
npm install --save-dev prettier
#Step 9 : Create .prettierrc file for better customization (optional)
Create .prettierrc configuration file and apply following settings
{
"singleQuote": true,
"trailingComma": "all",
"tabWidth": 2,
"semi": true
}
#Step 10 : Add scripts to package.json file
"main": "./dist/server.js",
"scripts": {
"build": "tsc",
"start:prod": "node ./dist/server.js",
"start:dev": "ts-node-dev --respawn --transpile-only ./src/server.ts",
"lint": "eslint .",
"lint:fix": "eslint . --fix",
"prettier": "prettier --ignore-path .gitignore --write \"./src/**/*.+(js|ts|json)\"",
"prettier:fix": "prettier --write src"
}
# Sample Files
app.ts
import express, {Application, Request, Response } from 'express';
const app : Application = express();
app.use(express.json());
app.get('/', (req: Request, res: Response) => {
res.send('Hello from setup file');
});
export default app;
server.ts
import mongoose from 'mongoose';
import app from './app';
import config from './config';
async function main() {
try {
await mongoose.connect(config.db_url as string);
app.listen(config.port, () => {
console.log(`Example app listening on port ${config.port}`);
});
} catch (err) {
console.log(err);
}
}
main();
index.ts
import dotenv from 'dotenv';
import path from 'path';
dotenv.config(
{
path : path.join(process.cwd(), ".env")
}
);
export default {
port: process.env.PORT,
db_url: process.env.DB_URL,
};
.env
PORT=5000
DB_URL=your_mongodb_connection_string
.gitignore
node_modules
.env
dist
# Step 11 : Run Scripts
npm run build # Build the project before deployment
npm run start:prod # Start the server for production
npm run start:dev # Start the server for development
npm run lint # Find ESLint errors
npm run lint:fix # Fix ESLint errors
npm run prettier # Find Prettier format errors
npm run prettier:fix # Fix Prettier format errors
Top comments (0)