Menjadi Front-End Web Developer Expert

4.88 •

Front-End Web

Learning Path

Menjadi Front-End Web Developer Expert

Teknologi:

Web

Level: Mahir - Profesional

Level: Mahir - Profesional 100 Jam Belajar

6.605

Siswa Terdaftar

Pelajari teknik-teknik expert serta modern dalam membangun website yang optimal pada seluruh perangkat, terutama pada perangkat mobile.

Belajar Sekarang

Informasi kelas Lihat silabus

Learning Path Front-End Web Developer

Kelas ini merupakan langkah ke-enam Anda untuk menjadi Front-End Web Developer.

Langkah sebelumnya

Langkah 5

Belajar Tools Front-End Web Intermediate

65 Jam 4,44 Level Mahir

Apa yang akan Anda dapatkan

Sertifikat

Dapatkan sertifikat standar industri setelah menyelesaikan kelas ini.

Code Review

Kode yang Anda kerjakan akan di-review secara komprehensif oleh Reviewer.

Forum Diskusi

Diskusikan materi belajar dengan siswa lainnya.

Modul Tutorial

Materi bacaan elektronik disajikan dengan bahasa yang mudah dipahami.

Submission

Uji kemampuan teknis Anda dengan mengerjakan tugas submission.

Level Mahir
Menguasai materi dan latihan tingkat lanjut. Kelas ini mensyaratkan sejumlah penguasaan landasan pengetahuan yang baik.

Level Profesional
Melanjutkan tingkat mahir. Lebih banyak studi kasus dengan praktik terbaik standar industri.

Deskripsi

Saat ini, banyak website aktif dirancang untuk tampak optimal hanya pada perangkat desktop. Namun faktanya, kini pengguna website didominasi oleh smartphone. Dengan begitu, Web Developer dituntut untuk mampu membangun website yang dapat beradaptasi pada smartphone dengan baik. Perusahaan seperti Tokopedia, Twitter, dan Facebook berhasil mengembangkan website yang nyaman diakses pada perangkat smartphone. Hal ini bisa tercapai dengan memperhatikan aspek mobile friendly, accessibility, dan optimization.

Web Developer saat ini harus mampu menyajikan website yang optimal pada perangkat smartphone.
Web merupakan platform yang dapat diakses melalui banyak macam perangkat. Hal ini menjadi keuntungan jika Anda mengembangkan aplikasi berbasis Web.
Aplikasi yang dibangun menggunakan web memiliki kecanggihan layaknya aplikasi native Android atau iOS.
Website adalah platform yang dijangkau oleh Search Engine seperti Google Search, sehingga website cocok sebagai media promosi bisnis atau konten.
Mengembangkan website termasuk pengembangan yang mudah di-maintenance dan mudah untuk dipublikasi.

Target dan Sasaran Siswa

Kelas ini ditujukan untuk seorang Front-End Web Developer yang ingin mengembangkan website yang optimal, mudah digunakan, serta canggih ketika diakses oleh seluruh perangkat terutama smartphone.
Kelas dapat diikuti oleh siswa yang melek IT sehingga wajib memiliki dan dapat mengoperasikan komputer dengan baik.
Siswa diharapkan sudah mampu mengembangkan aplikasi web di sisi Front-End, menguasai HTML, CSS, dan JavaScript serta sudah familier dengan Webpack sebagai module bundler.
Siswa harus bisa belajar mandiri, berkomitmen, benar-benar punya rasa ingin tahu, dan tertarik pada subjek materi, karena sebaik apa pun materi kelas ini, tidak akan berguna tanpa keseriusan siswa untuk belajar, berlatih, dan mencoba.
Di akhir kelas, siswa dapat membuat aplikasi front-end web yang responsif, memiliki aksesibilitas yang baik, mudah di-maintenance, memiliki sifat native, dapat diuji, dan memiliki performa yang baik.

Selengkapnya

Sembunyikan

Learning Path

Kelas ini merupakan langkah ke-enam Anda untuk menjadi Front-End Web Developer.

