DEV Community: HARSHIT BHARDWAJ

Getting Started with RabbitMQ in Node.js & TypeScript

HARSHIT BHARDWAJ — Wed, 19 Mar 2025 11:13:01 +0000

Introduction

What is Message Queuing?

Message queuing is a communication method used in distributed systems to allow asynchronous message passing between different components of an application. Instead of direct communication, messages are sent to an intermediary message broker, which holds them until the receiving component is ready to process them. This helps in decoupling services, making the system more scalable, fault-tolerant, and resilient to failures.

What is RabbitMQ?

RabbitMQ is an open-source message broker that helps applications communicate asynchronously by sending, receiving, and managing messages efficiently. It is based on the Advanced Message Queuing Protocol (AMQP) and provides features like message acknowledgment, retry mechanisms, and dead-letter queues.

Why Use RabbitMQ?

RabbitMQ is widely used in microservices, event-driven architectures, and background job processing because of its many advantages:

Decoupling Services: Producers and consumers don’t need to know about each other’s existence, reducing dependencies.
Scalability: Consumers can be scaled horizontally to process more messages as demand increases.
Reliability: Ensures messages are delivered even if a service crashes.
Load Balancing: Distributes messages among multiple consumers for efficient processing.
Retry and Dead Letter Queues (DLQs): Automatically retries failed messages and handles undelivered messages properly.
Supports Multiple Exchange Types: Direct, topic, fanout, and header exchanges provide flexibility in routing messages.

Common Use Cases for RabbitMQ

Task Queues: Background processing of jobs like image processing, notifications, etc.
Microservices Communication: Reliable event-driven communication between microservices.
Real-time Data Processing: Streaming logs, chat applications, and stock market feeds.
Asynchronous API Requests: Handling long-running API requests asynchronously.

Prerequisites

Before we dive in, ensure you have the following installed:

Node.js (LTS version recommended)
RabbitMQ Server (Download & Install)
amqplib (RabbitMQ client for Node.js)

To install amqplib, run:

npm install amqplib

Step 1: Setting Up a RabbitMQ Connection

We first need to establish a connection with RabbitMQ. Create a connection.ts file:

import amqp from 'amqplib';

export const connectRabbitMQ = async () => {
    try {
        const connection = await amqp.connect('amqp://localhost');
        const channel = await connection.createChannel();
        console.log('Connected to RabbitMQ');
        return { connection, channel };
    } catch (error) {
        console.error('Error connecting to RabbitMQ:', error);
        throw error;
    }
};

Explanation of Parameters

amqp.connect('amqp://localhost'): Establishes a connection to RabbitMQ running on localhost. You can replace it with amqp://username:password@host:port for remote connections.
createChannel(): Creates a channel to communicate with RabbitMQ. Channels help send and receive messages efficiently.

Step 2: Creating a Producer (Sending Messages)

The producer sends messages to a queue. Create a producer.ts file:

import { connectRabbitMQ } from './connection';

const sendMessage = async (queue: string, message: string) => {
    const { channel } = await connectRabbitMQ();
    await channel.assertQueue(queue, { durable: true });
    channel.sendToQueue(queue, Buffer.from(message));
    console.log(`Message sent to ${queue}:`, message);
};

sendMessage('task_queue', 'Hello, RabbitMQ!');

Explanation of Parameters

queue: The name of the queue where the message will be sent.
channel.assertQueue(queue, { durable: true }): Ensures the queue exists before sending messages.
- { durable: true }: Makes the queue persistent, ensuring messages survive broker restarts.
{ durable: true }: Sends a message in buffer format to the specified queue.

Step 3: Creating a Consumer (Receiving Messages)

Now, let's create a consumer that listens for messages. Create a consumer.ts file:

import { connectRabbitMQ } from './connection';

const consumeMessages = async (queue: string) => {
    const { channel } = await connectRabbitMQ();
    await channel.assertQueue(queue, { durable: true });
    console.log(`Waiting for messages in ${queue}...`);

    channel.consume(queue, (message) => {
        if (message) {
            console.log(`Received: ${message.content.toString()}`);
            channel.ack(message); // Acknowledge message
        }
    });
};

consumeMessages('task_queue');

Explanation of Parameters

