#1 Pendahuluan — Seminggu Menjadi Master React JS — Seri Tingkat Dasar

Safei Muslim
SkyshiDigital
Published in
5 min readAug 13, 2017

Ini adalah artikel pertama dari serial Seminggu Menjadi Master React JS — Seri Tingkat Dasar. Pada artikel pertama ini kita akan mencoba berkenalan dengan React JS dan mengapa kita harus menggunakan React JS.

# Apa itu react js ?

React JS adalah sebuah pustaka/library javascript yang bersifat opensource untuk membangun User Interface yang dibuat oleh Facebook. React JS hanya mengurusi semua hal yang berkaitan dengan tampilan dan logika di sekitarnya. React JS ini diciptakan dengan tujuan untuk :

“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 membuat react js mudah dipahami dan membuat react mudah di prediksi jika ada kesalahan penulisan kode.
  2. JSX
    JSX adalah sebuah extension javascript yang di gunakan react untuk menulis HTML di dalam Javascript. JSX bukanlah sintaks javascript, sehingga browser tidak bisa membaca sintaks ini, di butuh kan sebuah JSX compiler yang di gunakan untuk menterjemahkan JSX kedalam bahasa regular javascript agar bisa terbaca oleh browser. Saya sendiri menggunakan BABEL JS sebagai JSX compilernya.
  3. Modular
    Untuk membuat aplikasi dengan skala besar, kita dapat menulis kode-kode dengan skala yang lebih kecil untuk di satukan menjadi aplikasi utuh, dan dapat di gunakan kembali (reusable).
  4. Scalable
    React js dapat menangani dengan sangat baik sebuah program dengan skala yang besar yang dapat menampilkan perubahan data yang sangat kompleks.
  5. Flexibel
    Dengan belajar 1 libary saja kita dapat membuat aplikasi Web, Moblie, maupun Desktop.
  6. Effisien dan Cepat
    React JS menciptakan Virtual DOM untuk mempercepat urusan perubahan DOM. Semua operasi di kerjakan di dalam Virtual DOM, setelah operasi selesai React JS menulis perubahan tersebut di dalam DOM. Contoh kasusnya seperti ini: “Jika kita menulis dalam secarik 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, jangan lupa menginstall extensi resmi React JS. Kita dapat dengan mudah menjelejah Virtual DOM pada aplikasi yang sudah kita buat, sehingga jika ada bug bisa cepat ditemukan.
  8. SEO Bagus
    Salah satu masalah terbesar dari library Javascript pada umumnya adalah mereka sidak 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 support SEO.

# Kelemahan react js ?

Meskipun React JS sangat powerfull, namun juga memiliki beberapa kelemahan antara lain:

  1. Hanya View Layer
    React js hanya sebuah pustaka View Layer, untuk membangun aplikasi besar kita harus menyusun sendiri kebutuhan aplikasi lainya seperti data layer, router, struktur aplikasi dan event system(kecuali event DOM).
  2. Dokumentasi tidak bagus
    Beberapa sumber artikel yang saya baca mengatakan bahwa dokumentasi react js tidak bagus karena informasi yang di berikan tidak lengkap, meskipun seperti itu kita tetap bisa mempelajarinya kok, tentunya dengan semangat dan ketekunan.
  3. Permasalahan lisensi
    Baru-baru ini muncul issue tentang lisensi react. Sebetulnya issue ini sudah ada sejak 2015, namun tampaknya ada pihak-pihak yang belum puas dan mempermasalahkanya. Menurut pemahaman saya bahwa facebook memperbolehkan kita menggunakan react js untuk mengembangkan produk kita dengan catatan tidak untuk berkompetisi dengan produknya facebook”. Tapi sebenarnya ini tidak masalah , temen-teman bisa baca penjelasanya detail disini.
  4. Dukungan browser
    React js tidak mendukung browser versi lama, hanya browser versi baru. React js menghentikan dukungan pada browser Internet Explorer versi 8, sampai saat ini react yang bisa jalan di IE 8 adalah react versi v0.14. Versi terbaru dari react hanya mendukung Internet Explorer versi 9 keatas.

# Mengapa facebook membuat react js?

  1. Data binding yang rumit, pernahkan anda mengolah form yang didalamnya ada 20 element text input ? jika kita menggunakan javascript biasa kita harus melakukan data binding(getElementById) sebanyak element text input yang ada didalam form, sangat jelimet bukan ? namun jika kita menggunakan react, kita cukup menyimpan data element didalam object state yang nantinya akan di re render oleh react ketika ada perubahan pada object state tersebut.
  2. Banyak perubahan data pada element setiap waktu, jika kita pengguna facebook maka kita bisa mencermati setiap page facebook data elementnya update setiap sekian detik. Dengan mengusung konsep Virtual DOM, inilah mengapa react js sangat cocok digunakan pada aplikasi yang data pada elementya mengalami perubahan setiap waktu.

# Siapa yang sudah menggunakan react js ?

Ini adalah beberapa perusahaan yang sudah mengimplementasikan react js pada produknya, selengkapya bisa dilihat disini.

# Mengapa harus pakai react js ?

  1. React js mudah di pahami.
  2. Konsep Components pada react js merupakan konsep pengembangan web modern.
  3. Jika data elements pada aplikasi kita berubah setiap satuan waktu, maka kita bisa menggunakan react sebagai solusinya.
  4. Jika dalam satu team sama-sama sedang belajar react, maka pengembangan aplikasi bisa lebih cepat.

# Apakah beralih ke react js itu sulit ?

Jawabanya adalah relatif, tergantung orangnya itu sendiri, selama ada kemauan menurut saya itu mudah. Jika merasa bermasalah dengan dokumentasi react, kamu bisa mengikuti serial artikel yang saya tulis ini kok, InsyaAlloh lengkap!!!

# Kesimpulan

React Js adalah pustaka UI yang di bangun oleh facebook sangat sederhana dan cepat. Meskipun dokumentasi React JS tidak lengkap namun kita masih bisa mempelajarinya.

Happy Coding

Safei Muslim

Daftar isi >> Seminggu Menjadi Master React JS — Seri Tingkat Dasar
Selanjutnya >> #2 Instalasi — Seminggu Menjadi Master React JS — Seri Tingkat Dasar

--

--