React Component dan Import Component

Postingan sebelumnya yang mencatat tentang element pada ReactJS berada dihalaman berikut ini https://undebugable.blogspot.com/2019/06/react-element-hello-world.html.

Pada postingan kali ini akan mencatat tentang apa dan bagaimana Component pada ReactJS itu digunakan.


Buka project yang sudah dibuat sebelumnya disini. Setelah itu buka file App.js maka itu adalah component yang dipanggil disini.

ReactDOM.render(<App />, document.getElementById('root'));

Function Components dan Class Components

Yang kiri function component dan yang kanan adalah class component (Hasilnya sama saja).

Dua komponen diatas adalah sama saja dari sudut pandang si ReactJS sumber.

Membuat Functional Component

App.js di rubah sedikit jadi serperti ini.

Membuat Component Baru dan Import di App.js

Intro index.js

App.js

Hasil dibrowser.

Membuat Custom Property (props) Untuk Component

src/App.js

src/components/Intro/index.js

Hasil dibrowser.

Sumber
https://reactjs.org/docs/components-and-props.html#function-and-class-components
https://www.udemy.com/react-fundamentals/learn/lecture/8869570#overview