hotigeftas
hotigeftas

Reputation: 151

Connecting Node.js script to a front-end project

As a javascript newbie, I want to create a front-end project with a very little backend solution using Node.js.

I have a user inteface with some variables and a button. These variables have to be passed to a simple .txt file(on my filesystem) and overwrite its content. For this, I'm using a nodejs script:

var fs = require('fs');

fs.writeFile('log.txt', 'This is my text', function (err) {
  if (err) throw err;
  console.log('Replaced!');
});

But I want this to work onClick, whereas this only works from the command-line.

So I have the two following problems:

  1. I want to update the .txt file with the button click. So basically the above written code has to be executed, when I click the button. But I don't understand, how to connect the front-end with this nodejs file.
  2. I want the content to be dynamical. I'm sure, once the first problem is solved, this will be straightforward, but right now I don't know this either.

I'm 100% sure I'm missing something(maybe a web-server, but even then, how?). I did my research but all I found was either an overkill or I didn't even understand it. Any help would be appreciated, a tutorial, an advice or just a keyword, that I can use for my research.

Upvotes: 4

Views: 17896

Answers (2)

mbrandau
mbrandau

Reputation: 554

Have a look at express. It's a "Fast, unopinionated, minimalist web framework for node". With this you can build a small webserver:

var express = require('express');
var app = express();

app.get('/', function (req, res) {
  res.send('Hello World');
});

app.listen(3000); // Webserver is running on port 3000

If you run it and go to your browser on http://localhost:3000, it would print Hello World.

Now what you would do is call your logging function every time a specific URL is requested.

var fs = require('fs');

function log(text, callback) {
  fs.writeFile('log.txt', text, callback);
}

app.get('/', function (req, res) {
  log('This is my text', function (err) {
    if (err) throw err;
    res.send('Replaced!');
  });
});

Now when you click the button you need to make an AJAX request to the server (maybe using jQuery).

Upvotes: 4

megamit
megamit

Reputation: 952

Node.js doesnt have a built in front-library like some other scripting languages such as Python or VB. To create a node.js your intuition was correct in that you will need your app to expose itself as a web-server. The popular library to do this is called express and it is very easy to get started. I suggest that you follow the express quickstart tutorial to get into it.

From here you can wrap your code inside a route of the webserver (say /save) for example

var fs = require('fs');
var express = require('express');
var app = express();

app.get('/save', function (req, res) {
  fs.writeFile('log.txt', 'This is my text', function (err) {
    if (err) throw err;
    console.log('Replaced!');
    res.send('Replaced!')
  });
})

app.listen(3000, () => console.log('Example app listening on port 3000!'))

With this example with the dependencies installed opening localhost:3000/save in your browser would cause your code to be run.

Upvotes: 3

Related Questions