471639 (4) [Avatar] Offline
#1
In the express_templates project, I'm having difficulty getting my .css file to link to all of my views. It works on the '/' route, but not the '/name/:myName' route.

Based on my searches and the text, it seems that this should be corrected when we added app.use(express.static(${__dirname}/public`)); in Lesson 11. However, my browser aborts the GET request for the .css file on any /name/:myName page. Specifically, it is trying to GET:

  • http://localhost:3000/name/css/bootstrap.css, and

  • http://localhost:3000/name/css/myStyle.css (the stylesheet I'm playing around with on the project)


  • Obviously, my .css files are not located at those paths, they are in localhost:3000/public/css

    I've got:
  • <link rel="stylesheet" href="css/bootstrap.css"> and <link rel="stylesheet" href="css/myStyle.css"> in my layout.ejs file, and

  • app.use(express.static(`${__dirname}/public`)); in main.js, and

  • In homeController.js:

  • exports.respondWithName = (req, res) => {
      let paramsName = req.params.myName;
      res.render('name.ejs', {name: paramsName});
    }


    This is probably very basic, so I apologize, but I'm stuck and I don't want to move on too much further without understanding what's going on here.

    I'm really enjoying the book and thanks for any help you can provide with my problem.
    TheWexler (38) [Avatar] Offline
    #2
    Thank you for this very easy-to-follow post and again, I apologize for the delayed response. I hope you were able to since solve the problem. What I notice in the code is a missing '/' when you link to your CSS file. Everything else looks good to me. When you link from your layout or EJS file, you'll want to look for the relative '/css/stylesheet.css' path. Let me know if this works for you or if you worked around the problem with another solution.