React.js 101 - Membuat dan Menggunakan Komponen dengan Berbagai Studi Kasus
Kelas "React.js 101" adalah panduan lengkap bagi pemula yang ingin memahami dan menguasai dasar-dasar React.js. Fokus utama kelas ini adalah pembuatan dan penggunaan komponen dalam pengembangan aplikasi React.js.
Tentang Kelas
Dalam kelas "React.js 101 - Membuat dan Menggunakan Komponen dalam Aplikasi Berbasis React.js," peserta akan diajak dalam perjalanan mendalam ke dunia React.js. Melalui materi yang terstruktur, peserta akan memahami cara membuat dan mengelola komponen, elemen kunci dalam pengembangan aplikasi React.js.
Target dan Sasaran Peserta:
- Kelas ini cocok untuk pemula yang ingin memahami dasar-dasar React.js.
- Peserta diharapkan dapat belajar secara mandiri, sehingga dapat mengatur jadwal belajar mereka sendiri.
Tujuan Umum dan Khusus Pelatihan:
- Tujuan Umum: Peserta akan memiliki pemahaman menyeluruh tentang penggunaan komponen dalam React.js.
- Tujuan Khusus:
- Mempelajari konsep dasar React.js dan pentingnya komponen.
- Praktik langsung dalam membuat dan menggunakan komponen dalam proyek React.js.
Silabus:
- Pengenalan React.js dan Komponen
- Konsep dasar React.js.
- Peran dan struktur komponen dalam aplikasi React.js.
- Membuat Komponen React
- Langkah-langkah praktis dalam membuat komponen.
- Contoh penggunaan komponen dalam pengembangan aplikasi.
Metode Pembelajaran:
- Pembelajaran Mandiri Online Peserta dapat belajar sesuai dengan kecepatan dan waktu yang mereka tentukan sendiri.
Fasilitas Pembelajaran:
- Materi Pembelajaran
- Video tutorial dan materi pembelajaran akan tersedia.
- Forum Tanya Jawab
- Peserta dapat berinteraksi dan bertanya melalui forum khusus.
Peralatan Pembelajaran Peserta:
- Akses Internet Peserta membutuhkan akses internet melalui komputer dengan sistem operasi Windows, Mac, atau Linux.
- Spesifikasi Minimum Komputer Peserta:
- Sistem Operasi: Windows, Linux, atau MacOS.
- Prosesor: Intel Dual Core (Disarankan Core i3 ke atas).
- RAM: 1GB (Disarankan 2GB).
- Resolusi Layar: 1366 x 768 (Disarankan Full HD 1920 x 1080).
- Perangkat Lunak: Browser (Tanpa preferensi khusus).
Daftar Materi
| Mengenal React.Js Dengan Membuat Quote Generator | 10:51 | |
| Membandingkan Yang Sudah Dibuat Di React.Js Dengan Vanilla Javascript | 05:39 | |
| Jadi React.Js Itu Apa | 08:42 | |
| Persiapan Untuk Membuat Project React.Js | 07:08 | |
| Menjalankan React Langsung Di Html | 10:53 | |
| Mengenal Tools Untuk Menginstall React.Js | 05:46 | |
| Menginstall React.Js Dan Pahami Strukturnya | 09:19 | |
| Menyiapkan Project React.Js Dari Awal | 07:41 | |
| Apa Itu Component Dan Cara Kerjanya | 04:36 | |
| Cara Membuat Dan Menggunakan Component Di React.Js | 06:38 | |
| Mengenal Jsx Di Dalam Component React.Js | 04:25 | |
| Membuat Banyak Component Dan Mengaturnya | 08:04 | |
| Cara Menjalankan Logic Javascript Di Component | 05:03 | |
| Cari Tahu Kenapa React Berbasis Component | 05:23 | |
| Styling Di Component | 06:24 | |
| Mengirim Data Antar Component Dengan Props | 06:38 | |
| Props, Immutable Dan One-Way Data Flow | 04:56 | |
| Aturan Penulisan Jsx | 05:29 | |
| Menampilkan Component Secara Dinamis | 05:41 | |
| Melakukan Render Secara Kondisional Dengan _ | 06:40 | |
| Menampilkan Ui Di Jsx Dengan Ternary If | 03:58 | |
| Melakukan Render Jsx Dengan Multi Kondisi | 03:11 | |
| Refactor Komponen Khusus Untuk Jsx | 03:39 | |
| Memecah Isi Props Dengan Cara Destructing | 03:20 | |
| Membungkus Root Element Lebih Dari Satu Dengan React Fragment | 03:54 | |
| Mengatur Nilai Class Dan Text Secara Dinamis | 03:58 | |
| Rekap Apa Saja Yang Sudah Dipelajari Dan Langkah Selanjutnya | 04:12 | |
| Latihan #1 Membuat Kartu Nama Virtual | 02:51 | |
| Jawaban Latihan #1 Bagian 1 | 10:06 | |
| Jawaban Latihan #1 Bagian 2 | 04:43 | |
| Latihan #2 Membuat Kartu Nama Menjadi Dinamis | 02:24 | |
| Jawaban Latihan #2 | 05:34 |
Penyusun Materi
Ahmad Hakim
Founder & Mentor IDStack | CTO di Nusabot | Software Engineer di GovTech Edu | Former Software Engineer di Track&ROLL
Testimoni Oleh Siswa
(40 reviews)
Marevo Devansyah Sigit
Selasa, 3 Februari 2026 pukul 17.16
Tidak ada komentar
Mohammad Wahyu Sanusi Putra
Senin, 5 Januari 2026 pukul 21.10
Kelas yang sangat cocok untuk pemula! Materi tentang komponen ReactJS dijelaskan secara bertahap dan mudah dipahami. Instruktur memberikan contoh nyata yang langsung bisa dipraktikkan. Setelah menyelesaikan kelas ini, saya jadi paham cara membuat functional dan class component, serta mengelola props dan state. Sangat direkomendasikan bagi yang ingin mulai belajar ReactJS dari dasar!
Mohammad Wahyu Sanusi Putra
Senin, 5 Januari 2026 pukul 19.57
Kelas ini sangat cocok untuk pemula yang ingin memahami konsep paling fundamental di ReactJS: Komponen. Materi disusun dengan runtut, dari pengenalan JSX, perbedaan komponen kelas dan fungsi, hingga cara memanfaatkan props dan state dengan baik.
Lukman Ahmad
Minggu, 14 Desember 2025 pukul 18.16
Saya cukup bingung karena terdapat dua kelas React Dasar yang terasa redundan alias mengajari materi yang serupa
Lukman Ahmad
Minggu, 14 Desember 2025 pukul 18.16
Saya cukup bingung karena terdapat dua kelas React Dasar yang terasa redundan alias mengajari materi yang serupa
Muhammad Hamzah Hasan
Selasa, 14 Oktober 2025 pukul 02.50
Materi yang disampaikan mudah dipahami, mencakup hal hal dasar yang penting untuk dipelajari oleh pemula.
adhie safriadi
Kamis, 25 September 2025 pukul 01.14
agak susah sih di pahami awal awalnya tapi setelah di simak berulang kali baru bisa di pahami, dan setelah kelas ini selesai saya akan mengulang kembali agar bisa lebih di pahami lagi
Eko Herdianto
Rabu, 27 Agustus 2025 pukul 19.00
Keren banget pokoknya kelas ini, kupas tuntas dasar dasar react, saya sangat memahami materi dengan mudah
Meidhika Nawa Sapta
Rabu, 28 Mei 2025 pukul 04.11
Materi sangat berguna dan bermanfaat, banyak ilmu baru didalamnya, kali ini kak hakim menjelaskannya denga baik dan perlahan sehingga mudah di pahami.
Mario
Selasa, 13 Mei 2025 pukul 10.19
Materinya sangat detail dan jelas dan mendasar, mudah untuk dimengerti bahkan untuk yang masih dalam tahap pemula.