Halo, Habr! Saya sajikan kepada Anda terjemahan artikel "Panduan Praktis Untuk Menjadi Pengembang Frontend Senior" oleh Seifeldin Mahjoub.
Karantina bisa menjadi titik tertinggi Anda
Ada beberapa definisi untuk judul 'Senior', dan mereka berbeda dari perusahaan ke perusahaan. Dan, tentu saja, dibutuhkan banyak keterampilan, baik keterampilan keras maupun soft skill. Chris Coeur menulis artikel tentang karakteristik dan kecenderungan perilaku yang harus dimiliki oleh seorang pengembang senior front-end, yang memberikan gambaran yang baik secara umum.
Pada artikel ini, kami akan membahas 13 hal yang dapat Anda lakukan di lingkungan saat ini, sehingga ketika semuanya berakhir, Anda dapat menjadi pengembang front-end senior.
1. Kuasai dasar-dasarnya
Senjor harus sangat nyaman dengan HTML, JS, dan CSS. Selain itu, mereka harus terbiasa dengan konsep dasar tentang cara kerja Internet, termasuk browser, jaringan, dan server.
Ini berarti bahwa konsep-konsep seperti prototipe, popup acara, tumpukan panggilan, janji, es6 bukan kata-kata kosong untuk Anda. Hal yang sama berlaku untuk CSS, animasi, sistem kisi, konvensi penamaan, dan spesifikasi.
Anda perlu mengetahui banyak konsep, di bawah ini Anda dapat menemukan beberapa sumber daya yang dapat Anda kunjungi dan mengisi pengetahuan yang kurang, setidaknya untuk saat ini. Referensi CSS , Referensi HTML , Fundamental Javascript , Frontend Handbook .
2. Mulailah dengan membaca dokumentasi.
Kebanyakan pengembang ingin tahu dan ingin langsung menulis kode dan bereksperimen dengannya. Semua ini bagus dan menyenangkan, tetapi ini bukan cara paling efektif untuk menguasai kerangka kerja atau alat.
. , , .
, , .
. , , 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. :
, . , , . .
!