React Dasar

Assessment ini dirancang untuk mengukur pemahamanmu tentang React sebagai library JavaScript untuk membangun antarmuka pengguna yang interaktif, modular, dan berbasis component.

Materi assessment mencakup konsep fundamental React, mulai dari function component dan JSX, pengelolaan state dan props, penggunaan Hooks, event handling, rendering data dalam bentuk list, conditional rendering, hingga konsep dasar virtual DOM dan penggunaan key pada component atau list.

Soal-soal tidak hanya menguji kemampuan mengingat syntax React, tetapi juga mengukur pemahaman tentang bagaimana component bekerja, bagaimana data mengalir antar-component, bagaimana perubahan state memicu proses rendering, serta bagaimana React mengelola dan memperbarui tampilan secara efisien.

Beberapa materi yang akan diujikan meliputi:

• Components — memahami konsep component sebagai unit penyusun UI serta perbedaan antara function component dan class component.
• JSX — memahami JSX sebagai syntax yang memungkinkan penulisan struktur UI dengan pendekatan yang menyerupai HTML di dalam JavaScript, termasuk aturan dasar penggunaannya.
• Props & state — memahami perbedaan props dan state, bagaimana data dikirim dari parent ke child component, serta bagaimana state digunakan untuk menyimpan data yang dapat berubah.
• Hooks — memahami penggunaan Hooks seperti useState, useEffect, dan useRef untuk mengelola state, menjalankan side effect, serta menyimpan reference atau nilai tertentu tanpa selalu memicu re-render.
• Event handling — memahami cara menangani interaksi pengguna menggunakan event seperti onClick serta bagaimana event handler berhubungan dengan state dan component.
• List rendering — memahami penggunaan map() untuk melakukan rendering sekumpulan data menjadi elemen atau component serta pentingnya memberikan key yang tepat pada setiap item.
• Conditional rendering — memahami beberapa pendekatan untuk menampilkan UI berdasarkan kondisi, termasuk penggunaan logical AND (&&) dan ternary operator.
• Data flow & component communication — memahami bagaimana data mengalir dari parent ke child melalui props serta bagaimana child dapat berkomunikasi kembali dengan parent menggunakan callback function yang dikirim melalui props.
• Rendering & re-rendering — memahami bagaimana perubahan state atau props dapat menyebabkan component melakukan re-render dan bagaimana React memperbarui bagian UI yang diperlukan.
• Virtual DOM — memahami konsep dasar virtual DOM dan bagaimana React menggunakannya sebagai bagian dari proses menentukan perubahan yang perlu diterapkan pada UI.
• Key — memahami fungsi key dalam rendering list, mengapa key harus stabil dan unik di dalam konteks list, serta bagaimana key membantu React mengidentifikasi item ketika data berubah.

Assessment ini cocok untuk mengukur fondasi React sebelum melanjutkan ke materi yang lebih kompleks seperti React Router, Context API, custom hooks, form handling, API integration, state management, performance optimization, maupun framework berbasis React seperti Next.js.

Pastikan kamu tidak hanya memahami syntax JSX dan Hooks, tetapi juga mampu membaca alur data dalam sebuah component, memprediksi hasil rendering berdasarkan state dan props, memahami kapan sebuah component melakukan re-render, serta memilih pendekatan yang tepat untuk membangun UI React yang reusable dan mudah dipelihara.