Langkah sebelumnya

Langkah 5

Belajar Tools Front-End Web Intermediate

65 Jam 4,44 Level Mahir

Peralatan Belajar

Spesifikasi minimal perangkat:

Prosesor

Intel Dual Core (Rekomendasi Core i3 ke atas)

Tools yang dibutuhkan untuk belajar:

Teks Editor (VSCode, Atom, atau Emacs)

Lihat semua peralatan belajar

Peralatan Belajar

Spesifikasi minimal perangkat

Kelas ini membutuhkan spesifikasi perangkat seperti berikut:

RAM

2GB (Rekomendasi 4GB)

Layar

1366 x 768 (Rekomendasi Full HD 1920 x 1080)

Sistem Operasi

Windows, Linux, MacOS

Prosesor

Intel Dual Core (Rekomendasi Core i3 ke atas)

Tools

Kelas ini membutuhkan beberapa tools berikut:

Teks Editor (VSCode, Atom, atau Emacs)

Web Browser (Google Chrome atau Mozilla Firefox)

Command Line (Terminal atau cmd)

Metode Ajar

Online - Self-paced Learning
- Total jam belajar : 100 jam
- Rekomendasi waktu belajar : 10 jam per minggu (selesai dalam 63 hari)
- Anda tentukan sendiri berapa lama waktu yang akan digunakan untuk belajar materi kelas ini selama masih aktif terdaftar pada kelas
Fasilitas Pengajaran
- Materi bacaan elektronik : Materi akan disajikan dalam bentuk teks dan bacaan
- Forum diskusi : Setiap kelas memiliki sebuah forum diskusi yang dapat Anda gunakan untuk bertanya dan berdiskusi
- Evaluasi pembelajaran: Submission (proyek akhir) berupa web app katalog restoran dengan experience dan fungsionalitas yang baik ketika diakses pada perangkat mobile
- Sertifikat kompetensi

Lihat semua metode ajar

Metode Ajar

Online - Self-paced Learning
- Total jam belajar : 100 jam
- Rekomendasi waktu belajar : 10 jam per minggu (selesai dalam 63 hari)
- Anda tentukan sendiri berapa lama waktu yang akan digunakan untuk belajar materi kelas ini selama masih aktif terdaftar pada kelas
Fasilitas Pengajaran
- Materi bacaan elektronik : Materi akan disajikan dalam bentuk teks dan bacaan
- Forum diskusi : Setiap kelas memiliki sebuah forum diskusi yang dapat Anda gunakan untuk bertanya dan berdiskusi
- Evaluasi pembelajaran: Submission (proyek akhir) berupa web app katalog restoran dengan experience dan fungsionalitas yang baik ketika diakses pada perangkat mobile
- Sertifikat kompetensi

Kontributor

Curriculum Developer yang membangun kelas ini:

Dimas Maulana Dwi Saputra

Curriculum Developer at Dicoding Indonesia

Ash Shiddiqul Akbar Hidayat

Dicoding CTO

Reviewer

Code Reviewer yang akan me-review tugas dan kode Anda:

Moch Ridwan Taufik Alamsyah

R&D Engineer at csacomputer.com, External Code Reviewer at Dicoding Indonesia

"What We Learn When We Learn By Doing?"

Full Stack Development Enthusiast
Mobile Development Enthusiast
Machine Learning Enthusiast

Catur dari Dicoding

Code Reviewer at Dicoding Indonesia

Associate Android Developer

Luthfi Alfarisi

External Code Reviewer at Dicoding Indonesia

Associate Android Developer
Android & Web Enthusiast

Inggih Wicaksono

Web Developer at Erasys Consulting

- Fullstack man but currently focus on React.js

- Hacktoberfest fans @igihcksn

Agista Septiyanto

Code Reviewer at Dicoding Indonesia

Associate Android Developer

Lihat semua kontributor dan reviewer

Kontributor & Reviewer

Kontributor kelas

Curriculum Developer yang membangun kelas ini:

Dimas Maulana Dwi Saputra

Curriculum Developer at Dicoding Indonesia

