Latihan 1: Komponen Pertamamu — Vue

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

Komponen ini gak butuh data, jadi editornya langsung mulai dari garis ---template---. Di dalam <div> yang sudah ada:

Tambahkan <header> berisi <h1>Hyper Sheets</h1>.
Di bawahnya, tambahkan <footer> berisi <p>© 2026</p>.

Simbol © boleh diketik langsung atau ditulis ©.

Yang dicek:

<h1> di dalam <header> berisi persis Hyper Sheets.
<p> di dalam <footer> berisi persis © 2026.

Hint

Elemen semantik header dan footer membungkus bagian kepala dan kaki halaman, dan isinya ditaruh di dalam elemen itu.
Di dalam div, buat header yang berisi h1 Hyper Sheets, lalu footer yang berisi p dengan simbol ©, spasi, dan 2026.
<div> <header><h1>Hyper Sheets</h1></header> <footer><p>© 2026</p></footer> </div>

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

Versi baru

HyperSheets

bagian dari BelajarWeb.dev

Membuka gerbang…

Latihan 1: Komponen Pertamamu — Vue

Hint

Memperbarui Aplikasi