Kursus Wawancara Frontend
Kursus wawancara frontend terstruktur mencakup JavaScript, HTML, CSS, React, browser, kinerja, aksesibilitas, dan keamanan dengan soal latihan.
Kemajuan kursus
0 / 5
Kembali ke kursus
Yang akan Anda pelajari
- Memahami format wawancara.
- Menjelaskan JavaScript dan async.
- Membuat HTML semantik dan CSS responsif.
- Menggunakan komponen dan hook React.
- Meningkatkan kinerja, aksesibilitas, dan keamanan.
Sebelum mulai
- Pengetahuan JavaScript dan HTML membantu.
- Disarankan memahami dasar React.
- Membuat komponen UI kecil membantu latihan.
Pelajaran 1 Memahami Wawancara Frontend
Wawancara frontend mencakup JavaScript, HTML, CSS, React, browser, kinerja, aksesibilitas, dan keamanan. Kandidat menjelaskan konsep, menulis kode, dan menyelesaikan masalah UI. Mulai dari JavaScript, lalu HTML dan CSS, React, akhirnya event, kinerja, dan keamanan. Jelaskan event loop, key React, dan Core Web Vitals. Kursus ini menyusun lima pelajaran dengan 60 soal asli.
Contoh
Contoh: jelaskan closure dan promise pada dasar JavaScript.Pelajaran 2 Dasar JavaScript
Wawancara JavaScript dimulai dengan dasar: closure, hoisting, strict equality, promise, event loop, metode array. Closure menjaga scope luar; === menghindari koersi; promise mewakili async; event loop menjalankan microtask. map, filter, reduce penting; pure function tanpa efek samping; immutability membuat nilai baru.
Contoh
Contoh: [1, 2, 3].map(n => n * 2) mengembalikan [2, 4, 6].Pelajaran 3 HTML, CSS, dan Layout
HTML semantik meningkatkan aksesibilitas dan SEO. Spesifisitas menentukan CSS yang menang. Box model: content, padding, border, margin. Flexbox satu dimensi, Grid dua dimensi. rem relatif root, em parent, vw lebar viewport, vh tinggi. Media query membuat responsif. position: fixed memakai viewport dan border-box memasukkan padding.
Contoh
Contoh: gunakan CSS Grid untuk dasbor dengan sidebar dan area konten.Pelajaran 4 React dan Browser
React mencakup komponen, props, state, hook, dan render. useState, useEffect, useMemo adalah hook utama. Virtual DOM dan rekonsiliasi mengoptimalkan pembaruan; daftar butuh key. Browser mencakup DOM, event, event loop, microtask, cookie. Delegasi memakai satu listener induk; stopPropagation menghentikan bubbling; preventDefault menghentikan aksi.
Contoh
Contoh: const [count, setCount] = useState(0) membuat state penghitung.Pelajaran 5 Kinerja, Aksesibilitas, dan Strategi
Soal kinerja meminta halaman lebih cepat. Debouncing menunda, throttling membatasi, lazy loading menunda sumber. Core Web Vitals: LCP, INP, CLS. Aksesibilitas: HTML semantik, ARIA, keyboard. Keamanan: XSS, CSP, CORS. Jawab terstruktur: masalah, metrik, sebab, solusi.