TypeScript Node.js Boilerplate

ROHANYH101 — Fri, 28 Jun 2024 02:11:56 +0000

When developing a Node.js application, integrating TypeScript can significantly enhance your coding experience Combining these benefits with tools like nodemon and ts-node can streamline your development workflow. Here's a comprehensive guide to setting up a Node.js project with TypeScript, nodemon, and ts-node.

1. Initialize Your Project

Start by creating a new directory for your project and initializing it with npm.

mkdir my-node-ts-project
cd my-node-ts-project
npm init -y

2. Install TypeScript and ts-node

Next, install TypeScript and ts-node as development dependencies. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript, and ts-node is a utility that allows you to run TypeScript directly in Node.js.

npm install typescript ts-node --save-dev

3. Install Nodemon

Nodemon is a tool that helps develop Node.js applications by automatically restarting the node application when file changes are detected. Install nodemon as a development dependency.

npm install nodemon --save-dev

4. Configure TypeScript

then run the below command to generate the default tsconfig.json. This file contains the configuration for the TypeScript compiler.

npx tsc --init

will look something like this,

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*.ts"],
  "exclude": ["node_modules"]
}

5. Set Up Project Structure

Create the project structure with a source directory.

mkdir src
touch src/index.ts

Write a Sample TypeScript Code Add some basic TypeScript code in src/index.ts to test the setup.

src/index.ts

const greeting = (name: string): string => {
  return `Hello, ${name}!`;
};

console.log(greeting('World'));

7. Configure Script,

Configure package.json to include scripts for running your TypeScript code using ts-node and nodemon.

package.json

{
  "scripts": {
    "start": "ts-node src/index.ts",
    "dev": "nodemon --watch 'src/**/*.ts' --exec 'ts-node' src/index.ts"
  }
}

start: This script runs your TypeScript file directly using ts-node.
dev: This script uses nodemon to watch for file changes in the src directory and automatically restarts the application using ts-node.

8. Run Your Application

Now, you can start your application in development mode with:

npm run dev

Nodemon will watch for any changes in your TypeScript files and automatically restart the application, making the development process smooth and efficient.

Conclusion

Setting up a Node.js project with TypeScript, nodemon, and ts-node enhances your development workflow by providing type safety, real-time updates, and modern JavaScript features.

Reference

For a complete example and more details, you can refer to my GitHub repository: rohanyh101.

Feel free to clone the repository and explore the setup in detail!

DEV Community: ROHANYH101