Create real-time applications with Nodes.js

5 September 2021

Home » Blogs » Technology » Create real-time applications with Nodes.js

is an open-source and cross-platform runtime environment for JavaScript. With we can run JavaScript code anywhere, not just limited to the environment.

Node.js was first created and introduced for users on systems in 2009. was developed by Ryan Dahl and sponsored by Joyent, the company he works for.

With Node.js we can create real-time applications easily. How???

In this article, we will make an election to choose the chairman, can the class chairman, the chairman of RT?RW or whatever. Election results will appear in real-time, where every member who provides the option will update all election results pages that are being opened by users.

TOP TUTORIALS:  How to Fake Your Location on Google Chrome

Rare-step creating real-time applications with Node.j

  1. Download and install Node.js. Select and customize the OS you are using.
  2. Create an empty folder to save the project.
    This folder we will use to secure node scripts.js and also as the root of our project.
    For example, we create a folder with the name “bardimin” on the “C” dive.
  3. Create a file with the name “package.json” on “C:bardimin” and copy the following code
{
  "name": "Belajar_aplikasi_realtime",
  "description": "Learn real-time applications with Nodes.JS",
  "version": "1.0.0",
  "license": "MIT",
  "repository": "https://github.com/",
  "dependencies": {
    "express": "latest",
    "socket.io": "latest"
  }
}
  1. Then open the promt/ command and go to “C:bardimin”. Type the following command
npm install

Once the process is complete, the directory structure will be seen as the following image

TOP TUTORIALS:  Kingston SSD Manager x64 v1.5.2.0 & Kingston SSD Manager v1.1.2.6
nodejs 01
  1. Next step, create a “server.js” file in the folder you have created and copy the following code:
var app = require("express")();
var http = require('http'). Server(app);
var io = require("socket.io")(http);

Listening port
http.listen(3000, function () {
    console.log("Listening on 3000");
});

html file
app.get("/", function (req, res) {
    res.sendFile(__dirname + '/index.html');
});

Global Variable
const myData = {akbar: 0, goldie: 0};

/* This is auto initiated event when Client connects to Your Machien.  */
io.on("connection", (socket) => {
    console.log("A user is connected");
    socket.emit('newData', myData);
    socket.on('addData', (data) => {
        if (data === "akbar") {
            myData.akbar++;
        } else {
            myData.goldie++;
        }
        io.emit('newData', myData);
    })
});
  1. Next, you reopen the and type the command “server node.js”. If all is right, it will look like this.
nodejs 02
  1. The final step is to create an “index.html” file, still in the same folder and copy the following code


    Chairman's election
    
    
    
    


Chairman's election
Candidates for Chairman of the Voting Results
Akbar
Goldie
Choose your candidate:
  1. The creation of the is complete. Now it’s time to test if the app is already running.
TOP TUTORIALS:  How to merge all Excel Sheets into one Sheet

Application Testing

  • Reactivate the server as in step 6, with the command “server node.js” on the .
  • Next open your and access the “http://localhost:3000/” URL.
  • Reopen the “http://localhost:3000/” url on a new tab or another .
nodejs 03
  • You will see when one submits data, then all open will update automatically. And on the CMD console you can create notifications as you need.

Thank you for reading… May it be useful…

0 Comments