Use OpenGL and WebGL in a website with my Shader using ? Three.js?

I'm looking to embed a couple of my own Shaders in my website directly. If I understand correctly OpenGL and WebGL are the way to go (though I am open to suggestions). I am however looking to allow editing of the code and the ability to recompile and play real time. Note, I am not looking to use a 3rd party site to host my Shader and embed it in my site. I'm thinking that maybe Three.js is the best practices way to go, but I don't know. If interested in this project, please let me know you read this and let me know what you would use.

Basically a simple mockup site would be needed with an iframe (if that is the best way to go) which displays a "video" of the execution of the Shader. On clicking on it, it would give a modal popup with a player and the code being editable and a recompile button which would update the Javascript and restart the rendering. Also, if anything needs to be compiled you'd have to instruct me on how to do that.

Also, for the right developer there would be additional work in helping me develop Shaders so please let me know if this is something you can do.

Some useful sites that make me think that Three.js might be the correct choice:

https://www.html5rocks.com/en/tutorials/webgl/shaders/
https://medium.com/@SereneBiologist/rendering-escape-fractals-in-three-js-68c96b385a49
https://www.taoeffect.com/other/fractals/mandelbulb/