channel.consume(queue, callback): Listens for messages from the queue.
message.content.toString(): Converts the message from buffer format to a readable string.
channel.ack(message): Acknowledges that the message has been processed successfully, so RabbitMQ can remove it from the queue.

Running the Setup

Start RabbitMQ (if not running already):

   rabbitmq-server

Run the consumer to start listening:

   node consumer.js

Run the producer to send a message:

   node producer.js

Check your console! You should see the sent and received messages.

Conclusion

Congratulations! You've successfully set up RabbitMQ with Node.js and TypeScript, created a producer to send messages, and a consumer to process them.

This is just the beginning! 🚀 In the next blogs, we will dive deeper into advanced RabbitMQ topics like error handling, retries, dead-letter queues, and logging. Stay tuned! 🔥

Adding TypeScript Support to an Existing React.js Project (Without Dropping JavaScript Support)

HARSHIT BHARDWAJ — Fri, 21 Feb 2025 07:25:02 +0000

TypeScript provides static typing, better IntelliSense, and improved code maintainability. However, when migrating an existing React project to TypeScript, you may not want to drop JavaScript support entirely. This guide walks you through the minimal changes required to enable TypeScript in a React.js project while still allowing JavaScript files to coexist.

1. Install Required Dependencies

To get started, install TypeScript and the necessary type definitions:

npm install --save-dev typescript @babel/preset-typescript @types/node @types/react @types/react-dom

Additionally, add a script in package.json to check for TypeScript errors without emitting compiled files:

"scripts": {
  "tsc": "tsc --noEmit"
}

2. Add a TypeScript Configuration File

Create a tsconfig.json file in the root of your project with the following settings:

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true, 
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
    "baseUrl": "src"
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

Why These Settings?

"allowJs": true → Allows JavaScript files to be used alongside TypeScript.
"noEmit": true → Prevents TypeScript from generating output files since we use Babel.
"jsx": "react-jsx" → Ensures JSX syntax is correctly processed.
"strict": true → Enables TypeScript's strict type-checking for better reliability.

If your project contains a jsconfig.json, delete it to prevent conflicts.

3. Add TypeScript Declaration for React

Create a new file inside the src/ folder and name it react-app-env.d.ts. Add the following content:

/// <reference types="react-scripts" />

declare module "*.tsx" {
    const content: any;
    export default content;
}

This helps TypeScript understand .tsx module imports correctly.

4. Start Using TypeScript Files

Now, you can begin converting JavaScript files (.js) to TypeScript (.tsx or .ts). You don't have to migrate everything at once—TypeScript and JavaScript files can coexist.

Importing JavaScript in TypeScript

You can import JavaScript files into TypeScript just like before:

import myFunction from "./utils/myFile.js";

Importing TypeScript in JavaScript

Similarly, you can import TypeScript files in JavaScript without issues:

import myFunction from "./utils/myFile.ts";

This makes it easy to migrate incrementally without breaking the existing codebase.

5. Run TypeScript Checks

Once TypeScript is integrated, you can check for type errors without affecting the build process:

npm run tsc

If everything is set up correctly, the project should continue to work as expected while allowing both TypeScript and JavaScript files.

Conclusion

By following these steps, you've successfully added TypeScript to your React.js project without losing JavaScript compatibility. This approach allows a smooth transition to TypeScript, enabling better type safety while maintaining existing functionality. 🚀

Adding TypeScript Support to an Existing Node.js Project (Without Dropping JavaScript Support)

HARSHIT BHARDWAJ — Mon, 17 Feb 2025 07:44:12 +0000

Why I Made This Update

Managing errors in JavaScript can be tricky, especially in large projects where type-related issues may not surface until runtime. To improve type safety and catch errors at compile time, I decided to introduce TypeScript into my existing Node.js backend project. However, I didn’t want to completely drop JavaScript support, so I configured my environment to support both JavaScript and TypeScript files.

How to Add TypeScript to an Existing Node.js Project

To allow both JavaScript and TypeScript files to coexist in a Node.js project, follow these steps:

Step 1: Install Required Dependencies

Run the following command in your project’s root directory:

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

These packages help enable TypeScript support and provide type definitions for Node.js.

Step 2: Create a `tsconfig.json` File

