Excellence and What is React JS ?

[ENGLISH VERSION]

In this article I want to share a little knowledge about React to be clearer than the previous discussion on "Do I have to use "React". So before that then we start from some important point first.

All you need to know if a developer / programmer says React then the intent of it is React JS which is usually for the web. In addition there is also React Native as well as React JS but more powerful to the mobile. Let's go back to our topic before.

# What is React JS?

React JS is an open source javascript library for building UI created by Facebook. The purpose of React JS was created:

"Building large-scale applications with data that change and keep changing over time"

# Excellence React JS?

1. Easy to understand

Declarative writing style that makes this react easy to understand and predictable if there is a code writing error.

2. JSX

React uses JSX javascript extension to write HTML in javascript but JSX is not javascript syntax, so the browser can not read this syntax but requires a JSX compiler to translate it into regular javascript language for browser readability. In the process generally commonly used compiler is BABEL JS.

3. Modular

to create large-scale applications. we can write code with a small scale to put together into application / system intact and reusable (reusable)

4. Scalabe

React js can handle very well a large-scale program that can display very complex data changes.

5. Flexible

This I mean before, besides React Js also have React Native that they have the same library but can create web applications, mobile or desktop.

6. Efficient and Fast.

How React Js works is creating a virtual DOM to speed up the DOM (Document Object Model) change where all operations are done in virtual DOM and after the operation is done React JS writes changes inside the DOM. Example of the Case: "If we write in a paper with a marker, if there is a writing error we have to write on the new paper.Unlike if we use a pencil, simply remove and fix on the wrong part.

7. Easy Debugging

When we start using React JS, we install the official react extension, so we can easily explore Virtual DOM on the application we created so that if any bugs can be found quickly.

8. SEO

One of the biggest problems of Library Javascript in general is they do not support search engines. Despite the many improvements, search engines generally still have trouble. But not with React JS, we can run React Js on the server and Virtual DOM is assigned to the browser as a regular web page, so it is very SEO suppport.

However at this time I did not try to explain the shortcomings. What we need to try to find out why they make React JS.

# Why Facebook makes React JS

1. Data binding is complicated, this problem arises if when we process the form in which 20 text input element? if we use ordinary javascript we have to do data binding (getElementById) as much as text input element. Is not that so complicated?

But if using React, we simply store the data element in the object state which will be rendered by react when there is a change of object state.

2. Many changes to the data on the element every time, if we are facebook users then we look at every page facebook data elementnya update every few seconds. By carrying the concept of Virtual DOM, inlah why react js is suitable for use in applications that data on the element changes every time.

[INDONESIAN VERSION]

Pada artikel kali ini saya ingin membagi sedikit pengetahuan tentang React menjadi lebih jelas dari pada pembahasan yang sebelumnya tentang "Apakah saya harus menggunakan "React". Maka sebelum itu maka kita mulai dari beberapa point penting terlebih dahulu.

Yang perlu anda ketahui jika seorang developer/programmer mengatakan React maka maksud dari itu adalah React JS yang biasanya untuk web. Selain itu ada juga React Native sama juga seperti React JS namun lebih powerfull ke mobile. Baiklah kita kembali ke topik kita sebelumnya.

# Apa itu React JS ?

React Js adalah sebuah library javascript yang bersifat open source untuk membangun UI yang dibuat oleh Facebook.  Tujuan React JS diciptakan adalah: 

"Membangun aplikasi skala besar dengan data yang berubah dan terus berubah dari waktu ke waktu"

# Keunggulan React JS ?

1. Mudah dipahami

Gaya penulisan yang deklaratif yang membuat react ini mudah dipahami dan dapat diprediksi jika ada kesalahan penulisan kode.

2. JSX

React menggunakan extension javascript JSX untuk menulis HTML di dalam javascript akan tetapi JSX bukan sintaks javascript, sehingga browser tidak bisa membaca sintaks ini melainkan membutuhkan sebuah JSX compiler untuk menerjemahkannya kedalam bahasa regular javascript agar bisa dibaca browser. Didalam prosesnya umumnya compiler yang biasa digunakan adalah BABEL JS.

3. Modular

untuk membuat aplikasi skala besar. kita dapat menulis kode dengan skala kecil untuk disatukan menjadi aplikasi/sistem utuh dan dapat digunakan kembali (reusable)

4. Scalabe

React js dapat menangani dengan sangat baik sebuah program dengan skala besar yang dapat menampilkan perubahan data yang sangat kompleks.

5. Flexibel

Ini maksud saya sebelumnya, selain React Js juga ada React Native yaitu mereka memiliki library yang sama namun dapat membuat aplikasi web , mobile maupun desktop.

6. Efisien dan Cepat.

Cara kerja React Js adalah menciptakan virtual DOM untuk mempercepat urusan perubahan DOM(Document Object Model) dimana semua operasi dikerjakan di virtual DOM dan setelah operasi di kerjakan React JS menulis perubahan didalam DOM. Contoh Kasusnya : "Jika kita menulis dalam secari kertas menggunakan spidol, apabila terjadi kesalahan penulisan kita harus menulis di kertas yang baru. Berbeda jika kita menggunakan pensil, cukup menghapus dan memperbaiki pada bagian yang salah.

7. Mudah Debugging

Ketika kita mulai  menggunakan React JS, kita menginstall ekstensi resmi react, sehingga kita dapat dengan mudah menjelajah Virtual DOM pada aplikasi yang kita buat sehingga jika ada bug bisa cepat ditemukan.

8. SEO 

Salah satu masalah terbesar dari Library Javascript pada umumnya adalah mereka tidak support search engine. Meskipun sudah banyak perbaikan, mesin pencari umumnya masih mengalami kesulitan. Namun tidak dengan React JS, kita dapat menjalankan React Js pada server dan Virtual DOM diberikan ke browser sebagai halaman web biasa, sehingga sangat suppport SEO.

Namun pada kali ini saya tidak mencoba menjelaskan kekurangannya. Yang perlu kita coba cari tahu kenapa meraka membuat React JS. 

# Mengapa Facebook membuat React JS

1. Data binding yang rumit, masalah ini timbul jika saat kita mengolah form yang didalamnya 20 element text input ? jika kita menggunakan javascript biasa kita harus melakukan data binding(getElementById) sebanyak element text input. Bukankah itu sangat rumit ? 

Namun jika menggunakan React, kita cukup menyimpan data element didalam object state yang nantinya akan dirender oleh react ketika ada perubahan object state tersebut.

2. Banyak perubahan data pada element setiap waktu, jika kita pengguna facebook maka kita mencermati setiap page facebook data elementnya update setiap sekian detik. Dengan mengusung konsep Virtual DOM, inlah mengapa react js sangat cocok digunakan pada aplikasi yang data pada elementnya mengalami perubahan setiap waktu.