Pengembang frontend - kursus 47.600 gosok. dari Loft School, pelatihan 3 bulan, Tanggal 28 November 2023.
Miscellanea / / November 29, 2023
Pengetahuan dan kemampuan
Semua pengetahuan yang diperlukan untuk pengembang frontend.
Portofolio
2 proyek modern dan teknologi yang mengesankan dalam portofolio Anda.
Sertifikat
Dengan skor yang mencerminkan tingkat pengetahuan dan tingkat pengaruh Anda.
Awal karir
Kami menjamin pekerjaan bagi semua siswa yang baik dan berprestasi.
Mereka memberi pengetahuan, bukan jawaban. Mereka suka menjelaskan dan mampu menyampaikan informasi yang kompleks dalam bahasa yang dapat dimengerti. Menuntut kualitas kode Anda: Anda tidak akan lulus tugas sampai kode Anda sempurna. Mereka memahami orang lain dengan baik dan tahu bagaimana menemukan pendekatan terhadap siswa mana pun. Selalu siap membantu.
Pengembangan Web Tingkat Lanjut Vue.js
Minggu 1 - Alur Kerja
— Kami bertemu mentor dan kelompok.
— Menggunakan perakitan webpack, kami membuat tata letak yang dipilih untuk proyek akhir.
— Kami memposting hasilnya di Github dan menyerahkannya ke mentor untuk verifikasi.
Pembukaan kursus
1. Bagaimana pelatihannya (01:09:37)
Lihat. Fitur Utama
1. Teori (04:49)
2. Halo Dunia (06:20)
3. Penanganan Acara (02:38)
4. Menangani banyak peristiwa (01:19)
5. Nilai dinamis (01:30)
6. Pengantar Petunjuk (05:40)
7. Petunjuk yang disingkat (00:37)
8. Metode dengan parameter (01:36)
9. Pengubah acara (08:52)
10. Properti yang Dihitung (10:50)
11. Pengamat (06:02)
12. Bekerja dengan kelas (03:37)
13. Bekerja dengan Properti CSS (02:49)
14. Mengakses elemen DOM (03:50)
15. Render bersyarat (04:46)
16. Merender daftar (05:12)
17. Membuat Komponen (04:16)
18. Komponen lokal (02:44)
19. Reaktivitas data (04:35)
20. Properti komponen (03:52)
21. Slot (04:37)
22. Slot dengan cakupan (04:52)
23. Acara Khusus (04:27)
24. Teleportasi (02:53)
Lihat. Komponen file tunggal
1. Menginstal proyek. VUE-CLI (09:22)
2. Komponen file tunggal (03:18)
3. Bekerja dengan gaya (07:02)
4. Melewati atribut dan penangan (02:53)
5. File individual (01:26)
6. Validasi properti komponen (07:35)
7. Validasi peristiwa pengguna (02:01)
8. Komunikasi data dua arah (04:11)
9. Model v khusus (05:51)
10. Kait Siklus Hidup (07:08)
11. Kotoran (04:40)
NPM
1. Apa itu npm? (05:50)
2. Menginstal dan memperbarui npm (02:33)
3. Bantuan dengan npm (01:28)
4. Menemukan dan menginstal paket (04:24)
5. Ketergantungan paket (02:09)
6. File manifes package.json (03:02)
7. Menghapus dan memperbarui paket (03:02)
8. dependensi dan dependensi dev (01:51)
9. Webpack dan npx (04:04)
10. skrip npm (04:02)
11. npm, git dan github (02:40)
Benang
1. Benang (07:07)
paket web. Dasar-dasar
1. Teori (01:09)
2. Konfigurasi dan peluncuran minimal (04:41)
3. Penamaan file (02:34)
4. Loader (04:28)
5. Server pengembang (02:43)
6. Plugin (02:34)
7. Pencarian modul (03:18)
8. Peta Sors (03:17)
9. Dev dkk (02:42)
10. Jenis modul (03:00)
11. Perakitan minimal (05:30)
ESLint. Ikhtisar konfigurasi
1. Pendahuluan (01:26)
2. Instalasi dan peluncuran (03:10)
3. Perbaikan bug (02:04)
4. Konfigurasi (05:21)
5. Format Keluaran (00:52)
Figma untuk desainer tata letak
1. gambar. Antarmuka (04:37)
2. gambar. Organisasi proyek (01:32)
kotak fleksibel
1. Pendahuluan (00:45)
2. Wadah fleksibel (01:43)
3. Penjajaran Sumbu Utama (01:37)
4. Penjajaran sumbu silang (01:50)
5. Menyelaraskan Satu Elemen (01:09)
6. Elemen fleksibel - wadah (00:53)
7. Arah sumbu (03:18)
8. Kontainer multiline (02:54)
9. Menyelaraskan konten multiline (01:25)
10. Proporsi (02:46)
11. Proporsi kompresi (01:24)
12. Ukuran dasar (04:02)
13. Urutan elemen (02:40)
GIT
1. Pendahuluan (07:03)
2. Memulai Git (03:01)
3. Membuat repositori baru (01:09)
4. Menambahkan file ke indeks Git (area tontonan) (06:49)
5. Membuat komit (07:17)
6. Komit navigasi. Batalkan perubahan (12:10)
7. Siklus Git yang khas (03:34)
8. Bercabang di Git (11:27)
9. Konflik saat menggabungkan cabang (06:06)
10. Penyimpanan data sementara (tanpa komit) (05:25)
11. Bekerja dengan repositori jarak jauh (20:04)
12. Menggunakan Halaman GitHub untuk Menghosting Proyek (04:31)
Lihat. Bengkel #1
1. Mulainya proyek (05:24)
2. Komponen Tajuk (04:13)
3. Komponen Ikon (05:06)
4. Menampilkan daftar komponen (02:56)
5. Beralih komponen (03:19)
Minggu 2 - Vue.js
— Kami membuat tata letaknya adaptif.
— Kami akan mengimplementasikan blok “Skills” di Vue.js.
— Kami akan mengimplementasikan blok “Proyek Saya” di Vue.js.
— Kami menerapkan blok “Slider untuk ulasan” menggunakan plugin Vue.js.
Buku Cerita
1. Instalasi (01:56)
2. Cerita pertama (04:35)
3. Menghubungkan komponen (01:24)
4. Perluasan konfigurasi (04:26)
5. Gaya umum (02:08)
6. Cerita untuk komponen (05:23)
7. CDD (04:16)
8. Membuat komponen (02:28)
9. Menerapkan komponen (02:29)
10. Pencatatan peristiwa (03:29)
11. Tambahan latar belakang (01:41)
12. Tombol Tambahan (02:28)
13. Sumber Tambahan (02:17)
14. Kesimpulan (01:11)
JavaScript - ES6
1. Interpolasi string (07:39)
2. Menyederhanakan deskripsi metode (13:35)
3. Default (30:08)
4. Penugasan Destrukturisasi: Objek (07:30)
5. Fitur baru dan browser lama (13:07)
Asinkroni dalam JavaScript
1. Pengatur Waktu (23:44)
2. Memuat gambar (22:21)
3. Janji (36:29)
4. AJAX (32:28)
aksio. Perpustakaan Kueri
1. Pendahuluan (02:23)
2. Mengirim permintaan (02:12)
3. Ikhtisar konfigurasi (04:30)
4. Isi permintaan (01:43)
5. Pengaturan Default (01:38)
6. Pencegat (02:11)
7. Layanan (02:33)
8. async-tunggu (01:18)
Lihat. Bengkel #2
1. Persiapan (02:39)
2. Menghubungkan komponen (02:16)
3. Keluaran kontrol (02:38)
4. Komponen Kemajuan (05:09)
5. Permintaan ke server (06:38)
6. Keluaran data (05:55)
Minggu 3 - JavaScript Asli
— Kami sedang membuat panel admin.
— Kami mempelajari Buku Cerita dan menerapkannya dalam proyek kami.
— Kami melakukan pemrosesan yang diperlukan (validasi) formulir proyek.
VueRouter. Perutean di browser
1. Pendahuluan (04:31)
2. Membangun tautan (02:41)
3. Navigasi perangkat lunak (02:35)
4. Parameter jalur (04:42)
5. Parameter sebagai properti (00:49)
6. Opsi lanjutan dan 404 (03:29)
7. Rute bersarang (03:23)
8. Kelas aktivitas (02:37)
9. Berbagai Tampilan Router (01:08)
10. Impor dinamis (02:00)
11. URL yang indah (02:16)
Vuex. Manajer Negara
1. Pendahuluan (01:13)
2. Koneksi (02:30)
3. Aksi (02:27)
4. Mutasi (02:16)
5. Pengambil (02:02)
6. Penerapan dalam praktik (08:07)
7. Fungsi asisten (02:59)
8. Modul (05:18)
9. Modul dinamis (01:38)
Jawaban pertanyaan
Lihat. Bengkel #3
1. Tata Letak (04:33)
2. Keluaran data (02:42)
3. Mempersiapkan Animasi (02:14)
4. Tampilan tombol (03:45)
5. Pemuatan konten tambahan (11:38)
6. Tampilkan slide setelah transisi (02:17)
Minggu 4 - Vue.js, SPA
— Kami menerapkan SPA di panel admin.
— Kami belajar bekerja dengan data melalui penyimpanan aplikasi
— Kami menggunakan ajax untuk berkomunikasi dengan api, mengatur interaksi klien-server.
Otorisasi. Token
1. Jenis otorisasi (04:20)
2. GitHub OAuth (01:42)
3. Membuat aplikasi GitHub (02:28)
4. Menerima token (08:38)
5. Menyimpan data dalam kode (01:46)
6. Perlindungan rute (04:13)
Lihat. Lokakarya #4
1. Persiapan (01:33)
2. Membuat tindakan (02:30)
3. Status Unduhan (04:01)
4. Permintaan (02:27)
5. Menghapus duplikat (03:29)
6. Perlindungan rute (03:23)
7. Keluar (00:51)
Minggu 5 - Latihan
— Kami menampilkan data yang disimpan dari panel admin ke halaman arahan.
— Kami menguji komponennya.
— Kerja kelompok pada sebuah proyek dengan seorang mentor.
Vue.js. API Komposisi
1. Pendahuluan (01:29)
2. Contoh umum (03:57)
3. Fungsi lagu (01:51)
4. Fungsi reaktif (00:55)
5. fungsi toRef (01:35)
6. fungsi toRefs (00:58)
7. Properti yang dihitung (00:56)
8. fungsi jam tangan (01:41)
9. fungsi watchEffect (03:14)
10. fungsi hanya baca (00:40)
11. Fungsi pengujian (02:30)
12. fungsi batalkan referensi (01:27)
13. Kait Siklus Hidup (00:58)
14. Contoh. Ikhtisar proyek (00:53)
15. Contoh. Memuat fungsionalitas (01:20)
16. Contoh. Kategori (02:20)
17. Contoh. Pemfilteran awal (02:46)
18. Contoh. Peralihan filter (02:11)
19. Contoh. Fungsi pemfilteran lainnya (02:03)
20. Contoh. Metode penyortiran (03:05)
Pengujian kode JS
1. Pendahuluan (16:05)
2. Lelucon (15:47)
3. Manfaat tes (09:01)
4. Liputan (10:02)
Vue.js. Pengujian komponen
1. Menyiapkan paket (04:39)
2. Pembungkus komponen (04:13)
3. Apa yang harus diuji (02:48)
4. Tes pertama (05:25)
5. Memeriksa peristiwa emisi (03:44)
6. Mentransfer properti (02:58)
7. Bekerja dengan elemen bentuk (05:42)
8. Pengaturan umum (01:15)
9. Moki (05:04)
10. Menghubungkan perpustakaan (02:32)
11. Pengujian tindakan (03:26)
12. Menguji toko (02:53)
13. Pengujian dengan gambar (03:08)
Pengujian. Moki
1. Membuat maket (02:39)
2. Bekerja dengan argumen (01:39)
3. Nilai pengembalian (02:57)
4. Modul (04:24)
5. Pengatur Waktu (02:05)
Lihat. Lokakarya #5
1. Komponen Sederhana (03:03)
2. Komponen dengan toko (05:21)
3. Pengujian. Persiapan (03:20)
4. Pengujian. Pengalih (02:38)
5. Pengujian. Masalah (05:08)
Minggu 6 - Menyelesaikan proyek
— Kami sedang menyelesaikan proyek tersebut.
— Kami menyerahkan proyek untuk ditinjau oleh mentor.
— Penilaian ijazah.
Cara mendapatkan pekerjaan di bidang IT: tips dan trik
1. Bagaimana cara mendapatkan pekerjaan di bidang IT? Pencarian, wawancara dan masa percobaan (42:21)
2. Bagaimana cara menemukan pekerjaan jarak jauh dan pesanan lepas? (20:12)
3. Pekerjaan pertama di bidang TI - bagaimana berperilaku? Magang, pekerjaan resmi dan bekerja “untuk mendapatkan makanan” (14:11)
4. Bagaimana cara melewati masa percobaan? (27:10)
5. Bagaimana mempersiapkan wawancara di perusahaan FAANG (08:52)
6. Proses memuat halaman web (25:19)
7. Wawancara programmer - semua yang perlu Anda ketahui (01:24:07)
8. Memecahkan masalah dari wawancara programmer (19:36)
9. Wawancara pengembang frontend (01:37:17)
Pengembangan Aplikasi Web React.js
Minggu 1 - Pengantar React.js
— Kami mengenal tim kursus dan teman sekelas.
— Mempelajari JSX dan Virtual DOM di React.
— Kami sedang mempertimbangkan pendekatan komponen dan metode transfer data.
Kenalan
1. Pembukaan kursus (05:41)
Saya Bereaksi.js
1. Apa itu Bereaksi (07:05)
2. DOM Virtual (02:46)
3. BEJ (06:10)
4. Rendering dengan kondisi (05:11)
5. Bekerja dengan daftar (02:45)
6. Komponen (02:41)
7. Alat Peraga (01:45)
8. Negara (06:45)
9. Acara (02:26)
10. Alat Pengembang Bereaksi (03:58)
II Bereaksi.js
1. Metode siklus hidup (05:19)
2. Komponen - fungsi (01:29)
3. Komponen Murni (02:54)
4. Peristiwa Sintetis (01:42)
5. Bekerja dengan formulir (02:51)
6. Penanganan kesalahan (01:39)
Analisis tugas #1
1. Lokakarya #1 (30:36)
Minggu 2 - Pola React.js, pengujian
— Kami mempelajari komponen, elemen, dan instance dari kelas komponen.
— Kami mempertimbangkan pustaka Recompose, komponen tingkat tinggi, dan pola Render Props.
— Kami memahami keuntungan dari tes, mempelajari Jest, Enzyme, Snapshots.
AKU AKU AKU Bereaksi
1. Pendahuluan (01:43)
2. Tipe Prop (10:18)
3. Konteks (05:19)
4. Referensi (05:18)
5. Portal (05:02)
6. Kait (10:42)
IV React.js
1. Komponen Tingkat Tinggi (HOCs) - Komponen Tingkat Tinggi (10:33)
2. Penerusan ref-forward (HOC) (04:31)
3. Render pola alat peraga (05:25)
4. Komposisi Ulang Perpustakaan HOK (10:32)
5. Pembuatan Profil (04:02)
Pengujian
1. Pendahuluan (05:06)
2. Pelari Tes (02:51)
3. Uji DSL (08:41)
4. Enzim (06:57)
5. Jepretan (03:09)
6. Kisah pengujian (05:01)
7. Perpustakaan Pengujian React (06:32)
Analisis tugas #2
1. Lokakarya #2 (27:54)
Minggu 3 - Redux, perutean
— Kami mempelajari perutean: Perutean sederhana, perutean dengan Switch, serta perutean bersarang.
— Mengenal perpustakaan Redux: konsep dasar dan konsep Store, Actions, Reducers, React-redux.
— Middleware dianggap sebagai cara untuk bekerja dengan Sideeffect.
Perutean di browser
1. API Sejarah (02:48)
2. Perutean sederhana (05:39)
3. Perutean dari Switch (04:16)
4. Perutean bertingkat (05:32)
5. Rute pribadi (04:39)
saya Redux
1. Pendahuluan (04:07)
2. Toko (05:03)
3. Tindakan (02:17)
4. Pereduksi (07:56)
5. Reaksi-redux (03:26)
II Reduks
1. Pendahuluan (03:11)
2. CreateActions (tindakan redux) (09:13)
3. Perangkat Tengah (07:54)
4. Tangani tindakan (05:52)
5. Penyeleksi (06:17)
6. Pilih ulang (04:49)
7. Bebek (06:56)
Analisis tugas #3
1. Lokakarya #3 (39:13)
Minggu 4 - Redux-saga
— Kami sedang mempelajari perpustakaan Redux-saga. Ulangi fungsi generator*. Mari pelajari cara menjalankannya secara paralel.
— Mari kita lihat metode Ambil. Mari pelajari pemilihan sebagai cara untuk mendapatkan data dari Store.
— Kami sedang mencari cara untuk menata gaya aplikasi React. Kami mempelajari perpustakaan ClassNames, StyledComponents, BrowserList, MaterialUI.
Saya Redux-saga
1. Pendahuluan (00:57)
2. Ikhtisar (02:08)
3. Generator (04:11)
4. Menambahkan kisah (02:07)
5. Bereaksi terhadap tindakan (03:53)
6. Peluncuran fitur (02:06)
II Redux-saga
1. Pendahuluan (00:27)
2. Melakukan efek secara paralel (03:41)
3. Berlaku (02:45)
4. Pilih efek (02:04)
5. Batalkan efek (04:05)
Bekerja dengan gaya
1. Pendahuluan (01:34)
2. Gaya CRA (05:21)
3. Nama Kelas (06:32)
4. Komponen Bergaya (07:11)
5. Daftar Peramban (01:37)
6. UI Materi (08:13)
Analisis tugas #4
1. Lokakarya #4 (09:55)
Minggu 5 – Formulir, CI & DI & Penanganan kesalahan klien
— Kami mempertimbangkan untuk bekerja dengan formulir menggunakan pustaka Formik, Redux Forms, React Final Form.
— Kami sedang mempertimbangkan metode untuk memastikan kualitas kode produksi. Kami menganalisis alat-alat seperti: Husky, TravisCI, HerokuNow.
— Kami sedang mempelajari sekumpulan perpustakaan yang berguna untuk pengembangan (Storybook, RamdaJS, Axios).
— Kami sedang mempertimbangkan TypeScript.
Bekerja dengan Formulir
1. Pendahuluan (05:07)
2. Formik (08:51)
3. Bentuk reduks (06:22)
4. Bereaksi bentuk akhir (06:36)
CI & DI & Penanganan kesalahan klien
1. Pendahuluan (05:07)
2. serak (02:32)
3. CI menggunakan TravisCI (03:32)
4. Terapkan ke heroku (04:57)
5. Rollbar (02:00)
Satu set perpustakaan yang berguna untuk pengembangan
1. Buku Cerita (05:32)
2. RamdaJS (04:47)
3. Aksioma (05:52)
4. Naskah (09:31)
Analisis tugas #5
1. Lokakarya #5 (13:17)
Minggu 6 - Pekerjaan proyek
— Kami melengkapi aplikasi dan mengirimkannya untuk ditinjau.
Cara mendapatkan pekerjaan di bidang IT: tips dan trik
1. Bagaimana cara mendapatkan pekerjaan di bidang IT? Pencarian, wawancara dan masa percobaan (42:21)
2. Bagaimana cara menemukan pekerjaan jarak jauh dan pesanan lepas? (20:12)
3. Pekerjaan pertama di bidang TI - bagaimana berperilaku? Magang, pekerjaan resmi dan bekerja “untuk mendapatkan makanan” (14:11)
4. Bagaimana cara melewati masa percobaan? (27:10)
5. Bagaimana mempersiapkan wawancara di perusahaan FAANG (08:52)
6. Proses memuat halaman web (25:19)
7. Wawancara programmer - semua yang perlu Anda ketahui (01:24:07)
8. Memecahkan masalah dari wawancara programmer (19:36)
9. Wawancara pengembang frontend (01:37:17)