Bagaimana Website Bekerja? Menelusuri Proses di Balik Layar

Client dan Server: Komunikasi Dua Pihak

Di internet, ada dua pihak utama yang berinteraksi: client dan server.

flowchart TD Client["Client"] Server["Server"] Client -->|Request| Server Server -->|Response| Client

Client: Perangkat yang kita gunakan seperti ponsel atau komputer untuk mengirimkan permintaan akses halaman web.
Server: Komputer yang menyimpan semua file website—teks, gambar, dan kode. Saat client mengirim permintaan, server merespons dengan mengirimkan data yang diminta.

Proses ini berlangsung sangat cepat, dengan browser kita bertindak sebagai client yang berkomunikasi dengan server untuk menampilkan halaman web.

Hosting: Tempat Penyimpanan Website

Website memerlukan hosting untuk bisa diakses oleh publik. Hosting berperan seperti rumah yang menyimpan semua file website—HTML, CSS, gambar, dan file lainnya. Agar website dapat diakses secara global, file-file tersebut harus tersimpan di server yang terhubung ke internet 24/7.

Web Hosting dapat disediakan oleh layanan seperti Vercel, Netlify, atau penyedia hosting tradisional lainnya.
Tanpa hosting, file website tidak dapat diakses secara online.

Saat kamu mengakses sebuah website, browser mengirim permintaan ke server hosting, yang kemudian mengirimkan data yang dibutuhkan.

Proses Permintaan dan Respons Melalui Internet

Setelah kamu mengetikkan URL di browser, berikut adalah proses yang terjadi:

DNS (Domain Name System): Browser mengonversi nama domain, seperti haloadit.com, menjadi alamat IP untuk menemukan server hosting.

sequenceDiagram participant User as Pengguna participant Browser participant DNS as Server DNS participant Server as Web Server User->>Browser: Memasukkan "haloadit.com" Browser->>DNS: Permintaan alamat IP untuk "haloadit.com" DNS-->>Browser: Memberikan alamat IP (misalnya, 192.0.2.1) Browser->>Server: Menghubungi server dengan alamat IP tersebut (TCP handshake) Browser->>Server: Mengirim HTTP Request (GET /) Server-->>Browser: Mengirim HTTP Response (HTML, CSS, JS, dll) Browser-->>User: Menampilkan halaman website

HTTP Request: Browser mengirimkan permintaan HTTP ke server dengan instruksi untuk menampilkan halaman web yang diinginkan.

Paket Data: Data tidak dikirim sebagai satu paket besar, melainkan dibagi menjadi paket-paket kecil. Protokol TCP/IP bertugas memastikan semua paket sampai dengan utuh.

sequenceDiagram participant A as Browser (Client) participant B as Jaringan (Internet) participant C as Server A->>B: Mengirim Paket 1 A->>B: Mengirim Paket 2 A->>B: Mengirim Paket 3 B->>C: Menyalurkan Paket 1 B->>C: Menyalurkan Paket 3 (lebih cepat) B->>C: Menyalurkan Paket 2 (terlambat) C->>C: TCP menyusun ulang urutan paket C-->>A: Mengirim ACK (Semua paket diterima dengan utuh)

Browser: Penerjemah Konten

Setelah menerima data dari server, browser bertugas menampilkan halaman web sesuai dengan kode yang diterimanya. Berikut tiga komponen utama yang terlibat:

HTML: Membentuk struktur dasar halaman.
CSS: Mengatur tampilan dan desain visual.
JavaScript: Menambahkan fitur interaktif seperti tombol dan animasi.

Browser kemudian memproses file HTML, CSS, dan menjalankan JavaScript untuk menghasilkan halaman web yang utuh di layar Anda.

graph TD A[Data Diterima dari Server] --> B[HTML] A --> C[CSS] A --> D[JavaScript] B --> E[Parser HTML: Membentuk struktur DOM] C --> F[Parser CSS: Mengatur tampilan visual] D --> G[Mesin JavaScript: Menambahkan interaktivitas] E --> H[Render Engine: Membuat layout halaman] F --> H G --> H H --> I[Tampilan Halaman Web di Layar]

URL: Struktur Alamat yang Menentukan Tujuan

URL atau alamat website berfungsi sebagai penunjuk arah. URL memberitahu browser dan server lokasi tujuan permintaan dan halaman yang perlu ditampilkan. Setiap URL memiliki beberapa komponen penting, yaitu:

Protokol
(misalnya https://) yang menunjukkan bahwa koneksi harus aman.
Nama Domain (seperti haloadit.com) yang menunjukkan lokasi server.
Path (seperti /produk/123) yang menentukan halaman spesifik yang diminta.

Penutup: Menyatukan Semua Elemen Web

Website yang kita akses sehari-hari melibatkan berbagai proses rumit di balik layar yang bekerja secara cepat dan efisien. Dengan memahami interaksi antara client, server, hosting, dan browser, kita dapat lebih mengerti bagaimana sebuah website beroperasi—mulai dari proses akses hingga tampilan akhirnya.

Semua elemen tersebut bekerja sama menciptakan pengalaman pengguna yang mulus dan efisien. Jika kamu tertarik memperdalam pengetahuan tentang web development, pemahaman dasar ini merupakan langkah awal yang tepat.

Untuk informasi lebih lanjut tentang cara kerja web, kamu bisa mempelajari sumber dari MDN Web Docs.