HTML file cannot find javascript file in folder structure

html
javascript
nodejs

#1

Hello, everyone.

I am trying to put my javascript event handlers in a file separate from the HTML pages but it doesn’t seem to be working and instead I get a 404 error (when I view the console to see what’s going on). The folder containing the javascript is on the same level in my folder structure at the HTML file.

github repo: https://github.com/olddognewtrix123/blankblank

Here is the HTML:

<head>
	<title>whodat.</title>

</head>

<header>
	<p>Welcome<span id="display-name"></span>!</p>
</header>

<body>
	<div class="container">

		<br />
		<p >whodat</p>
		<button class="btn btn-clickMe1" onclick="myFunction1()">click me</button>
		<p id="demo"></p>
	</div>

  <script src="/clientClickControllers/clickController.client.js"></script>
     	</body>

  </html>

Here are the contents of the javascript file:

 'use strict';
 var path = process.cwd();
 (function () {

   var clickMe = document.querySelector('.btn-clickMe1');


   clickMe.addEventListener('click', function () {
           function myFunction1() {
    document.getElementById("demo").innerHTML = "Hello World";
 }
     });
 });

What am I missing?


#2

OK, I found the answer here:

At the heart of the problem was a) I had not set up my static file middleware properly, and b) " the default setup for most express apps is to have a public folder with a js folder inside that"

I went and looked at a working example of where someone had already built a complex app, and followed the same folder structure convention. Then I set up my middleware correctly. Now the HTML page can "find’ the .js page with the script.

On to the next error!