This configuration file tells TypeScript how to compile your code. Below is a generic configuration that works for most projects:

{
    "compilerOptions": {
        "target": "es2016",
        "module": "commonjs",
        "allowJs": true,      // Allow JavaScript files
        "checkJs": true,      // Enable type checking for JS files
        "outDir": "./dist",  // Compiled files will be placed here
        "esModuleInterop": true,
        "forceConsistentCasingInFileNames": true,
        "strict": true,       // Set to false initially for easier migration
        "skipLibCheck": true,
        "moduleResolution": "node",
        "resolveJsonModule": true,
        "baseUrl": ".",
        "paths": {
            "*": ["node_modules/*"]
        }
    },
    "include": ["*.ts"],
    "exclude": ["node_modules", "dist"]
}

Step 3: Enable TypeScript Execution Without a Build Step

Instead of compiling TypeScript into JavaScript before running the backend, I use ts-node to execute TypeScript files directly. To achieve this, I added the following in my main JavaScript entry file:

require('ts-node').register({
  transpileOnly: false,
  compilerOptions: {
    module: 'commonjs',
    allowJs: true,      // Allow JavaScript files
    checkJs: false,     // Disable type-checking for JavaScript files
    esModuleInterop: true
  }
});

This allows me to mix JavaScript and TypeScript files in my backend without requiring a separate build process.

Managing Imports Between JavaScript and TypeScript

Importing JavaScript Files in TypeScript:

import { rabbitMqClient } from "./filepath";

Importing TypeScript Files in JavaScript:

const fileName = require("./filepath");

Since JavaScript doesn’t support TypeScript syntax, require() must be used instead of import when loading TypeScript files from a JavaScript file.

Pros and Cons of Supporting Both JavaScript and TypeScript

Pros:

Gradual migration: You don’t have to rewrite the entire codebase in TypeScript.
Type safety: TypeScript catches errors at compile-time, reducing runtime bugs.
Improved code maintainability: Better tooling support and autocompletion.

Cons:

TypeScript errors are not raised if starting from a JavaScript entry file: Since TypeScript checks don’t apply in pure JavaScript files, errors may go unnoticed if you start from a .js entry point and navigate into .ts files.
Inconsistent typing enforcement: When managing services between .ts files, type safety works fine. However, when jumping between .js and .ts files, there may be type inconsistencies.
Potentially confusing imports: Developers need to be mindful of import/export differences between JavaScript and TypeScript.

Final Thoughts

This setup allows my backend to gradually transition to TypeScript while maintaining JavaScript support. However, this method is only for backend code. For frontend migration, additional steps are required, which I will cover in a separate blog post.

Let me know if you have any questions or suggestions! 🚀

DEV Community: HARSHIT BHARDWAJ

Getting Started with RabbitMQ in Node.js & TypeScript

Introduction

What is Message Queuing?

What is RabbitMQ?

Why Use RabbitMQ?

Common Use Cases for RabbitMQ

Prerequisites

Step 1: Setting Up a RabbitMQ Connection

Explanation of Parameters

Step 2: Creating a Producer (Sending Messages)

Explanation of Parameters

Step 3: Creating a Consumer (Receiving Messages)

Explanation of Parameters

Running the Setup

Conclusion

Adding TypeScript Support to an Existing React.js Project (Without Dropping JavaScript Support)

1. Install Required Dependencies

2. Add a TypeScript Configuration File

Why These Settings?

3. Add TypeScript Declaration for React

4. Start Using TypeScript Files

Importing JavaScript in TypeScript

Importing TypeScript in JavaScript

5. Run TypeScript Checks

Conclusion

Adding TypeScript Support to an Existing Node.js Project (Without Dropping JavaScript Support)

Why I Made This Update

How to Add TypeScript to an Existing Node.js Project

Step 1: Install Required Dependencies

Step 2: Create a tsconfig.json File

Step 3: Enable TypeScript Execution Without a Build Step

Managing Imports Between JavaScript and TypeScript

Importing JavaScript Files in TypeScript:

Importing TypeScript Files in JavaScript:

Pros and Cons of Supporting Both JavaScript and TypeScript

Pros:

Cons:

Final Thoughts

Step 2: Create a `tsconfig.json` File