Menjadi React Web Developer Expert

4.67 •

React

Learning Path

Menjadi React Web Developer Expert

Teknologi:

Web

Level: Mahir

Level: Mahir 70 Jam Belajar

195

Siswa Terdaftar

Pelajari kaidah penulisan kode, state management dengan Redux, testing, hingga deployment dengan CI/CD pada pengembangan aplikasi React-mu.

Belajar Sekarang

Informasi kelas Lihat silabus

Learning Path React Developer

Kelas ini merupakan langkah ke-enam Anda untuk menjadi React Developer.

Langkah sebelumnya

Langkah 5

Belajar Fundamental Aplikasi Web dengan React

55 Jam 4,93 Level Menengah

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.

Kode Interaktif

Modul belajar dalam bentuk video, disertai dengan latihan untuk menguji pemahaman.

Kuis

Kuis pilihan ganda membantu Anda memahami materi yang dipelajari.

Ujian

Validasi pengetahuan Anda dengan mengerjakan soal-soal ujian.

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

Deskripsi

React merupakan UI Library paling populer yang digunakan industri dalam membangun aplikasi web. Tantangan terbesar dalam membangun aplikasi React adalah memastikan aplikasi yang dibangun mudah dikelola, minim bugs, dan teruji. Untuk itu, React developer harus mampu menulis kode yang baik sesuai kaidah, mengelola state dengan baik agar perubahannya lebih terprediksi, dan memastikan aplikasi yang dibuat sudah diuji secara otomatis sebelum menyentuh tahap rilis.

State adalah hal yang paling krusial di React, sehingga React developer perlu mengetahui cara mengelola state dengan baik.
Redux merupakan tools yang banyak digunakan industri dalam mengelola state UI. Dengan menguasai Redux, developer bisa memperluas kesempatan untuk berkarier.
Pengujian aplikasi yang dilakukan secara manual tidak selamanya efektif. Developer harus belajar cara menguji aplikasi secara otomatis agar bisa mengetahui penyebab error secara cepat dan hemat waktu.
Proses deployment aplikasi yang dilakukan secara manual rentan terjadi kesalahan. Selain itu, aplikasi sering kali tidak diuji sebelum berjalan ditahap production. Sebagai React Developer, kita harus tahu cara deployment aplikasi yang efisien, aman, dan cepat dengan menggunakan teknik CI/CD.
Tingginya kebutuhan industri terhadap talenta digital yang paham dengan React.

Target dan Sasaran Siswa

Kelas ini ditujukan untuk React Developer yang ingin meningkatkan kemampuannya dalam penulisan kode yang baik, pengelolaan state dengan Redux, pengujian aplikasi secara otomatis, dan teknik deployment yang efisien, aman, dan cepat.
Kelas ini dapat diikuti oleh siswa yang sudah familier dengan fundamental pengembangan aplikasi React seperti React element, React component, React Context, React Hooks, dan React Router.
Siswa diharapkan sudah mampu mengembangkan aplikasi web di sisi Front-End, menguasai HTML, CSS, dan JavaScript serta sudah familier dengan sintaksis ES6.
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 React dengan kode yang baik, pengelolaan state menggunakan Redux, diuji dan dideploy secara otomatis.

Selengkapnya

Sembunyikan

Learning Path

Kelas ini merupakan langkah ke-enam Anda untuk menjadi React Developer.

Langkah sebelumnya

Langkah 5

Belajar Fundamental Aplikasi Web dengan React

55 Jam 4,93 Level Menengah

Peralatan Belajar

Spesifikasi minimal perangkat:

Prosesor

Intel Dual Core (Rekomendasi Core i3 ke atas)

Tools yang dibutuhkan untuk belajar:

Node.js versi LTS terbaru

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:

Node.js versi LTS terbaru

Command Line (Terminal atau cmd)

Web Browser (Google Chrome atau Mozilla Firefox)

