In what order to learn front-end (and not only) technologies?

Question

Web development

Good day.
Help to understand all the modern variety of web development tools.
I’m 22 years old, I’ve been working either as a front-end, as a layout designer, or I don’t know who) for 3-4 years already. First as a freelancer, recently in a small office.
A long time ago I had a feeling that if I don’t finally take up the study of modern technologies, then I will soon become completely unclaimed, and I even have a strong desire to buy some expensive web development courses, mainly due to the fact that I myself I know where to start.
And now the following question arose before me:
It seems that I decided on what I want to study, but this is not accurate) i.e. If they offer something else - I will be very glad to hear.
And the question itself: in what order to study technologies?

According to my estimates at the moment I know well:

• HTML
  
• css
  
• Wordpress
  

So I know:

• git
  
• JS
  
• jQuery
  
• PHP
  
• 1C Bitrix
  

And here is what I would like to explore as a plus to the previous list:

• HTML5
  
• CSS3
  
• SVG
  
• BEM
  
• Jade
  
• SASS
  
• Bootstrap or Foundation
  
• GULP
  
• RegExp
  
• ES6
  
• ReactJS
  
• redux
  
• OOP
  
• MySQL
  
• MongoDB
  
• NodeJS
  
• ruby
  
• Ruby on Rails
  

Help put it all in the right order.
If you advise me to add something to this list or remove it, I will be grateful. For a tip, in general, I would like to fit 100% under the senior front-end, and additionally I would like to be able to write a service alone (albeit for a long time), let's say, a task manager application with notes including front and back end. Thanks in advance for advice)

Answer 1

Roadmap to become a web developer in 2017