React.js - Library Javascript untuk User Interface



Apa itu ReactJs

React.js adalah library user interface yang membuat website kamu jadi lebih dinamis. 

Dokumentasi Reactjs bisa dilihat disini ReactJs Documentation

React adalah library JavaScript untuk membangun antarmuka pengguna. 

React telah dirancang sejak awal untuk diadopsi secara bertahap, dan Anda dapat menggunakan React sesedikit atau sebanyak yang Anda butuhkan. Baik Anda ingin merasakan React, menambahkan beberapa interaktivitas ke halaman HTML sederhana, atau memulai aplikasi kompleks yang didukung React, tautan di bagian ini akan membantu anda

Langkah yang harus dilakukan terdiri dari:

  1. Instal terlebih dahulu Node.Js klik disini yang dibutuhkan hanya NPM (Node Package Manager) nya saja pilih LTS, Download dan Instal
  2. Cek NPM nya : ketikan : npm -v

Buat Aplikasi React

Saat memulai proyek React, halaman HTML sederhana dengan tag skrip mungkin masih menjadi pilihan terbaik. Hanya perlu satu menit untuk menyiapkan!

Saat aplikasi Anda berkembang, Anda mungkin ingin mempertimbangkan penyiapan yang lebih terintegrasi. Ada beberapa rantai alat JavaScript yang kami rekomendasikan untuk aplikasi yang lebih besar. Masing-masing dari mereka dapat bekerja dengan sedikit atau tanpa konfigurasi dan memungkinkan Anda memanfaatkan sepenuhnya ekosistem React yang kaya. Belajar bagaimana.

langkah yang dilakukan terdiri dari:

  1. Membuat nama project reactnya : npx create-react-app reactapp (pastikan terhubung dengan internet dan tunggu sampai selesai) download dependency 
  2. hasilnya
  3. Buka Projectnya di visual studio code
  4. Buka Projectnya dengan mengetikan npm start

Hasilnya akan seperti ini

Untum memberhentikan proses dari Local Servernya ketikan (Ctrl + C)


Apa itu JSX pada Reactjs

JSX didalam file App.js menampilkan tampilan landing page, halaman ini ditulis tag HTML tapi ditulis dalam file Javascript (mengubah tag html didalam return didalam file javascript) functuionnya diberinama App yang didalamnya ada file utama Index.js yang akan dirender dan di import melalui react DOM (Document Object Model)

JSX merupakan singkatan dari JavaScript Syntax Extension atau dikenal juga dengan Javascript XML. 
JSX adalah ekstensi React untuk Javasript. Sintaks JSX mirip seperti HTML, sehingga membuat kita lebih gampang menyusun elemen pada komponen React.

Apa itu element react?
Elemen React adalah bagian terkecil dari sebuah aplikasi. Elemen React akan menyusun sebuah komponen. Elemen ini biasanya akan ditampilkan atau di-render.

Tanpa JSX, kita bisa membuat elemen React dengan method:
React.createElelemnt();

Method ini punya tiga parameter yang wajib diisi:
  1. Type elemen dalam bentuk string;
  2. Properti element dalam bentuk object;
  3. Children dalam bentuk string dan juga object react element;












Powered by Blogger.