Bahasa Pemograman Java 1 minute read

Client side programming dalam 1 decade terakhir memang sedang jadi perbincangan, lantas apakah kita harus menggunakan?

Jawabanya bisa iya bisa juga gak, ya klo saya lebih konsern dengan kebutuhan. Artinya kalo kita mau buat aplikasi kita prosesnya dilakukan di setiap client baru kita gunakan contohnya seperti validasi, prediksi perhitungan dan lain-lain.

Dengan adanya client side proccessing ini ada benefit dan kekuranganya:

Kelebihan meng-kombine Server dan Client side

  1. Mengurangi request ke server
  2. Terlihat lebih responsif dan interactive

Kekurangan

  1. Kita harus memastikan bahwa client (browser) support dengan yang kita develop.
  2. Terkadang file js masih di cache oleh browser, padahal filenya sudah tidak dibutuhkan (resource cache)

Penggunaan Javascript dalam HTML

Untuk menggunakan js dalam HTML, bisa dilakukan dengan dalam html atau dibuat file terpisah yang kemudian di include di HTML seperti berikut:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html>
  <head>
    <title>Parcel Sandbox</title>
    <meta charset="UTF-8" />
    <!-- inline javascript -->
    <script lang="application/js">
      function onButtonClick() {
      	alert("button clicked!");
      }
    </script>
  </head>

  <body>
    <div id="app">Ini text dari html</div>
    <input type="text" name="nama" id="nama" />
    <button type="button" onclick="onButtonClick()">Kirim</button>
  </body>
  <!-- include javascript -->
  <script src="src/index.js"></script>
</html>

berikut adalah file jsnya dengan nama index.js:

1
2
3
4
document.title = "Belajar Javascript";

var divElement = document.getElementById("app");
divElement.innerHTML = "Halo ini saya dari Javascript " + new Date();

Javascript Framework

Jaman sekarang udah banyak sekali javascript framework, ada yang bisa combine dengan teknologi server side seperti:

  1. JQuery
  2. AngularJS
  3. VueJS

Atau ada bisa juga kita buat 2 state berbeda dengan front-end dan back-end seperti:

  1. AngularJS
  2. VueJS
  3. Angular
  4. ReactJS