Ash Shiddiqul Akbar Hidayat

Dicoding CTO

Nur Rizki Adi Prasetyo

Curriculum Developer at Dicoding Indonesia

Tim Reviewer

Code Reviewer yang akan me-review tugas dan kode Anda:

Moch Ridwan Taufik Alamsyah

R&D Engineer at csacomputer.com, External Code Reviewer at Dicoding Indonesia

"What We Learn When We Learn By Doing?"

Full Stack Development Enthusiast
Mobile Development Enthusiast
Machine Learning Enthusiast

Catur dari Dicoding

Code Reviewer at Dicoding Indonesia

Associate Android Developer

Luthfi Alfarisi

External Code Reviewer at Dicoding Indonesia

Associate Android Developer
Android & Web Enthusiast

Inggih Wicaksono

Web Developer at Erasys Consulting

- Fullstack man but currently focus on React.js

- Hacktoberfest fans @igihcksn

Agista Septiyanto

Code Reviewer at Dicoding Indonesia

Associate Android Developer

Alfian Yusuf Abdullah

Head of Reviewer at Dicoding Indonesia

Associate Android Developer
Kotlin Enthusiast
UI/UX Enthusiast

Dimas Maulana Dwi Saputra

Curriculum Developer at Dicoding Indonesia

Mobile and Web Enthusiast
Node.js Developer Certified
AWS Certified Cloud Practitioner
React Developer
Associate Android Developer

Gunawan Wahyu Andreanto

Full Stack Developer

meh

Alexzander Purwoko Widiantoro

Code Reviewer at Dicoding Indonesia

Associate Android Developer
Android, Web & IoT Enthusiast

Nosef Nunggaran

External Code Reviewer at Dicoding Indonesia

AWS Certified Solutions Architect

Ananda Dwi Prayoga

Android Engineer at Vidio.com

Android Dev
Web Dev

Shaddam Amru Hasibuan

Front-end Engineer at Smeshub

React Front-end Engineer
Linux Enthusiast

Muhammad Ilham Adhim

Front-End Web Developer

Muhammad Rifki Erlangga

External Code Reviewer at Dicoding Indonesia

Front-end Web Developer

Rian Mandala Putra

External Code Reviewer at Dicoding Indonesia

Mobile and Web Enthusiast

Tatang Kuswandi

External Code Reviewer at Dicoding Indonesia

Mobile and Web Enthusiast

Samodra

External Code Reviewer at Dicoding Indonesia

Software Engineer

Muhammad Amru Salim

External Code Reviewer at Dicoding Indonesia

Mobile and Web Enthusiast

Yusril Adriansyah Putra

External Code Reviewer at Dicoding Indonesia

Front-End Web Developer
Back-End Web Developer
Javascript Enthusiast

Yudistira Arya Mutamang

External Code Reviewer at Dicoding Indonesia

Front-End Web Developer
Cyber Security Enthusiast

Ilham Shiddiq

External Code Reviewer at Dicoding Indonesia. Backend Developer at a company in Bandung.

Back-End Web Developer
Web Developing Enthusiast

Muhammad Alvino Dienova

External Reviewer at Dicoding Indonesia

Front-End Web Developer

Eko Rahayu Widodo

Front-End Web Developer | React Developer

- Front-end web developer concentrating on developing an attractive website appearance using an Eye-catching and Beautifully crafted concept with React as the core stack.

- Machine Learning and Mobile Apps Enthusiasts.

Marcello Sebastian

External Code Reviewer at Dicoding Indonesia

Front-end Development Enthusiast

Sofyan Egi Lesmana

External Code Reviewer at Dicoding Indonesia

SIB Graduate Batch 2 - Front-End & Back-End Web
Certified by Dicoding Indonesia

You can reach out me on my Linkedin.

Refiandi Reza Syawaldriyansah

External Reviewer Dicoding

Front-End & Javascript Enthusiast

Fazza Razaq Amiarso

Web Developer & Open Source Maintainer

