Build a Real-Time Chat App with Node.js like hack.chat

Learn how to build a real-time chat application with Node.js inspired by hack.chat. Features include custom chat rooms, file sharing, message logging, invisible mode, and more. Complete installation and usage guide.

Rafi
Written by Rafi
📅
Published June 30, 2024
⏱️
Read Time 2 min
📊
Difficulty Intermediate

Do you want to build your own real-time chat application? Inspired by hack.chat, this Node.js application lets you create private chat rooms with file sharing, message logging, and more—without needing accounts or external dependencies.

ℹ️ Info

This project is a hack.chat-inspired chat application written in Node.js. It requires no accounts, stores no permanent logs (messages can be configured to disappear), and supports file sharing within chat rooms.

What You’ll Learn

  • How to install and set up the chat application
  • How to create and join chat rooms
  • How to use features like file sharing and invisible mode
  • How to customize and deploy the application

Key Features

📖 1. Custom Chat Rooms via URL

Join any chat room directly using a URL format:

http://yourdomain.com/username/roomname

For example, http://yourdomain.com/rafi/krafichatroom1 automatically joins “rafi” to “krafichatroom1”.

📖 2. Real-Time Messaging

Send and receive messages instantly. Each message displays:

  • Sender’s username
  • Timestamp
  • Message content
📖 3. File Sharing

Upload and share files directly in the chat:

  • Images can be viewed inline with a “View” button
  • Other files are shared via download links
📖 4. Active User List

See who’s currently in the chat room. The user list updates in real-time as users join and leave.

📖 5. Message Logging

All messages are logged to files in the chat_log/ directory:

  • Logs are appended (not overwritten)
  • File format: {roomname}_log.txt
  • Useful for reviewing past conversations
📖 6. Invisible Mode

A unique privacy feature:

  • Click “Toggle Invisible Mode” to hide the chat
  • Chat window goes blank
  • Return by typing the secret key: zx
📖 7. Built-in Image Viewer

Click “View” on shared images to open them in an overlay within the chat—no need to download.

Installation

Step 1: Clone the Repository

git clone https://gitlab.com/krafi/krafi.hack.chat.git
cd krafi.hack.chat

Step 2: Install Dependencies

npm install express http socket.io multer

Step 3: Start the Server

npm start
💡 Tip

The server runs on port 3000 by default. Access it at http://localhost:3000

Directory Structure

krafi.hack.chat/
├── public/              # Static files (HTML, CSS, JS)
├── uploads/             # User-uploaded files
├── chat_log/            # Message log files
├── server.js            # Main server file
└── package.json         # Dependencies

How to Use

Step 1: Access the Application

Open your browser and navigate to:

http://localhost:3000

Step 2: Join a Chat Room

On the landing page:

  1. Enter your username
  2. Enter a room name (or use a custom URL)
  3. Click “Join”

Step 3: Send Messages

  • Type in the message box
  • Press Enter or click “Send” to send
  • Messages appear instantly for all users

Step 4: Share Files

  1. Click the file attachment button
  2. Select a file to upload
  3. For images, click “View” to preview inline

Step 5: Use Invisible Mode

  1. Click “Toggle Invisible Mode”
  2. The chat becomes hidden
  3. Type zx to return to the chat

Configuration Options

You can customize the application by editing server.js:

📖 Server Port

Change the port number:

const PORT = process.env.PORT || 3000;
📖 Upload Directory

Modify where files are stored:

const uploadDir = './uploads/';
📖 Log Directory

Change where message logs are saved:

const logDir = './chat_log/';

Deployment

Deploy on VPS/Server

  1. Upload files to your server
  2. Install Node.js on the server
  3. Run npm install
  4. Use a process manager like PM2:
    npm install -g pm2
    pm2 start server.js
    

Deploy on Cloud Platforms

This app can be deployed on:

  • Railway
  • Render
  • Heroku
  • DigitalOcean App Platform
⚠️ Warning

When deploying publicly, ensure you configure proper security settings and consider adding SSL/HTTPS.

Troubleshooting

📖 Server won't start?
  1. Check Node.js is installed:

    node --version
    
  2. Verify dependencies are installed:

    npm install
    
  3. Check if port 3000 is already in use:

    lsof -i :3000
    
📖 Messages not appearing?
  1. Check your internet connection
  2. Verify Socket.io is connecting (check browser console)
  3. Refresh the page
  4. Ensure you’re in the same room
📖 File upload not working?
  1. Check the uploads/ directory exists and is writable
  2. Verify file size limits in server.js
  3. Check server logs for errors
📖 User list not updating?
  1. Refresh the page
  2. Check browser console for Socket.io errors
  3. Ensure the user hasn’t disconnected unexpectedly

Source Code

View and contribute to the project: krafi.hack.chat on GitLab

💡 Tip

This chat application is perfect for creating private chat rooms for friends, teams, or communities. It’s lightweight, requires no accounts, and gives you full control over your data.

Start building your real-time chat application today!

Knowledge Check

Test your knowledge about building real-time chat applications

Discussion

0 comments
Reading Progress
4 min left 0%
Welcome back! Sign in to join the discussion.

Please verify your email to sign in.

Enter the 6-digit code from your verification email.

Didn't receive the email?

Remember your password?

Create an account to comment and join the community.
Letters, numbers, and underscores only

Check your email! We've sent a verification code.

Enter the 6-digit code to complete your registration, or click the link in your email.

Didn't receive the email?

Wrong email?

Enter your email address and we'll send you a code to reset your password.

Remember your password?

Enter the 6-digit code from your email and create a new password.

Didn't receive code?

Welcome aboard!

Your account has been created successfully.

Welcome back! Sign in to join the discussion.

Please verify your email to sign in.

Enter the 6-digit code from your verification email.

Didn't receive the email?

Remember your password?

Create an account to comment and join the community.
Letters, numbers, and underscores only

Check your email! We've sent a verification code.

Enter the 6-digit code to complete your registration, or click the link in your email.

Didn't receive the email?

Wrong email?

Enter your email address and we'll send you a code to reset your password.

Remember your password?

Enter the 6-digit code from your email and create a new password.

Didn't receive code?

Welcome aboard!

Your account has been created successfully.