How to load my css and js files with node.js [duplicate]

Question

I have looked at a lot of similar questions but I can't get it to work, so I'll just ask it myself

I have a folder like this:

Source Code
  Frondend
    Graphs.html
    Graphs.css
    Temperature.js
  Server_Backend
    server.js

I want to run these file with node.js, I can also use express if necessary.

I have this in server.js to load my html:

fs.readFile('../Frondend/Graphs.html', function (err, html) {

    if (err) throw err;

    http.createServer(function(request, response) {
        response.writeHeader(200, {"Content-Type": "text/html"});
        response.write(html);
        response.end();
    }).listen(8080);
});

these are the links in my html header:

<script type="text/javascript" src="Temperature.js"></script>
<link rel="stylesheet" type="text/css" href="Graphs.css">

How do I also include my css and js file? As I said I tried a lot of things already but I can't seem to get it to work.

Michiel Dral · Accepted Answer · 2019-01-07 19:10:28Z

0

So what the browser will do, after you send the html (which you do perfectly), it will look for http://yourdomain.com/Temperature.js and http://yourdomain.com/Graphs.css. To allow express to expose these to the browser, express has the express.static function.

You can do, when using express, is

app.use(express.static('./Frondend'));

This will take any request to your website, and will check if there is a file in the Frondend folder, and if so, will send that file.

Hope that makes sense :)

answered Jan 7, 2019 at 19:10

Michiel Dral

4,1251 gold badge23 silver badges21 bronze badges

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

1 Comment

DaanR Over a year ago

It's not working but there might be other things going wrong idk, is it possible that it doesn't work because it is in a different folder? From Server_Backend it first needs to go back to Source code because there is the Frondend folder.

japrescott · Accepted Answer · 2019-01-07 19:10:51Z

0

since you are a beginner, I would use express.js. It makes it much easier to deal with things like static assets (css and javascript files) and helps you with routing requests to different code parts (like /users, /files, /about)

To solve your question, best would be to look at following information from express.js about static files after you looked at the getting started guide

answered Jan 7, 2019 at 19:10

japrescott

5,0633 gold badges29 silver badges38 bronze badges

Collectives™ on Stack Overflow

How to load my css and js files with node.js [duplicate]

2 Answers 2

1 Comment

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Linked

Related