Client dan Server: Dua Sisi Web

Penjelasan santai soal model client-server untuk pemula. Pahami bagaimana browser-mu meminta dan server menjawab, kenapa keduanya peran bukan mesin, dan apa yang sebenarnya terjadi saat web request.

Diterbitkan 15 September 20268 menit bacaOleh ACY Partner Indonesia
Client dan Server: Dua Sisi Web, dengan alur dari client ke server
300 × 250Slot Iklan TersediaPasang iklan Anda di sini

Setiap kali kamu membuka sebuah situs, ada dua pihak yang diam-diam membuat kesepakatan. Yang satu meminta sesuatu, yang satunya lagi menyerahkannya. Tarik-ulur kecil itulah jantung dari seluruh web, dan begitu kamu bisa membayangkannya dengan jelas, banyak istilah teknis yang tadinya bikin pusing tiba-tiba jadi masuk akal.

Dua pihak ini punya nama: client dan server. Kedengarannya teknis, tapi gagasannya sebenarnya hal yang kamu lakukan belasan kali sehari tanpa sadar. Di artikel ini kita akan menyusun gambarannya dari nol, dengan bahasa sederhana, tanpa berasumsi kamu sudah tahu apa-apa sebelumnya.

Cara gampang membayangkannya

Bayangkan kamu masuk ke sebuah rumah makan. Kamu duduk, baca menu, lalu bilang ke pelayan, “Saya mau ikan bakar, ya.” Beberapa saat kemudian, dapur menyiapkan hidanganmu dan pelayan mengantarkannya ke meja.

Dalam adegan itu, kamu adalah client. Kamu pihak yang punya permintaan. Dapur adalah server. Di sanalah bahan makanan, resep, dan peralatannya berada, dan tugasnya memenuhi pesanan. Kamu tidak masuk ke dapur lalu masak sendiri; kamu meminta, lalu kamu menerima.

Web bekerja nyaris persis seperti itu:

  • Client adalah pihak yang meminta sesuatu.
  • Server adalah pihak yang menjawab permintaan itu.

Browser yang kamu pakai untuk membaca tulisan ini sekarang adalah sebuah client. Saat kamu mengetik sebuah alamat lalu menekan Enter, browser-mu mengirim pesanan: “Tolong kasih saya halaman di alamat ini.” Di suatu tempat di luar sana, sebuah server menerima pesanan itu, menyiapkan halamannya, lalu mengirimkannya balik. Browser-mu kemudian menata semuanya di layar.

Versi satu kalimat

Client meminta. Server menjawab. Sisa artikel ini cuma detail yang ditumpuk di atas satu gagasan itu.

Client dan server itu peran, bukan mesin

Bagian inilah yang sering bikin pemula keliru, jadi mari pelan-pelan. Saat orang menyebut “server,” biasanya yang terbayang adalah komputer khusus yang mahal, menderu-deru di ruangan dingin. Gambaran itu tidak salah, tapi belum lengkap.

“Client” dan “server” adalah peran, bukan jenis perangkat tertentu. Peran itu tugas yang kamu mainkan di momen tertentu, mirip “pembicara” dan “pendengar” dalam obrolan. Orang yang sama bisa jadi pembicara sekarang dan pendengar sedetik kemudian. Komputer pun begitu.

Coba lihat begini. Laptopmu berperan sebagai client ketika ia meminta artikel ke blog.acy-partner.com. Tapi laptop yang sama itu juga bisa menjalankan program server, misalnya saat seorang pengembang sedang membangun sebuah situs. Pada momen itu, laptopnya sedang menjawab permintaan, jadi ia memainkan peran server. Tidak ada yang berubah dari perangkat kerasnya. Yang berubah cuma tugas yang sedang ia kerjakan.

Jadi setiap kali kamu membaca kata “server,” latih dirimu untuk berpikir pihak yang saat ini sedang menjawab permintaan, dan setiap kali membaca “client,” pikirkan pihak yang saat ini sedang meminta. Satu mesin bisa berperan ganda di waktu berbeda, dan pada sistem besar sering ada mesin yang menjadi client sekaligus server.

Frontend dan backend, sekilas

Kamu akan sering dengar istilah “frontend” dan “backend.” Secara longgar, frontend adalah bagian yang berjalan di sisi client (yang kamu lihat dan klik di browser), sedangkan backend adalah bagian yang berjalan di sisi server (logika dan data di balik layar). Keduanya pas sekali dipetakan ke peran client dan server.

Apa yang sebenarnya terjadi dalam sebuah request

Mari kita telusuri satu kunjungan ke situs, langkah demi langkah, supaya alurnya terasa nyata. Misalkan Jane Doe mengetik blog.acy-partner.com di browser-nya.

  CLIENT (browser)                         SERVER (komputer situs)
        |                                            |
        |  1. "Tolong kasih halaman utama"           |
        | -----------------------------------------> |
        |                  (request)                 |
        |                                            |  2. mencari / menyusun
        |                                            |     halamannya
        |  3. "Ini halamannya, plus kode status"     |
        | <----------------------------------------- |
        |                  (response)                |
        |                                            |
   4. browser menggambar
      halaman di layar

