Oke, Apa Itu React? (Part 2)

Monday. December 04, 2017 - 1 min

See the Pen OOqaJa by imamassi (@imamassi) on CodePen.

Oke, diatas ini adalah contoh lain dari keajaiban React.

Diatas jika kita membuka tab Babel, kita melihat sebuah elemen <Youtube />, ini jelas bukan elemen HTML, melainkan elemen yang dibuat dengan menggunakan React. Kita menyebutnya sebagai sebuah komponen. (Komponen ini bukan komponen resmi React, ini adalah komponen yang didapat dari https://github.com/compedit/react-youtube dan saya koding agar dapat diproses di CodePen diatas).

const youtubeopts = {
  width: '320',
  height: '',
  controls: 0
}

ReactDOM.render(
  <Youtube videoId="3P6DWAwwViU" opts={youtubeopts}/>,
  document.getElementById('root')
)

Jika kita lihat, React membuat kita lebih mudah dalam memasukkan video tersebut. Dibandingkan saya memasukkan kode embed yang panjang, saya tinggal menambahkan komponen yang telah dibuat oleh orang, memasukkan properti (sebutan atribut dalam komponen React) berupa videoId dan opts yang berisi opsi dalam Youtube playernya (Diatas saya membuat widthnya 320 pixel dan tanpa kontrol).

Imam Assidiqqi

Founder of Imam.tech