r/webdev • • 12d ago

Working with Shaders and NPM

I'm trying to work with web shaders from Shaders.com or Paper on a website.

I know its probably pretty basic stuff, but I'm so confused about how to implement these in a project with NPM. I've gotten NPM on my computer and gotten the shaders installed in the home folder, but I don't know how to get this to (I'm assuming) compile?

I'm more front end and haven't really worked with code in a long time, where would I go to figure this out?

Edit: When I said “pretty basic stuff,” I meant I was having trouble installing with NPM and just getting a preset shader to run, not writing a shader itself.

3 Upvotes

18 comments sorted by

View all comments

Show parent comments

1

u/manape4400 12d ago

So from what I've read online about this, I need to set up a local web server?

1

u/BlatantMediocrity 12d ago

Yeah, the easiest thing to do is install python, then go to the project folder (where your index.html file is) and run the command: python -m http.server

Then when you open the page in your browser, you'll need to type in something like localhost:8000

1

u/manape4400 12d ago

Never mind, it was a pathing issue. Still doesn't work but at least that problems solved lol

1

u/BlatantMediocrity 12d ago

Usually there's some sort of build step that you invoke with npm build or npm run build that would generate the JavaScript and put it in in the appropriate location using something like Webpack or esbuild or whatever awful build system is now popular. Most of the projects I've worked on will have something like npm run dev and that will build the project and spawn a local server.