Hello, Habr! I present to you the translation of the article "A Practical Guide To Become a Senior Frontend Developer" by Seifeldin Mahjoub.
Quarantine can be your high point
There are several definitions for the title 'Senior', and they vary from company to company. And, of course, it takes a lot of skills, both hard skills and soft skills. Chris Coeur wrote an article about the characteristics and behavioral tendencies that a senior front-end developer should have, which gives a good picture in general.
In this article, we will cover 13 things that you can do in the current environment, so that when it is all over, you can become a senior front-end developer.
1. Master the basics
Senjor should be very comfortable with HTML, JS, and CSS. In addition, they must be familiar with basic concepts of how the Internet works, including browsers, networks, and servers.
This means that concepts such as prototypes, event popups, call stack, promise, es6 are not empty words for you. The same goes for CSS, animations, grid systems, naming conventions, and specifications.
You need to know numerous concepts, below you can find some resources that you can go over and fill up knowledge that you lack, at least for now. CSS Reference , HTML Reference , Javascript Fundamentals , Frontend Handbook .
2. Start by reading the documentation.
Most developers are curious and want to go straight to writing code and experimenting with it. All this is good and fun, but it is not the most effective way to master a framework or tools.
. , , .
, , .
. , , win-win.
3.
CLI, angular-cli create-react-app.
, .
, , , . 'nice-to-have' , , , git .
, , (webpack/parcel), .
4. (style guide)
, , .
Style guide (Best practices), .
, , , vue-eslint-plugin.
— . , , , .
, , , , , DOM .
dev tools console.log debugger.
6.
Vue React . , .
, DOM . DOM DOM-.
, , , .
( Vue), , Vuejs, .
7.
— . .
.
Advance Vuejs Component Patterns
Advanced React Component Patterns .
8.
— .
, , , , , .
, react-hooks, , Vue, Vue-composition API Mixins.
, .
9.
, , .
, , , , .
, flux pattern, event emissions callbacks props.
Vue-.
10. -
, , , , , .
, , , .
unit , snapshot e2e .
.
11.
- , , . , .
, , , .
, . , React, Angular, Vue Stencil, . , .
12.
, , , . , .
, , Jamstack, accessibility, , , service workers, , .
13.
, , . , , .
-, , , , , .
. , . , .
P.S. :
, . , , . .
!