I'm a self-taught web developer focusing on making everyone can inclusively use the web. Currently transitioning from React to Svelte. Interested on learning Interactive Story Telling with Data Visualization.

Personal Website: https://fazzaamiarso.me

Github: https://github.com/fazzaamiarso

Fauzi Kurniawan

External Code Reviewer at Dicoding Indonesia

Javascript enthusiast

Rosyiidah Hasnaa

Front End Enthusiast, Undergraduate at Politeknik Elektronika Negeri Surabaya

Final Year Student of Informatics Engineering at Politeknik Elektronika Negeri Surabaya. I have experience building a website using html, css, bootstrap, and javascript and making a responsive website. I enjoy learning about front-end developers in my free time. An eager and conscientious person who works well in team environments. I'm looking for opportunities in front-end web development.

Let's connect with me on linkedin.com/in/syiidahasnaa

Irenius Brayen Luhat

Self-employed

Seorang pembelajar dan pengembang web. Saya adalah seorang antusias Javascript, saya mendedikasikan banyak waktu belajar saya di sini. Kenali lebih jauh dengan mengunjung website profil saya.

Moch Ridwan Taufik Alamsyah

R&D Engineer at csacomputer.com, External Code Reviewer at Dicoding Indonesia

"What We Learn When We Learn By Doing?"

Full Stack Development Enthusiast
Mobile Development Enthusiast
Machine Learning Enthusiast

Catur dari Dicoding

Code Reviewer at Dicoding Indonesia

Associate Android Developer

Luthfi Alfarisi

External Code Reviewer at Dicoding Indonesia

Associate Android Developer
Android & Web Enthusiast

Inggih Wicaksono

Web Developer at Erasys Consulting

- Fullstack man but currently focus on React.js

- Hacktoberfest fans @igihcksn

Agista Septiyanto

Code Reviewer at Dicoding Indonesia

Associate Android Developer

Alfian Yusuf Abdullah

Head of Reviewer at Dicoding Indonesia

Associate Android Developer
Kotlin Enthusiast
UI/UX Enthusiast

Dimas Maulana Dwi Saputra

Curriculum Developer at Dicoding Indonesia

Mobile and Web Enthusiast
Node.js Developer Certified
AWS Certified Cloud Practitioner
React Developer
Associate Android Developer

Gunawan Wahyu Andreanto

Full Stack Developer

meh

Alexzander Purwoko Widiantoro

Code Reviewer at Dicoding Indonesia

Associate Android Developer
Android, Web & IoT Enthusiast

Nosef Nunggaran

External Code Reviewer at Dicoding Indonesia

AWS Certified Solutions Architect

Ananda Dwi Prayoga

Android Engineer at Vidio.com

Android Dev
Web Dev

Shaddam Amru Hasibuan

Front-end Engineer at Smeshub

React Front-end Engineer
Linux Enthusiast

Muhammad Ilham Adhim

Front-End Web Developer

Muhammad Rifki Erlangga

External Code Reviewer at Dicoding Indonesia

Front-end Web Developer

Rian Mandala Putra

External Code Reviewer at Dicoding Indonesia

Mobile and Web Enthusiast

Tatang Kuswandi

External Code Reviewer at Dicoding Indonesia

Mobile and Web Enthusiast

Samodra

External Code Reviewer at Dicoding Indonesia

Software Engineer

Muhammad Amru Salim

External Code Reviewer at Dicoding Indonesia

Mobile and Web Enthusiast

Yusril Adriansyah Putra

External Code Reviewer at Dicoding Indonesia

Front-End Web Developer
Back-End Web Developer
Javascript Enthusiast

Yudistira Arya Mutamang

External Code Reviewer at Dicoding Indonesia

Front-End Web Developer
Cyber Security Enthusiast

Ilham Shiddiq

External Code Reviewer at Dicoding Indonesia. Backend Developer at a company in Bandung.

Back-End Web Developer
Web Developing Enthusiast

Muhammad Alvino Dienova

External Reviewer at Dicoding Indonesia

Front-End Web Developer

Eko Rahayu Widodo

