Load html WITH static resources from Node.js

Question

I'm trying to create a basic website on Node.js in order to learn. I have an html with some css and js files for the site. I want to serve this pages from Node.js, so I can make ajax calls to this later.

This is the code I have so far:

var express = require("express");
var app     = express();
var path    = require("path");


app.get('/',function(req,res){
  res.sendFile(path.join(__dirname+'/views/index.html'));
});

app.listen(3000);

console.log("Running at Port 3000");

It loads the html correctly, but it does not find the resources css/js.

How should I implement a basic web server, where I can specify the page to return with the css/js resources I need?

Or maybe the question should be, is this the correct way to make the webpage using node?

check express-static module for serving static assests such as js css etc. also you will eventually want to use res.render instead of res.sendFile to be able to put some dynamic data into views — Molda
– Molda, Commented Nov 26, 2015 at 19:27

swapnesh · Accepted Answer · 2015-11-26 19:37:01Z

3

You are already using express, so best way is to define your public folder where you are putting your css or js files to make it available as static resource -

app.use(express.static(__dirname + '/public'));

public
 -css
  -style.css
 -js
  -script.js

then in your index.html file refer as -

<link rel="stylesheet" href="css/style.css" />

edited Nov 26, 2015 at 19:37

answered Nov 26, 2015 at 19:28

swapnesh

26.8k24 gold badges97 silver badges129 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Pablo Over a year ago

So, I added this line before the app.get. with the folder my resources are. How should be the url to serve them now?

swapnesh Over a year ago

@Pablo yes add it before your routes

Pablo Over a year ago

Yes, but how should now access that files?

Collectives™ on Stack Overflow

Load html WITH static resources from Node.js

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related