To get started on that, I would check out my deck from a SharePoint Saturday last year on getting started with the SharePoint Framework:
I also wouldn't jump on the framework wagon right away.. Angular, TypeScript, React, etc. - are all fantastic to learn. However the curve is steep. Coming from Server-side development you might take to TypeScript right away but some of the others take time to learn. From your list, I'd learn:
1. Node - very elementary understanding for development
2) NPM - again check out my slides to get a handle on it
3) Gulp - for automating tasks
Then I'd maybe move on to TypeScript & Angular.. Debate is between Angular 1 or Angular 2, I'm still more in the Angular 1 boat.
Finally in terms of the "how" - Pluralsight has solid courses on all the technologies you've listed below.
Then, if you want to get deeper into the SPFx, and want some deeper explaination of the tooling etc @Andrew Connell just started creating courses (Voitanos) around this and has a free getting started with SPFx which would get you started with setting up your environment. https://www.voitanos.io/
But havent had time to go any further up. It seems to me that Typescript would be the next logical step.
All the demos and walkthroughs I have attempted, I am just following rote steps, gulping and yo-ing and whatever else.
This has been my knock against SPFX, while its great for developers its rough for people that have been "developing" in this space for a long time (who are typically not developers).
Luckily, I've got a SEWP working in modern UI, so I can delay the inevitable.
I wouldn't suggest trying to learn any of these tools blindly. As the others in this thread have said, try to build a few simple but useful things first. Then as your requirements get more complex, decide which building blocks make sense to add to the mix.