How to connect static HTML and CSS files to Node.js application?

Question

I try to show a (static) HTML webpage via Heroku. I have followed this tutorial: https://www.youtube.com/watch?v=gAwH1kSODVQ but after many attempts it is still not working.

I'm rather new to coding, so if you can give concrete examples that would be great!

The following files have been pushed to heroku:

server.js 
package.json
Procfile.js
(folder) public with index.html, main.css

//Server.js file:

var express = require('express'); //require express module in server.js file
var app = express();
var mongojs = require('mongojs');
var db = mongojs('birthdaylist', ['birthdaylist']);
var bodyParser = require('body-parser');
var http = require('http');
var port = Number(process.env.PORT || 3000);

app.use(express.static(__dirname + '/public')); //connect to html file
app.use(bodyParser.json());

app.get('/birthdaylist', function(req, res) {
  console.log("The server has received a GET request.")
  db.birthdaylist.find(function(err, docs){
    console.log(docs);
    res.json(docs);
  });
});

app.post('/birthdaylist', function(req, res){
  console.log(req.body);
  db.birthdaylist.insert(req.body, function (err, doc){
    res.json(doc);
  });
});

app.delete('/birthdaylist/:id', function(req, res){
  var id = req.params.id;
  console.log(id);
  db.birthdaylist.remove({_id: mongojs.ObjectId(id)}, function(err, doc){
    res.json(doc);
  });
});


app.listen(port, function () {

});

shudima · Accepted Answer · 2015-12-22 13:54:21Z

1

you should use:

app.listen(%PORT_NUMBER%, function () {
  // some code here
});

Instead of:

var server = http.createServer(function(req, res){
    res.writeHead(200, {'Content-Type':'text/html'});
    res.end('<h6>Hello worldsfasfd!</h6>');
});

edited Dec 22, 2015 at 13:54

answered Dec 22, 2015 at 13:24

shudima

4601 gold badge5 silver badges9 bronze badges

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

12 Comments

Roy Over a year ago

It worked, but when I refreshed the page I get an Application error. I have updated my code (see above).

Roy Over a year ago

I tried to access tue2id60.herokuapp.com (if you go to that site you'll see the error")

shudima Over a year ago

It looks like there was a problem during the heroku deployment. did you get any errors? try to look at the logs

Roy Over a year ago

The only error I can find is "NPM_CONFIG_LOGLEVEL = error"

shudima Over a year ago

Does it work localy? What exactly did you update in your code? Try to redeploy.

|

Collectives™ on Stack Overflow

How to connect static HTML and CSS files to Node.js application?

1 Answer 1

12 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

12 Comments

Your Answer

Sign up or log in

Post as a guest

Related