Front-End Web Developer | React Developer

- Front-end web developer concentrating on developing an attractive website appearance using an Eye-catching and Beautifully crafted concept with React as the core stack.

- Machine Learning and Mobile Apps Enthusiasts.

Marcello Sebastian

External Code Reviewer at Dicoding Indonesia

Front-end Development Enthusiast

Sofyan Egi Lesmana

External Code Reviewer at Dicoding Indonesia

SIB Graduate Batch 2 - Front-End & Back-End Web
Certified by Dicoding Indonesia

You can reach out me on my Linkedin.

Refiandi Reza Syawaldriyansah

External Reviewer Dicoding

Front-End & Javascript Enthusiast

Fazza Razaq Amiarso

Web Developer & Open Source Maintainer

Personal Website: https://fazzaamiarso.me

Github: https://github.com/fazzaamiarso

Fauzi Kurniawan

External Code Reviewer at Dicoding Indonesia

Javascript enthusiast

Rosyiidah Hasnaa

Front End Enthusiast, Undergraduate at Politeknik Elektronika Negeri Surabaya

Irenius Brayen Luhat

Self-employed

Seorang pembelajar dan pengembang web. Saya adalah seorang antusias Javascript, saya mendedikasikan banyak waktu belajar saya di sini. Kenali lebih jauh dengan mengunjung website profil saya.

Testimoni Siswa

Ribuan siswa sukses belajar di Dicoding Academy. Apa kata mereka? Berikut adalah testimoni asli mereka.

Geraldo Sepdwijaya

PT. Maybank Indonesia

Menjadi Front-End Web Developer Expert

Kelas ini sangat lengkap dan mudah dipahami, reviewer selalu memberikan saran agar dapat menuliskan kode dengan baik saat mengerjakan submission, kelas ini sangat cocok untuk yang ingin memperdalam skill Front End Web Development. Sangat direkomendasikan, terima kasih Dicoding!

Baca selengkapnya

Ahmad Mishbahul Munir

PT. Sentra Vidya Utama

Menjadi Front-End Web Developer Expert

Melalui kelas Menjadi Front-End Web Developer Expert saya belajar bagaimana membuat front-end web mulai dari mempersiapkan konsep dasar hingga menjadikannya PWA, melakukan testing, dan meningkatkan performa web. Terima kasih Dicoding, menurut saya materinya sangat bagus dan menarik.

Baca selengkapnya

Lihat semua testimoni

Testimoni Siswa

Geraldo Sepdwijaya

PT. Maybank Indonesia

Menjadi Front-End Web Developer Expert

Kelas ini materinya sangat lengkap dan mudah dipahami, reviewernya juga selalu memberikan saran agar dapat menuliskan kode dengan baik saat mengerjakan submission, kelas ini sangat cocok untuk yang ingin memperdalam skill dibidang Front End Web Development, sangat direkomendasikan, Terima kasih Dicoding!

Ahmad Mishbahul Munir

PT. Sentra Vidya Utama

Menjadi Front-End Web Developer Expert

Melalui kelas Menjadi Front-End Web Developer Expert saya belajar bagaimana membuat front-end web mulai dari mempersiapkan konsep dasar hingga menjadikannya PWA, melakukan testing dan belajar meningkatkan performa web. Terima kasih Dicoding, menurut saya materinya sangat bagus dan menarik.

Irwanto Siregar

Self Employee

Menjadi Front-End Web Developer Expert

Terjun ke dunia Web Development saya pertama kali belajar PHP/Back-End. Memperoleh kesempatan beasiswa IDCamp rasanya sangat senang dan bangga. Berkat kelas Front-End disini saya jadi memahami apa itu Mobile First Approach, Testing-debugging, Web Performance dan masih banyak lainnya dimana itu saling melengkapi untuk dapat membangun web profesional melalui teknologi yang ada saat ini. Terimakasih IDCamp 2020 X Dicoding Indonesia. Developer Handal Untuk Indonesia Digital.

Lukman Bahar Agung Pambudi

Alodokter

