Membuat Kalkulator Dengan React JS

Setelah kita belajar dasar-dasar React JS seperti state, props, refs, material desain, style dan lain-lain. Kali ini kita akan belajar membuat kalkulator sederhana dengan React JS. Pertama-tama siapkan lah project anda, saya sarankan menggunakan webpack.

Sekarang kita langsung fokus pada dokument React JS.

Pada file App.js, ketiklah baris perintah berikut ini:

Dalam class App, terdapat 4 method, yakni:

1. constructor() (method bawaan React JS), berfungsi sebagai tempat untuk membuat state,

2. handleSubmit(), berfungsi untuk memproses perhitungan kalkulator,

3. renderHasil(), untuk menampilkan hasil,

4. render() (method bawaan React JS), berfungsi untuk merender DOM pada browser

Sekarang silahkan tambahkan baris perintah pada masing-masing method.

constructor()

handleSubmit()

renderHasil()

render()

Berikut adalah hasilnya.