Ada empat hal yang terjadi, dan cuma empat:

  1. Client mengirim request. Browser membungkus apa yang ia mau (“halaman utama”) lalu mengirimkannya lewat jaringan.
  2. Server menerima dan memprosesnya. Ia mencari tahu apa yang diminta, mungkin mengambil sesuatu dari basis data, lalu menyusun jawaban.
  3. Server mengirim response. Kembalilah isi halaman beserta catatan status singkat yang menjelaskan bagaimana hasilnya.
  4. Client memakai response itu. Browser mengambil isi mentahnya lalu mengubahnya menjadi halaman yang kamu lihat, lengkap dengan teks, gambar, dan tombol pada tempatnya.

Perjalanan bolak-balik itu terjadi dalam sepersekian detik, dan terus berulang. Satu halaman web saja bisa memicu puluhan pertukaran kecil seperti ini: satu untuk teks halaman, yang lain untuk tiap gambar, tampilan gaya, font, dan seterusnya. Masing-masing mengikuti pola yang sama.

Bahasa yang mereka pakai: HTTP

Supaya client dan server bisa saling mengerti, mereka butuh bahasa bersama. Di web, bahasa itu disebut HTTP (HyperText Transfer Protocol). Protokol itu sekadar seperangkat aturan yang sudah disepakati tentang bagaimana sebuah percakapan mesti berjalan, mirip aturan sopan-santun saat memesan di rumah makan tadi.

Sebuah request dalam bahasa ini membawa beberapa bagian penting. Berikut contoh sederhana wujud request dari sebuah client di balik layar:

GET /articles/client-and-server HTTP/1.1
Host: blog.acy-partner.com
Accept: text/html

Kamu tidak perlu menghafalnya. Cukup perhatikan bentuknya saja: ada method (GET, artinya “ambilkan ini untukku”), ada path (halaman mana yang diminta), dan beberapa catatan tambahan yang disebut header. Server membaca semua ini lalu membalas dengan cara terstruktur yang sama.

Saat server menjawab, ia menyertakan kode status, yaitu angka tiga digit yang merangkum hasilnya. Hampir pasti kamu pernah melihat salah satunya:

Kode status Arti kasarnya Kapan kamu melihatnya
200 Oke, ini yang kamu minta Sebagian besar halaman yang termuat normal
301 / 302 Halaman pindah, ke sini saja Pengalihan (redirect)
404 Tidak ditemukan Tautan rusak atau salah ketik
500 Server mengalami error Ada yang rusak di sisi server

Halaman “404” yang kadang kamu jumpai itu sebenarnya cuma cara sopan server berkata, “Saya dengar permintaanmu, tapi saya tidak punya yang kamu minta.”

Kenapa dipisah seperti ini?

Mungkin kamu bertanya, kenapa web repot-repot pakai dua sisi? Kenapa tidak taruh semuanya di perangkatmu sendiri saja? Pemisahan ini ada karena ia menyelesaikan masalah nyata dengan rapi.

Data terpusat dan selalu baru. Server menyimpan satu salinan utama informasinya. Saat ACY Partner Indonesia menerbitkan artikel baru, artikel itu ada di server. Browser tiap pengunjung memintanya dan mendapat versi terbaru yang sama. Tidak ada yang perlu mengunduh lalu memperbarui berkas raksasa di komputernya sendiri.

Banyak client, satu server. Ribuan orang bisa menjadi client dari server yang sama pada waktu bersamaan. Ponselmu, laptop di negara lain, dan tablet di sebelah bisa sama-sama meminta halaman yang sama ke server itu, dan masing-masing mendapat salinan jawabannya sendiri.

Pekerjaan berat ditaruh di tempat yang tepat. Sebagian tugas terlalu besar atau terlalu sensitif untuk dikerjakan di perangkatmu. Menyisir jutaan catatan, memproses pembayaran, atau menjaga kata sandi tetap aman, semuanya pantas dikerjakan di server, tempat data dan tenaganya berada. Browser-mu tetap ringan dan cukup menampilkan hasilnya.

Batas yang jelas. Karena kedua sisi berbicara lewat bahasa yang sudah ditetapkan, satu sisi bisa diubah tanpa merusak sisi lain. Sebuah tim bisa membangun ulang server secara total, sementara tiap browser tetap meminta dengan cara yang persis sama.

Sebuah request bisa gagal, dan itu wajar

Karena client dan server sering berjauhan dan terhubung lewat jaringan, request tidak selalu berhasil. Koneksi bisa putus, server bisa sibuk, atau alamatnya salah. Itulah sebabnya aplikasi menampilkan ikon memuat dan pesan kesalahan: mereka sedang menghadapi kenyataan bahwa sisi lawan mungkin tidak menjawab sesuai harapan.

Beberapa hal yang perlu diluruskan

Sekarang gagasan intinya sudah terpasang, mari kita beresi beberapa hal yang umumnya bikin bingung.