Teks Editor (VSCode)

Metode Ajar

Online - Self-paced Learning
- Total jam belajar : 70 jam
- Rekomendasi waktu belajar : 10 jam per minggu (selesai dalam 49 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 :
  - Ujian Akhir Kelas
  - Submission (Proyek Akhir) berupa membangun aplikasi React dengan kode yang baik, pengelolaan state menggunakan Redux, diuji dan di-deploy secara otomatis.
- Sertifikat kompetensi

Lihat semua metode ajar

Metode Ajar

Online - Self-paced Learning
- Total jam belajar : 70 jam
- Rekomendasi waktu belajar : 10 jam per minggu (selesai dalam 49 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 :
  - Ujian Akhir Kelas
  - Submission (Proyek Akhir) berupa membangun aplikasi React dengan kode yang baik, pengelolaan state menggunakan Redux, diuji dan di-deploy secara otomatis.
- Sertifikat kompetensi

Kontributor

Curriculum Developer yang membangun kelas ini:

Dimas Maulana Dwi Saputra

Curriculum Developer at Dicoding Indonesia

Reviewer

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

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
Associate Android Developer
React Developer
AWS Certified Cloud Practitioner

Alexzander Purwoko Widiantoro

Code Reviewer at Dicoding Indonesia

Associate Android Developer
Microsoft Certified: Azure Fundamental
Android, Web & IoT Enthusiast

Rizqy Hidayat

Product Engineer, Dicoding Indonesia

Lihat semua kontributor dan reviewer

Kontributor & Reviewer

Kontributor kelas

Curriculum Developer yang membangun kelas ini:

Dimas Maulana Dwi Saputra

Curriculum Developer at Dicoding Indonesia

Tim Reviewer

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

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
Associate Android Developer
React Developer
AWS Certified Cloud Practitioner

Alexzander Purwoko Widiantoro

Code Reviewer at Dicoding Indonesia

Associate Android Developer
Microsoft Certified: Azure Fundamental
Android, Web & IoT Enthusiast

Rizqy Hidayat

Product Engineer, Dicoding Indonesia

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
Associate Android Developer
React Developer
AWS Certified Cloud Practitioner

Alexzander Purwoko Widiantoro

Code Reviewer at Dicoding Indonesia

Associate Android Developer
Microsoft Certified: Azure Fundamental
Android, Web & IoT Enthusiast

Rizqy Hidayat

Product Engineer, Dicoding Indonesia

Testimoni Siswa

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

Danar Dono

Institut Sains dan Teknologi Terpadu Surabaya

Memulai Dasar Pemrograman untuk Menjadi Pengembang Software

Di kelas ini, akan diajarkan bagaimana konsep dasar pemograman. Saya sendiri merasa (seperti mengulas) kembali belajar mata kuliah algoritma 1, namun materinya disampaikan secara interaktif dan menyeyangkan sehingga relatif lebih cepat paham. Terima kasih Dicoding.

Baca selengkapnya

Muhammad Rafli

Universitas Padjadjaran

Memulai Dasar Pemrograman untuk Menjadi Pengembang Software

Kelas ini benar-benar memberikan pemahaman yang baik tentang pemrograman. Dengan bahasa yang menarik, mudah dipahami, dan sedikit humor, saya selaku orang non-IT dapat memahami kelas ini dengan baik. Terima kasih Dicoding.

Baca selengkapnya

Lihat semua testimoni

Testimoni Siswa

Danar Dono

Institut Sains dan Teknologi Terpadu Surabaya

Memulai Dasar Pemrograman untuk Menjadi Pengembang Software

Di kelas ini, Anda akan diajarkan bagaimana konsep dasar pemograman. Saya sendiri merasa (seperti mengulas) kembali belajar mata kuliah algoritma 1, namun materinya disampaikan secara interaktif dan menyeyangkan sehingga relatif lebih cepat paham. Terima kasih dicoding atas materi pembelajarannya. Salam.

Muhammad Rafli

Universitas Padjadjaran

Memulai Dasar Pemrograman untuk Menjadi Pengembang Software

Thifal Nurrifqi Ariel Kurniawan

Universitas Pendidikan Indonesia

Memulai Dasar Pemrograman untuk Menjadi Pengembang Software

Kelas ini sangat informatif dan bermanfaat bagi siapapun yang hendak memulai langkah di dunia pemrograman. Hal ini dikarenakan media dan pendekatan yang digunakan menjadikan saya mudah memahami tentang pemrograman dari 0 dan tidak buta arah untuk menentukan langkah selanjutnya.

Timotius Haniel

Institut Teknologi Harapan Bangsa

Memulai Dasar Pemrograman untuk Menjadi Pengembang Software

Melalui kelas Basic Programming 101, Saya menyadari bahwa betapa pentingnya basic yang kuat bagi seorang developer. Melalui basic yang kuat, seorang programmer dapat lebih mudah mengembangkan setiap software yang akan dibangun. "Bangunan yang tinggi dan besar, pasti memiliki pondasi yang kokoh"

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.

8 Artikel

80 menit

Linter dan Clean Code

Belajar menggunakan linter dalam menulis kode dengan gaya yang konsisten. Serta belajar kaidah penulisan yang baik berdasarkan buku Clean Code yang diadaptasi ke JavaScript dan React.

14 Artikel
1 Ujian

290 menit

Pengantar Linter dan Clean Code

5 Menit
Style Guide

15 Menit
JavaScript Linter

5 Menit
Latihan: Menggunakan ESLint pada React Project

45 Menit
Clean Code

5 Menit
Prinsip Membuat Variabel

20 Menit
Prinsip Membuat Fungsi

35 Menit
Prinsip Menangani Proses Asynchronous

15 Menit
Prinsip Penanganan Error

10 Menit
Prinsip Memberikan Komentar

10 Menit
React Clean Code

25 Menit
React Strict Mode

35 Menit
Latihan: Menggunakan React Strict Mode

45 Menit
Rangkuman Linter dan Clean Code

15 Menit
Kuis Linter dan Clean Code

5 Menit

State Management dengan Redux

Belajar mengelola state aplikasi dengan Redux agar perubahan state lebih terprediksi dan minim akan bugs.

28 Artikel
1 Ujian
4 Kode Interaktif

745 menit

Pendahuluan State Management dengan Redux

5 Menit
State Container (Store)

15 Menit
Latihan: Membuat Store

30 Menit
Action

15 Menit
Kuis Koding: Action Creator

20 Menit
Reducer Function

30 Menit
Kuis Koding: Pure Function

20 Menit
Latihan: Membuat Action, Reducer Function, dan fungsi Dispatch pada Store

45 Menit
Kuis Koding: Reducer Function

30 Menit
Latihan: Mengombinasi Reducer

20 Menit
Kuis Koding: Root Reducer

15 Menit
Latihan: Redux Library

10 Menit
React Redux

15 Menit
Latihan: Menggunakan Redux Store di React

45 Menit
Redux Middleware

20 Menit
Latihan: Membuat dan Menggunakan Redux Middleware

30 Menit
Asynchronous Action

25 Menit
Latihan: Asynchronous Action

45 Menit
Third Party Middleware

10 Menit
Redux Best Practices

20 Menit
Real World Project: Implementasi Redux pada Aplikasi Sosial Media Open Space (Twitter Like App)

10 Menit
Menyiapkan, Menjalankan, dan Menganalisis Proyek Starter

35 Menit
Membuat Action dan Reducer untuk State authUser

25 Menit
Membuat Action dan Reducer untuk State isPreload

25 Menit
Membuat Action dan Reducer untuk State users

25 Menit
Membuat Action dan Reducer untuk State talks

25 Menit
Membuat Action dan Reducer untuk State talkDetail

25 Menit
Membuat Shared Action

15 Menit
Membuat Redux Store

15 Menit
Menggunakan Redux Store pada React Component

30 Menit
Menerapkan Loading Bar

25 Menit
Rangkuman State Management dengan Redux

20 Menit
Kuis State Management dengan Redux

5 Menit

Submission: Membangun Aplikasi React dengan Redux

Menguji pemahaman peserta akan materi State Management dengan membuat aplikasi React yang memanfaatkan Redux.

1 Submission

1200 menit

Proyek: Membangun Aplikasi React dengan Redux

1200 Menit

Automation Testing

Belajar cara menguji aplikasi React secara otomatis mulai dari tingkatan Unit Test hingga End-to-End Test.

16 Artikel
1 Ujian

415 menit

Pengantar Automation Testing

5 Menit
Pentingnya Pengujian pada Pengembangan Aplikasi

10 Menit
Mengenal Automation Testing

5 Menit
Automation Testing di JavaScript

15 Menit
Framework Testing untuk JavaScript

20 Menit
Mengenal Kultur Test Driven Development

15 Menit
Latihan: Mencoba Unit Testing dengan Kultur TDD

45 Menit
Latihan: Menerapkan Unit Testing untuk Menguji Fungsi Reducer

45 Menit
Test Double

25 Menit
Latihan: Test Double untuk Menguji Thunk Function

45 Menit
React Testing Library

30 Menit
Latihan: Menguji Komponen React

45 Menit
End-to-End Test dengan Cypress

15 Menit
Latihan: Memasang dan Mengonfigurasi Cypress

35 Menit
Latihan: E2E Test pada Proses Login Aplikasi

45 Menit
Rangkuman Automation Testing

10 Menit
Kuis Automation Testing

5 Menit

Deployment dengan CI/CD

Belajar cara deployment aplikasi React yang efektif, aman, dan cepat dengan teknik CI/CD.

16 Artikel
1 Ujian

265 menit

Pengantar Deployment dengan CI/CD

5 Menit
Cara Developer Mengelola Kode

10 Menit
Pengertian CI/CD

10 Menit
Platform CI/CD untuk Aplikasi React

5 Menit
Alur CI/CD

10 Menit
Persiapan Latihan Deployment dengan CI/CD

10 Menit
Latihan: Memasang Git pada Komputer

25 Menit
Latihan: Membuat Local Repository

15 Menit
Latihan: Membuat Akun GitHub

10 Menit
Latihan: Menghubungkan Akun GitHub di Lokal Git dengan GitHub CLI

15 Menit
Latihan: Membuat Remote Repository dan Mengunggah Source Code ke GitHub

15 Menit
Latihan: Membuat CI Menggunakan GitHub Action

35 Menit
Latihan: Membuat CD dengan Vercel

35 Menit
Latihan: Menguji Deployment dengan CI/CD

35 Menit
Latihan: Memasang Proteksi pada Branch Master

15 Menit
Rangkuman Deployment dengan CI/CD

10 Menit
Kuis Deployment dengan CI/CD

5 Menit

React Useful Ecosystem

Mencoba Next.js, Storybooks, dan Styled Component sebagai bagian dari ekosistem React yang bermanfaat dan populer.

8 Artikel
1 Ujian

210 menit

Pengantar React Useful Ecosystem

5 Menit
Static React Site dengan Next.js

15 Menit
Latihan: Membuat Proyek Next.js

45 Menit
CSS-in-JS dengan Styled Component

20 Menit
Latihan: Membuat Styled Component

45 Menit
Isolasi Komponen dengan Storybook

20 Menit
Latihan: Membuat Lingkungan yang Aman untuk Bereksperimen pada Komponen dengan Storybook

45 Menit
Rangkuman React useful Ecosystem

10 Menit
Kuis React Useful Ecosystem

5 Menit