How Do You Set Up A Server On The Web To Display A Threejs Project

We built an online test .We can only ever get one HTML to work there; the one that is there now (the silly little spinning box). When we put any other example HTML’s there from https://threejs.org/examples/ we get nothing… not even a black screen. Why would the index.html that we have there now work and nothing else work. What files or folders MUST we have on that web server for the examples to work? We were told you just need an index.html file and a js folder and a css folder to get all of the html examples https://threejs.org/examples/ to work on our web hosts server on the web but they don’t. What have we not uploaded to that server to get things to work?

Is there a step-by-step instruction list for setting up a shared hosting folder on a web hosting server to get everything worker properly for as many browsers to be able to view it? What exactly are the folders you need to create on a public web server to make all the projects in the https://threejs.org/examples/ work?

1 Like

I’d recommend getting comfortable with your browser’s Console and Network tabs in Developer Tools — they’ll show errors on exactly what resources were not found for any given page. The threejs examples are meant to demonstrate most of its features, so everything in the examples/ folder is probably referenced by at least one HTML demo — including many textures and models. In addition, you’d need the library itself from the build/ folder.

When testing these examples, I usually serve the entire repository locally.

1 Like

So when building a folder on Go-Daddy or Siteground hosting
servers for the public to view a project; 1.) I need to make an
folder called “examples” and upload the entire “examples” data
from the zip file? Then 2.) I need to make a “build” folder and
put three.js in there, right? And then 3.) the project index.html
in the first level of the folder? Then 4.) make a folder called
“css” and put the css files from the project bin there? Anything
else I might be missing to set-up that web server on a provider?

So… it turns out, the answer seems to be: Just throw everything in the top level folder on the hosting server and it just works. Other people on here showed me their server set-ups with 20+ folders for textures, CSS, etc. but THREEJS just seems to work without any server configuration. Nice! We are surprised how many “how to do THREEJS” sites don’t mention setting up a hosting server.

1 Like

Saved me 3 weeks of work, thank you. Turns out you just need to upload the entire “three” folder into cPanel (I compressed it into a zip, uploaded to my top folder called public_html, and extracted the folder back out, deleting the zip version) and then import from three/build/three.module.js on your main javascript file.