WebGL where to start and how to prepare?

Question

JavaScript

Good day!
Actually, subject.
Some time ago I was playing with cocos2d.js and not having the slightest idea what and how it works, I stole random pictures from Google, trying to blind something that works.
I don’t know why, but I’m interested in this topic, although there is no specific task (yet). The main reason: "I want!". There is an option that uncle customers may want some kind of special animation.
I already found such a topic here, but I would like to get a more detailed answer. There are a lot of things in Google and I immediately got lost. Everyone praises their framework/rendering library. I don’t know how normal it is to use them without knowing the basics and whether they (the basics) need to be studied at all with such and such a set of APIs (for example, the same tree.js).
My writing is more like: I want something - I don’t know what)))
But I need advice on where to start: from the bottom like learningwebgl.com/blog/?page_id=1217 and then with some kind of understanding of the matter (I hope it will appear) move on or vice versa - from a fat man like ThreeJS or BabylonJS when special tasks arise (I love something that is not like people have) to delve into asi.
Thank you for mastering so many letters (=

Answer 1

I also studied webgl a couple of years ago, it was also interesting (it came in handy once for little things, but I don’t regret it).
Rumor has it that WGL is useless to learn from the source of other applications, and there is some truth in this. Although the sources will come in handy later when you understand the basics.
learningwebgl helped me at one time, I chose the path to study without libraries - a very useful experience can then be transferred to desktop openGL, although the versions there are newer.
I recommend this way.
go through these articles - start with rendering triangles - the main thing is to understand the essence - how to transfer data from js to video - how to access them from shaders.
then deal with the transformation matrix - vector arithmetic - see what functions for vectors and matrices are in the shader language.
understand what pixel and vertex shaders are for. Personally, reading the OpenGL ES 2.0 specification (google it on the net) helped me a lot in this regard .
When you understand all this kitchen from the inside, you can choose a library to work with it , because it’s very hard to work without libraries - a lot of repetitive code (the interface is very low-level), it’s really possible to write only something very simple, or over time you will notice that you are doing your own framework / library.
In general, the topic is very interesting - a lot of exciting things are ahead, but you really need to study a lot of things, it will take months in parallel with the work.
With libraries, in fact, you can get the result almost immediately - but if you do something more or less typical.
Hope it helps and good luck!

Answer 2

If you want the basics of 3D, then here is a cool, IMHO, series of articles: habrahabr.ru/post/248153

Answer 3

Soon the course on webgl will start on the courser, you can sign up
https://www.coursera.org/course/webgl

Answer 4

You already wrote the answer to your own question. Indeed, first the basics, for which we study lessons from learningwebgl.com . And then there are ready-made engines (although no one forbids writing something of their own). Most likely, you will have to master some kind of 3d modeling tool in parallel. If there is no experience, take Blender , according to the possibilities it is just a monster, but it is available for free.
Separately, I note that many people will soon need 3D on the site. If you have experience in 3D frameworks and basic 3D modeling skills, you will be provided with a job for the coming years.