CODEWITHSUNDEEP
javascriptphphtmlnode.js
alwayslearning
alwayslearning

Reputation: 13

How do I run a Node.js script in my HTML page, as I do with PHP?

I'm a PHP developer since 2010. I love PHP, just because it's simple. But I want to learn more about Node.js. It looks interesting, specially because I know JavaScript and I'm a big fan of it.

Does anyone know how do I run a Node.js script in my HTML page, without displaying the source code, as PHP does? Is that way how it really works?

I've seen many tutorials that they execute Node.js in a terminal, but I didn't find a quick way to run Node.js in a simple HTML page.

Thank you! :)

Upvotes: 0

Views: 203

Answers (2)

Kevin B
Kevin B

Reputation: 95062

The php code that you have been writing likely is only the html template version of php (for lack of better terms...)

When a .php page is requested in the browser, a php interpreter is invoked that parses the php tags in the html and replaces it with html/text. That result is then sent to the browser.

node.js doesn't work that way.

Node.js is a lot more.... verbose than php when it comes to this specific topic. node.js is FAR more than just a web application framework or webserver, it can also be used as an executable of sorts to run common tasks.

typically, to get the kind of functionality you are looking for in node.js, you would use a templating framework such as handlebars along with express to handle the webserver and routing. Here's an example:

// this is just an example, it may or may not work, I did not test it.
var express = require('express'),
    app = express(),
    exphbs = require('express-handlebars'),
    hbs,
    path = require('path');

// serve all files under the /assets folder as static files
app.use('/assets', express.static(path.join(__dirname, '/assets')));

// handlebar engine config
hbs = exphbs.create({
    defaultLayout: 'main'
});

// attach engine and specify view location
app.engine('handlebars', hbs.engine);
app.set('view engine', 'handlebars');
app.set('views', path.join(__dirname, '/views'));

// home page http://domain.com/
app.get('/', function (req, resp) {
    resp.render('home', {title: 'Home | Hello World!', text: 'Welcome to my site!'});
});

// start webserver
app.listen(3000);

the above node app would create a webserver listening on port 3000 that responds to requests to /assets and to /. When / is requested, the home.handlebars view from the /views folder would be rendered using the main.handlebars layout from the /views/layouts Here's an example view that would display the title that was passed in for the / route created above:

/views/layouts/main.handlebars

<!doctype html>
<html>
<head>
    <meta charset="utf-8" />
    <title>{{title}}</title>
</head>
<body>
    {{{body}}}
</body>
</html>

/views/home.handlebars

<h1>Hello World!</h1>
<p>{{text}}</p>

Upvotes: 0

Quentin
Quentin

Reputation: 944443

You seem to be conflating two different features of PHP:

  1. Many web servers can be configured to run PHP programs through a PHP interpreter and serve the results to the browser.
  2. PHP is designed as a template language with bells on, so PHP code is embedded in a template.

If you are using Node.js then you will typically:

  1. Write your webserver in Node.js (although you might configure a front end proxy for it). There is an example of this on the Node.js homepage, but there are also various frameworks, such as express, which do a lot of the heavy lifting for you.
  2. Keep your template code separate from your program code. Node has many template modules available for it.

Quoted from the Node.js homepage:

An example: Webserver

This simple web server written in Node responds with "Hello World" for every request.

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello World\n');
}).listen(1337, '127.0.0.1');
console.log('Server running at http://127.0.0.1:1337/');

To run the server, put the code into a file example.js and execute it with the node program from the command line:

% node example.js
Server running at http://127.0.0.1:1337/

Here is an example of a simple TCP server which listens on port 1337 and echoes whatever you send it:

var net = require('net');

var server = net.createServer(function (socket) {
  socket.write('Echo server\r\n');
  socket.pipe(socket);
});

server.listen(1337, '127.0.0.1');

Upvotes: 3

Related Questions