Menjadi Front-End Web Developer Expert

Kelas ini menggiring pola pikir kita menjadi seorang expert, materi kelasnya padat. setelah lulus, bisa membuat karya web dengan performance, accessibility, best practice dan PWA dengan audit score maksimal. merupakan bekal terbaik untuk persaingan pada trend jaman ini.

Punya pertanyaan seputar kelas ini?

Berikut adalah beberapa pertanyaan yang paling sering ditanyakan.

Bagaimana cara memasukkan token Academy? Aturan membuat pertanyaan di forum diskusi kelas Bagaimana cara mencetak sertifikat kelulusan kelas?

Lihat semua FAQ

Silabus

Materi yang akan Anda pelajari pada kelas ini.

Persiapan Belajar

Memahami HAKI, mekanisme belajar, forum diskusi, glosarium, dan daftar referensi.

7 Artikel

65 menit

Persetujuan Hak Cipta
1 Menit
Prasyarat Kelas
10 Menit
Prasyarat Tools
29 Menit
Mekanisme Belajar
10 Menit
Forum Diskusi

5 Menit
Glosarium

5 Menit
Daftar Referensi

5 Menit

Pengenalan Kelas

Menjelaskan tentang pentingnya membuat website yang optimal untuk diakses oleh berbagai perangkat, khususnya smartphone yang mendominasi pengguna internet.

2 Artikel

20 menit

Pengenalan Kelas Menjadi Front-End Web Developer Expert

10 Menit
Materi Menjadi Front-End Web Developer Expert

10 Menit

Mobile First Approach

Memahami pendekatan mobile-first, serta belajar membangun website yang responsif menggunakan CSS Grid System, Media Query, dan Off Screen Canvas melalui pendekatan Mobile First.

17 Artikel

450 menit

Pengenalan Mobile First Approach

10 Menit
Persiapan Proyek Latihan

25 Menit
Chrome DevTools

20 Menit
Mengatur Viewport, Penggunaan Relative Unit, Ukuran Elemen.

30 Menit
Latihan: Mengatur Viewport, Penggunaan Relative Unit, Ukuran Elemen

40 Menit
Responsive Layout

25 Menit
Media Query

25 Menit
Breakpoint

20 Menit
Grid Layout Module

25 Menit
Grid Tracks

25 Menit
Fraction Unit dan Repeat Notation

30 Menit
Grid Lines

25 Menit
Gutters

15 Menit
Latihan: Menerapkan Responsive Layout

40 Menit
Optimalisasi Teks

15 Menit
Off Canvas Menu

40 Menit
Latihan: Menerapkan Teks Optimisasi dan Off Canvas Menu

40 Menit

Aksesibilitas

Belajar aspek aksesibilitas web seperti focus, semantic HTML, tab order, label, alternative teks, serta penggunaan screen reader agar website yang dikembangkan dapat diakses oleh siapa pun.

15 Artikel
1 Submission
2 Ujian

790 menit

Pengenalan Aksesibilitas

20 Menit
Aksesibilitas Keyboard

20 Menit
Mencoba Focus

20 Menit
Kuis: Mencoba Focus

10 Menit
Focusable Element

20 Menit
Focus Order

20 Menit
Tab Index

20 Menit
Styling Focus

10 Menit
Aksesibilitas Konten

20 Menit
Affordances dan Semantics

15 Menit
Screen Reader

30 Menit
Mencoba Screen Reader

20 Menit
Kuis: Mencoba Screen Reader

10 Menit
Skip to Content

20 Menit
Heading dan Landmarks

20 Menit
Label

15 Menit
Teks Alternatif

20 Menit
Submission: Katalog Restoran

480 Menit

JavaScript Clean Code

Belajar prinsip-prinsip penulisan kode JavaScript dengan benar berdasarkan senior software engineer Robert C. Martin yang diadopsi dari bukunya berjudul Clean Code.

19 Artikel

360 menit

Pengenalan JavaScript Clean Code

15 Menit
Style Guide

20 Menit
Code Conventions

25 Menit
ESLint