Satu server bisa memainkan banyak peran. Satu komputer bisa menjalankan program yang menjawab request web sekaligus program lain yang menyimpan data. Bagi bagian sistem yang lain, ia bisa menjadi server untuk satu hal dan client untuk hal lain pada saat yang sama.

“Cloud” itu cuma server. Saat sesuatu disebut ada “di cloud,” maksudnya sebenarnya ia berada di server milik orang lain yang dipelihara orang lain, biasanya di pusat data besar. Tidak ada sihir di situ; hubungannya tetap client-server yang sama, hanya saja servernya disewa, bukan duduk di kantormu.

Client tidak melulu browser. Aplikasi ponsel, jam tangan pintar, bahkan server lain bisa bertindak sebagai client. Apa pun yang mengirim request lalu menunggu jawaban sedang memainkan peran client dalam pertukaran itu.

Kalau kamu ingin menyelam lebih dalam soal sisi server secara khusus, apa sebenarnya server itu, jenis-jenisnya apa saja, dan bagaimana ia disiapkan, topik itu dibahas tuntas tersendiri di Apa Itu Server?. Pembahasannya melanjutkan persis dari titik artikel ini berhenti.

Rangkuman

Mari kita kumpulkan seluruh gagasannya ke dalam beberapa kalimat yang bisa kamu bawa:

  • Web berjalan di atas percakapan tanpa henti antara client (yang meminta) dan server (yang menjawab).
  • Keduanya peran, bukan mesin. Komputer yang sama bisa jadi client di satu momen dan server di momen berikutnya.
  • Satu kunjungan web adalah putaran yang rapi: client mengirim request, server memprosesnya lalu mengirim balik response, dan client mengubah response itu menjadi halaman yang kamu lihat.
  • Mereka berbicara memakai HTTP, seperangkat aturan bersama, dan server menandai tiap jawaban dengan kode status seperti 200 atau 404.
  • Membagi pekerjaan seperti ini menjaga data tetap terpusat dan baru, memungkinkan satu server melayani banyak client, dan menaruh pekerjaan berat atau sensitif di tempat yang semestinya.

Pegang erat gambaran tentang meminta dan menjawab itu. Itulah fondasi yang menjadi pijakan domain, alamat, browser, dan protokol. Dari sini, langkah berikutnya yang masuk akal adalah menengok lebih dekat servernya sendiri dan apa sebenarnya yang ia kerjakan saat menjawab panggilanmu.

Tag:web-fundamentalsclientserverhttppemulacara-kerja-web
728 × 90Slot Iklan TersediaPasang iklan Anda di sini

Artikel Terkait

Lihat Semua Artikel

Artikel yang Mungkin Kamu Suka

Ilustrasi DOM sebagai pohon dari node HTML
Dasar-Dasar Web / Browser

Apa Itu DOM?

Penjelasan DOM untuk pemula: pohon HTML yang hidup di memori browser. Pahami apa itu DOM, bagaimana pohonnya dibentuk, dan kenapa ia begitu penting.

15 Sep 20267 menit baca
Ilustrasi berjudul Apa Itu Web Browser dengan code chip fetch ke render
Dasar-Dasar Web / Browser

Apa Itu Web Browser?

Penjelasan sederhana soal web browser: program yang mengambil berkas dari web lalu menyusunnya menjadi halaman yang kamu lihat, satu tab dan satu klik setiap saat.

15 Sep 20268 menit baca
Ilustrasi engine browser menjalankan skrip lewat event loop
Dasar-Dasar Web / Browser

Cara Browser Menangani JavaScript

Penjelasan ramah pemula soal bagaimana browser membaca, mengubah, dan menjalankan JavaScript, kenapa hanya punya satu jalur utama, dan bagaimana cara memuat skrip memengaruhi tampilan halaman.

15 Sep 20268 menit baca
Sampul biru gelap bertuliskan Cara Kerja Browser dengan chip kode parse ke layout ke paint
Dasar-Dasar Web / Browser

Cara Kerja Browser: Gambaran Umum

Penjelasan ramah pemula tentang apa yang dilakukan browser dari kamu mengetik URL sampai halaman muncul: jaringan, parsing, render tree, layout, paint, compositing, dan mesin JavaScript.

15 Sep 20268 menit baca
Sampul Critical Rendering Path dengan chip timer first paint
Dasar-Dasar Web / Browser

Critical Rendering Path

Ikuti langkah persis yang dilakukan browser untuk mengubah HTML, CSS, dan JavaScript menjadi piksel pertama yang terlihat, dan pahami kenapa posisi CSS dan JS menentukan secepat apa halaman muncul.

15 Sep 20267 menit baca
Sampul Dasar Keamanan Browser dengan chip kode berlambang perisai same-origin
Dasar-Dasar Web / Browser

Dasar Keamanan Browser: Cara Browser Diam-Diam Melindungimu

Panduan ramah untuk pemula tentang cara browser menjaga keamananmu: same-origin policy, sandboxing antar-tab, gembok HTTPS, mixed content, dan pengantar lembut soal kenapa input bisa berbahaya.

15 Sep 202610 menit baca