Latihan 1: Props — React

Latihan 1 dari materi Props di React — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.

Kode awal sudah memanggil <Welcome name="Andi" /> di App, dan Welcome sudah menerima prop name lewat { name } di parameternya. Biarkan keduanya.

Di dalam Welcome, ganti comment // return h2 dengan nama dengan return sebuah <h2>.
Isi <h2> dengan teks Halo, , lalu {name}, lalu !, supaya namanya datang dari prop.

Hasilnya harus persis Halo, Andi! (koma, satu spasi, tanda seru). Yang dicek: ada <h2> dengan teks persis Halo, Andi!, ada komponen bernama Welcome, App memanggilnya dengan atribut name=, dan isi <h2> membaca prop itu lewat {name} atau {props.name}.

Hint

Prop dikirim seperti atribut di tag komponen, lalu diterima sebagai parameter function komponennya. Kode awal sudah mengurus keduanya, kamu tinggal menampilkannya.
Isi Welcome dengan return sebuah <h2>. Di dalamnya, Halo, koma, dan tanda seru diketik, sedangkan namanya diambil dari {name}.
function Welcome({ name }) { return <h2>Halo, {name}!</h2> }

</> { } .css => #id fn()

Versi baru

HyperSheets

bagian dari BelajarWeb.dev

Membuka gerbang…

Latihan 1: Props — React

Hint

Memperbarui Aplikasi