# Facing error "Failed to load resource: the server responded with a status of 404 (Not Found)" in web browse console

**URL:** <https://discourse.processing.org/t/facing-error-failed-to-load-resource-the-server-responded-with-a-status-of-404-not-found-in-web-browse-console/2433>\
**Category:** p5.js\
**Created:** [August 7, 2018, 3:41am UTC](https://discourse.processing.org/t/facing-error-failed-to-load-resource-the-server-responded-with-a-status-of-404-not-found-in-web-browse-console/2433 "2018-08-07T03:41:23Z")\
**Posts on this page:** 3\
**Page:** 2

<div class="post-metadata">

**Author:** ![lqdev](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/lqdev/32/29_2.png) [@lqdev](https://discourse.processing.org/u/lqdev)\
**Post date:** [August 8, 2018, 3:59pm UTC](https://discourse.processing.org/t/facing-error-failed-to-load-resource-the-server-responded-with-a-status-of-404-not-found-in-web-browse-console/2433/21 "2018-08-08T15:59:27Z")

</div>

It seems like the problem is the JS files not being in the `public` folder. Express limits available files to a specified folder, so that no one can access your `server.js` through the browser and potentially exploit vulnerabilities in your code. Put your `p5.*` files into the `public` folder and it should work.

---

<div class="post-metadata">

**Author:** ![kfrajer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kfrajer/32/196_2.png) [@kfrajer](https://discourse.processing.org/u/kfrajer)\
**Post date:** [August 9, 2018, 7:19am UTC](https://discourse.processing.org/t/facing-error-failed-to-load-resource-the-server-responded-with-a-status-of-404-not-found-in-web-browse-console/2433/22 "2018-08-09T07:19:51Z")

</div>

So Dan explains that in the video. If you watch from about minute 8:00 and more toward minute 9:10, he moves the p5js files to the `public` folder. If you think about this, your server is delivering the pages. For many programs, they try to keep server files and delivering files in different folders. This makes sense: You dont want to mix those files… it adds clarity to your file layout.

Dan post his code in github: [website-archive/Node/sockets at main · CodingTrain/website-archive · GitHub](https://github.com/CodingTrain/website/tree/master/Node/sockets)

Looking at those files, it seems somebody changed the code and remove access to local p5js support files and cross-linked them to the CDN website, as you can see here:

> [https://github.com/CodingTrain/website/commit/50cf54ba8da07fdcb6c58d58cc6959f066bc6b80](https://github.com/CodingTrain/website/commit/50cf54ba8da07fdcb6c58d58cc6959f066bc6b80)

Anyways, the folder structure should be

```plaintext
server/
|--package.json
|--server.js
|--Public/
      |---index.html
      |---sketch.js
      |---Libraries/
            |-----p5.min.js

```

And then your **html** should look like:

```js
<script src="library/p5.min.js"></script>
<script src="sketch.js"></script>

```

Then by setting your express to check the public folder, you should be able to access those files. If it doesn’t work, try changing the port (both in express and when you summon the page using localhost). When testing for posts, it is better to test for post greater than 1000 and even better if you choose something greater than 10000, as I mentioned before.

Kf

---

<div class="post-metadata">

**Author:** ![notna999](https://avatars.discourse-cdn.com/v4/letter/n/edb3f5/32.png) [@notna999](https://discourse.processing.org/u/notna999)\
**Post date:** [April 5, 2020, 11:43am UTC](https://discourse.processing.org/t/facing-error-failed-to-load-resource-the-server-responded-with-a-status-of-404-not-found-in-web-browse-console/2433/23 "2020-04-05T11:43:09Z")

</div>

Thank you so much for posting this! I watched through the same tutorial and I got stuck as the canvas would not appear. I copied and pasted the source code from the server.js and sketch.js and now it works.

When I try and comment out “socket = io.connect(‘[http://localhost:3000](http://localhost:3000)’);” from the sketch.js file the canvas disappears from the localhost-website. I’m just beginning to learn about p5.js, but this socket thing seem to be an important ingredient, yet it was not even in Daniels tutorial. But then again, things might have changed since 2016.

Thanks again!

[Previous page](https://discourse.processing.org/t/facing-error-failed-to-load-resource-the-server-responded-with-a-status-of-404-not-found-in-web-browse-console/2433.md?page=1)