What are the steps to become a good front-end developer?

Question

Career in IT

Dear friends, I want to fully master the frontend, but for this I need a clear order of where to start learning and how to finish, so I can organize my learning more effectively. I ask experienced developers in this area to share a plan for increasing skill. That is, for example:
1) CSS
2) html
3) NodeJS
Please include in the list modern libraries and skills that would be useful in development.

Answer 1

What are your goals?
If you want to work for a good company, then it is better to look at vacancies, for example, here .
I believe that this is the minimum, but it is better to aim at something like this or higher.
In terms of the order of study, I advise you to do this ("book" can be replaced by "website" or "documentation"):
1) read a book on CSS+HTML, made up a simple website
2) read another book on CSS+HTML, made up something sometimes more difficult
3) the same story with JavaScript, the first book - do the exercises, then write something simple, then read other books in the best practices style. Here is a list of books and skills that are required from students in one of the firms.
4) learn "goodies", here my personal preferences are: JQuery, SCSS, Jade, ES6, gulp, InternJS, BackboneJS. Here everything is studied according to the documentation, although there are also many books on jQuery.
5) you can hook on backend and NodeJS if you are interested, at least - understand what is happening there and how, read about RESTful and MVC on servers
6) basic understanding and knowledge of design and related software
—> further points that relate to the word "Good"
7) play around with 2D-3D graphics, animations and various libraries associated with it
8) improve your skills in all points above (optimization, best practices), study the most interesting solutions on different sites, be interested in everything new and practice a lot

Answer 2

My opinion is that a good front-end developer needs the same base as any other developer.
1. Algorithms / data structures, programming experience, such as C++
2. Javascript language, learn the subtleties and understand the differences from other platforms.
3. basic web technologies (protocols, how the browser works, web server, etc.)
4. HTML5, CSS3, Javascript in the browser. At the same step, you can get acquainted with the history of js technologies. View old frameworks, what tasks they solved.
5. jQuery at the level of device understanding
6. CSS preprocessors, methodologies, templating engines, Bootstrap CSS frameworks, etc.
7. MV* frameworks and SPA implementation practices
8. Client-side performance, optimization of everything.
9. Specialized frameworks for your topic
10. Tools vcs, node.js infrastructure, build, CI, team development
Now there is a tendency in vacancies to combine interfaces and frontend, which cannot be considered a good sign. Still, it is worth distinguishing between the pure writing of client js code, the quality of which plays a role, and layout / interfaces / layouts, their testing, adaptation to different platforms, etc.

Answer 3

All kinds of HTML, CSS and JavaScript learn quite linearly from any htmlbook.ru and learn.javascript.ru
At the same time , be sure to understand Git, Grunt / Gulp, preprocessors ( LESS, Sass, Stylus ), autoprefixer, popular frameworks ( Bootstrap, Foundation, Axis ). They rage because layout designers who manually put down prefixes ( relevant? Who the hell knows! ), then pack the entire layout into an archive and send it by mail. You don't have to, here.

Answer 4

The market is already full of good frontends, ask them.