10 Menit
Menggunakan ESLint

25 Menit
Memasang ESLint

20 Menit
Mengaudit Kode

15 Menit
Integrasi Editor/IDE

20 Menit
Clean Code

10 Menit
Prinsip Membuat Variables

25 Menit
Membuat Function dengan Baik

20 Menit
Implementasi Function yang Dihindari

20 Menit
Objek dan Struktur Data

20 Menit
Classes

25 Menit
SOLID: Single Responsibility Principle, Open/Closed Principle

20 Menit
SOLID: Liskov Substitution Principle, Interface Segregation Principle, Dependencies Inversion Principle

25 Menit
Concurrency

20 Menit
Error Handling

10 Menit
Comments

15 Menit

Progressive Web Apps

Belajar membuat website yang progressive sehingga website memiliki sifat native seperti installable, offline capability, dan lainnya.

53 Artikel
1 Submission

1815 menit

Pengantar Progressive Web Apps

10 Menit
Mengenal Progressive Web Apps (PWAs)

15 Menit
Kelebihan dan Kekurangan PWA(s)

15 Menit
Komponen Pembentuk PWA(s)

20 Menit
Web Architecture

15 Menit
Application Shell

10 Menit
Latihan: Application Shell

30 Menit
Memasang Dependencies

30 Menit
Menetapkan Code Style

20 Menit
Membuat Struktur Folder

25 Menit
Konfigurasi Webpack

35 Menit
Membuat Application Shell

40 Menit
Konfigurasi Drawer

40 Menit
Membuat URL Router Sederhana

40 Menit
Melakukan Request dari API

25 Menit
Menampilkan Konten dari API

40 Menit
Web App Manifest

20 Menit
Latihan: Web App Manifest

40 Menit
Service Worker

15 Menit
Apa yang Bisa Dilakukan Service Worker?

15 Menit
Registration

15 Menit
Siklus Hidup Service Worker

25 Menit
Event pada Service Worker

20 Menit
Latihan: Service Worker

35 Menit
Cache API

15 Menit
Dasar Penggunaan Cache API

10 Menit
Menambahkan Resource ke Cache

10 Menit
Mencari dan Menghapus Cache

10 Menit
Caching Strategies

20 Menit
Latihan: Cache API

25 Menit
Menerapkan Cache pada Service Worker

30 Menit
Workbox

25 Menit
Latihan Implementasi Service Worker dengan Workbox

35 Menit
IndexedDB

15 Menit
Dasar Penggunaan IndexedDB

10 Menit
Membuat/Membuka Database dan Object Store

15 Menit
Operasi CRUD pada IndexedDB

15 Menit
Latihan: IndexedDB

10 Menit
Menyiapkan Fungsi Operations DB

20 Menit
Menambahkan Tombol Like pada Halaman Detail

25 Menit
Memberikan Fungsionalitas pada Tombol Like

35 Menit
Menampilkan Data dari Database

20 Menit
WebSocket

10 Menit
Membuka Koneksi WebSocket

10 Menit
Mengirim Data ke WebSocket Server

10 Menit
Mendapatkan Data dari WebSocket Server

10 Menit
Menutup Koneksi WebSocket

10 Menit
Latihan: Web Socket

25 Menit
Notifikasi

15 Menit
Latihan: Notifikasi

25 Menit
Web Push Notification

40 Menit
Latihan Refactor: Implementasi Workbox di Movie Catalogue dengan InjectManifest

40 Menit
Latihan: Push Notification

80 Menit
Submission: Katalog Restoran + PWA

600 Menit

Automation Testing

Belajar penerapan testing seperti Unit Test, Integration Test, dan End to End Test pada website yang dibuat, serta belajar menggunakan DevTools untuk debugging.

38 Artikel

985 menit

Pengenalan Testing Automatis

10 Menit
Kasus 1: Segitiga Apa Aku

20 Menit
Test Drive Development (TDD) Menggunakan Jasmine

25 Menit
Hijau Pertama

30 Menit
Segitiga Sama Sisi

