Today, I am going to show you, how to create a simple chat application in node js using a special model "socket.io". It simply transmits messages from one client to all others.

For this, I am going to create two files:-

1: main.js (Server root files)

2: index.html

For the purpose of simply, I am putting both the files in the same directory.

In main.js, import http module:-

  var http = require('http');

Now, to open index.html file that contains the view, import fs module:-

Installing fs module:-

  npm install fs

Importing fs module in the application:-

var fs = require('fs');

Creating http server:

  var createServerSnippet =  function(req, res) {
    fs.readFile("index.html", function(err, data ) {
        res.end(data);
    }) ;
  }

  var app = http.createServer(createServerSnippet).listen(8000);

Since, nodejs is event driven, it required socket.io, it allows you to create a socket connection between the server and clients and send data back and forth.

To use it, install socket.io as follows:-

  npm install socket.io

Here is the connection code:-

 var io = require('socket.io').listen(app);
  io.sockets.on('connection', function(socket) {
      console.log("socket connected");

      socket.on("msgToClient", function(data) {
          io.sockets.emit("msgFromSever", {message: data.msg})
      })
  });

Therefore, main.js will look like this:-

 var http = require('http');
  var fs = require('fs');

  var createServerSnippet =  function(req, res) {
    fs.readFile("index.html", function(err, data ) {
        res.end(data);
    }) ;
  }

  var app = http.createServer(createServerSnippet).listen(8000);
  console.log("listening localhost:8000");

  var io = require('socket.io').listen(app);
  io.sockets.on('connection', function(socket) {
      console.log("socket connected");

      socket.on("msgToClient", function(data) {
          io.sockets.emit("msgFromSever", {message: data.msg})
      })
  });

index.html will look like this:

 <script type="text/javascript" src="/socket.io/socket.io.js"></script>
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
  <script type="text/javascript">
       var socket = io.connect("localhost:8000");

       function sendMessage() {
           var message = $("#msg").val();
           socket.emit("msgToClient",  { msg: message });
       }

       socket.on("msgFromSever", function(data) {
         var msgP = "<p> " + data.message + "</p>";
         $(".chats").append(msgP);
       })
  </script>
  <style type="text/css">
       .chats {
       border: 1px solid #ccc;
       height: 180px;
       overflow-y: scroll;
       width: 20%;
       margin-bottom: 30px;
       }
       #msg {  width: 21%;}
  </style>

  <h1>Chat</h1>
  <div class="chats"></div>
  <input type="text" id="msg" />
  <button onclick="sendMessage()" >Send</button>

You can also use socket.io cdn file for client.

Running the server:

             node app.js

Open below url in the browser:-

localhost:8000

Git code:-

https://github.com/dinesh-rawat/Simple-chat-application-in-node.js