Menjadi React Web Developer Expert

4.92 •

React

Learning Path

Menjadi React Web Developer Expert

Teknologi:

Web

Level: Mahir

Level: Mahir 70 Jam Belajar

771

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,92 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,92 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:

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

Putu Jhonarendra

Programmer

Seorang Programmer dari Bali, Indonesia yang memiliki pengalaman lebih dari 3 tahun mengembangkan aplikasi web. Aplikasi yang dibuat telah dipakai di lembaga pendidikan dan instansi pemerintah.

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

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:

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

Putu Jhonarendra

Programmer

Seorang Programmer dari Bali, Indonesia yang memiliki pengalaman lebih dari 3 tahun mengembangkan aplikasi web. Aplikasi yang dibuat telah dipakai di lembaga pendidikan dan instansi pemerintah.

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

Alexzander Purwoko Widiantoro

Code Reviewer at Dicoding Indonesia

Associate Android Developer
Android, Web & IoT Enthusiast

Abdul Malik

Junior Frontend Developer

Let's get in touch with me:

Linkedin - GitHub - Facebook

Ivan Andrianto

External Reviewer at Dicoding Indonesia

Google Data Analytics Professional Certificate
UI/UX Enthusiast
Machine Learning Enthusiast
Mobile & Web Enthusiast

Hasan Ismail Abdulmalik

Software Engineering Student at College of Vocational Studies IPB University

I am a web developer who is interested in both backend and frontend development. I have been teaching myself web development and am familiar with programming languages such as HTML, CSS, JavaScript, PHP and Python as well as frameworks like Laravel, Django, React and Node.js. I am eager to gain practical experience and contribute to the development of high-quality websites and software.

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.

Rizqy Hidayat

Product Engineer, Dicoding Indonesia

Fauzi Kurniawan

External Code Reviewer at Dicoding Indonesia

Javascript enthusiast

Muhammad Zainul Hakim

Developer

Learning the web tech. Currently in the front side.

Gunawan Wahyu Andreanto

Full Stack Developer

meh

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

Putu Jhonarendra

Programmer

Seorang Programmer dari Bali, Indonesia yang memiliki pengalaman lebih dari 3 tahun mengembangkan aplikasi web. Aplikasi yang dibuat telah dipakai di lembaga pendidikan dan instansi pemerintah.

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

Alexzander Purwoko Widiantoro

Code Reviewer at Dicoding Indonesia

Associate Android Developer
Android, Web & IoT Enthusiast

Abdul Malik

Junior Frontend Developer

Let's get in touch with me:

Linkedin - GitHub - Facebook

Ivan Andrianto

External Reviewer at Dicoding Indonesia

Google Data Analytics Professional Certificate
UI/UX Enthusiast
Machine Learning Enthusiast
Mobile & Web Enthusiast

Hasan Ismail Abdulmalik

Software Engineering Student at College of Vocational Studies IPB University

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.

Rizqy Hidayat

Product Engineer, Dicoding Indonesia

Fauzi Kurniawan

External Code Reviewer at Dicoding Indonesia

Javascript enthusiast

Muhammad Zainul Hakim

Developer

Learning the web tech. Currently in the front side.

Gunawan Wahyu Andreanto

Full Stack Developer

meh

Testimoni Siswa

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

shazi awaludin

Tanamin

Menjadi React Web Developer Expert

Kelas ini benar-benar membuka wawasan saya untuk membuat sebuah aplikasi react. Yang awalnya saya pikir react itu sesuatu yang rumit, ternyata bisa teratasi dengan baik sekali oleh segala ekosistem yang ada. kelas ini sangat mendorong saya untuk mengeksplor lebih jauh lagi tentang front-end web dev dengan react

Baca selengkapnya

Lihat semua testimoni

Testimoni Siswa

shazi awaludin

Tanamin

Menjadi React Web Developer Expert

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