Move from Editor to Codepen

Please note that I am completely new to 3D modelling etc.

I got into this stuff because I wanted to create a 3D model of a product for a business and put it on the web. I have created the model in Blender, exported it as a .glb, dropped the .glb in the Threejs editor, but how can I get it from here to Codepen without publishing it publicly?

Thanks in advance <3

So you want the codepen to be private? Besides, codepen does not allow to upload files. Where do you want to host your glTF asset?

1 Like

Yes, I would like to upload it somewhere privately. Are there any websites where I can host it privately with more ease than uploading it to my own webhosting? Is it difficult to transfer it to my own webhosting?

Everybody can open your app when you host it in the web. To make sure access is limited, you would need something like a password check. Or a real user account system. Are you aware of that?

Yes, I know. I can password protect a directory. I would rather upload it somewhere. Intuitively, this seems to me like the easier option than hosting it on my own webhosting account. Is my intuition wrong? How would I go about exporting the 3D model from the editor?

there are much better web IDEs than codepen. for instance codesandbox. you can upload files there and switch boxes to public, unlisted and private. you would usually drop assets into the public directory. the layout is a bit different, looks like this: Stage presets, gltfjsx - CodeSandbox but imo the overall experience is very convenient.

with this you also don’t need to manage dependencies, just import from ‘three’ or whatever you need and it will npm install the library for you. i have a vanilla threejs starter as well, but without models: Threejs basic example - CodeSandbox but drag them into your project.

1 Like

Awesome! I am not attached to CodePen. Any similar one will work too :slight_smile:

However, how do I get the code from threejs’s editor or can I simply drag and drop the .glb file there too?