node.js equivalent of a standard PHP ajax saving scheme

Question

In a JavaScript (client) + PHP (server) website, I have this scheme for saving an "online notepad" (in a #textbox textarea) to server:

// client-side
$("#save-button").on('click', save); 

function save(e) {
  $.ajax({ type: "POST",
           url: "/php/save.php",
           data: { projectname: $('#projectname').text(), 
                   data: $('#textbox').text() },
           success: function(data) { alert('Data saved'); },
           error: function(data) { console.log(data); } });
}

and this on server-side (/php/save.php):

<?php

$projectname = $_POST['projectname'];
$data = $_POST['data'];

// save this into database

?>

What is the equivalent "post to server and save on server" scheme in node.js (client+server)? (using express for example)

Is there a well-known node.js "pattern" for such task?

Is it common / good practice to use $.ajax(...) on client and node.js on server? I thought node.js introduced a new way of thinking, making ajax not-needed-anymore... am I wrong?

Answer 1

1. What's the equivalent "post to server and save on server" scheme in node.js (client+server)? (using express for example)

being specific to your code, it should be looking something like this.

client-side:-

$("#save-button").on('click', save);

function save(e) {
  $.ajax({ type: "POST",
           url: "/php/save",
           data: { projectname: $('#projectname').text(), 
                   data: $('#textbox').text() },
           success: function(data) { alert('Data saved'); },
           error: function(data) { console.log(data); } });
}

And server side:-

router.post('/php/save', function(req, res) {   // server side
    var projectName = req.body.projectname;
    var data = req.body.data; 
    // save the data here to database
});

here the way I receive the post data in node, I need to require body-parser module so this should be added at the top,

var bodyParser = require('body-parser');

this will parse your http request body so you can access the parameters directly as req.body.data.

2. Is it common / good practice to use $.ajax(...) on client and node.js on server?

$.ajax(...) on client :- Of-course , why not.. don't we use $.ajax(...) when we use different backend technologies like .net or java? So there is no need for changing your front end, It is just you are using a different technology on the back-end

node on server :- Now this is quite opinion based, node is new, we javascript developers love node, because it is single technology on serverside and client as well, I would say node is fantastic.. but there are other people who would say node is crap. I would rather skip answering this part.

3. node.js introduced a new way of thinking, making ajax not-needed-anymore...

I think you are pointing towards websockets. yes node is a different way of thinking. This does not really replace ajax, you can find some info here

The purpose of WebSockets is to provide a low-latency, bi-directional, full-duplex and long-running connection between a browser and server. WebSockets open up new application domains to browser applications that were not really possible using HTTP and AJAX (interactive games, dynamic media streams, bridging to existing network protocols, etc).

If you don't need the specific benefits that WebSockets provide, then it's probably a better idea to stick with existing techniques like AJAX and Comet because this allows you to re-use and integrate with a huge existing ecosystem of tools, technologies, security mechanisms, knowledge bases (i.e. far more people on stackoverflow know HTTP/Ajax/Comet than WebSockets), etc.

And this is not node.js specific thing, you can still implement websockets in other technologies as well.

So node.js introduced a new way of thinking, making ajax not-needed-anymore is wrong !

Answer 2

You would only need to change the server side. Depending on how you have the server set up, your code might look something like this:

router.post('/php/save.php', function(req, res) {
    var projectName = req.param('projectname');
    var data = req.param('data');
});