20 Menit
Segitiga Sama Kaki

35 Menit
Plot Twist

25 Menit
Ringkasan Segitiga Apa Aku

10 Menit
Kasus 2: Testing Aplikasi

10 Menit
Menyukai Sebuah Film

15 Menit
Kutangkap Bugs Dengan Jaring Pengaman

60 Menit
Ketika Pikiranku Berubah

35 Menit
TODO Harus Dikerjakan

25 Menit
Jagalah Kebersihan

35 Menit
Ringkasan Testing Aplikasi

10 Menit
Kasus 3: Berkolaborasi Dengan Benar

10 Menit
Yang Mengikat Kita

20 Menit
Aku Bergantung Pada Bayanganmu

20 Menit
Ringkasan Berkolaborasi Dengan Benar

10 Menit
Kasus 4: Mencari Film Yang Disukai

10 Menit
Membangun Fitur Menggunakan TDD

60 Menit
Jangan Bertele-tele

45 Menit
Rahasia Seorang Mata-Mata

35 Menit
Aku Suka Apa Yang Aku Lihat

45 Menit
Ketika Hampa

15 Menit
Yang Kucari Akhirnya Tiba

20 Menit
Tak Semuanya Perlu Diketahui

30 Menit
Kau Tak Perlu Tahu Rahasiaku

35 Menit
Plot Twist

65 Menit
Memperbaiki dia yang terlupakan

45 Menit
Ringkasan Mencari Film yang Disukai

10 Menit
Kasus 5: End-to-End Testing

10 Menit
Kenalkan, saya Codecept

35 Menit
Membekukan waktu

25 Menit
Jangan Sampai Salah Nama

20 Menit
Sebuah Pencarian

30 Menit
Ringkasan Testing Automatis

15 Menit
Saran dalam Penerapan TDD

10 Menit

Web Performance

Belajar menggunakan web auditor untuk mengetahui sejauh mana performa website yang dibuat, dan mengoptimalkan performa website berdasarkan hasil yang diperoleh.

24 Artikel

475 menit

Pengenalan Web Performance

10 Menit
Mengapa Kecepatan Penting

10 Menit
Apa itu Kecepatan

20 Menit
Web Vitals

10 Menit
Largest Contentful Paint

15 Menit
First Input Delay

15 Menit
Cumulative Layout Shift

15 Menit
Cara Mengukur LCP, FID, dan CLS

20 Menit
Image Optimization

10 Menit
Kompresi Gambar

15 Menit
Latihan: Kompresi Gambar

30 Menit
Ubah GIF ke Video

20 Menit
Latihan: Ubah Gif ke Video

40 Menit
Image Responsive

15 Menit
Latihan: Image Responsive

35 Menit
WebP Image

15 Menit
Latihan: WebP Image

30 Menit
Menggunakan Lazy Loading Image

15 Menit
Practice: Lazy Loading Image

30 Menit
Optimisasi Bundle

15 Menit
Bundle Analyzer

10 Menit
Latihan: Bundle Analyzer

25 Menit
Code Splitting

20 Menit
Latihan: Code Splitting

35 Menit

Deployment dengan CI/CD

Belajar mendeploy aplikasi ke production secara otomatis, aman, dan cepat menggunakan teknik Continuous Integration dan Continuous Deployment.

11 Artikel

380 menit

Pendahuluan Continuous Integration & Continuous Deployment

10 Menit
Pengelolaan Source Code

30 Menit
Pengertian dan Manfaat CI/CD

30 Menit
Platform untuk CI/CD

30 Menit
Pengantar Latihan: Penerapan CI/CD Menggunakan GitHub Action dan Netlify

10 Menit
Latihan: Memasang Git

30 Menit
Latihan: Membuat Akun GitHub

40 Menit
Latihan: Membuat Remote Repository di GitHub

30 Menit
Latihan: Membuat CI Pipeline menggunakan GitHub Action

80 Menit
Latihan: Membuat Akun Netlify

20 Menit
Latihan: Membuat CD Pipeline menggunakan Netlify

70 Menit