01 Pengenalan Web

Pengenalan Web

Web merupakan kumpulan informasi yang tersedia dalam sebuah komputer yang terkoneksi secara langsung menerus melalui internet. Web ini berisi informasi dalam bentuk apapun seperti teks, audio, video dan lainnya. Web berjalan diaplikasi yang namanya web server yaitu aplikasi yang digunakan untuk menyimpan dan menyampaikan isi informasi web.

Web merupakan aplikasi yang berbasis client dan server. Secara sederhana client server merupakan konsep arsitektur aplikasi yang menghubungkan dua pihak. Sistem client dan server ini akan saling berkomunikasi melalui jaringan komputer atau internet. Client bertugas untuk mengirim request ke server sedangkan aplikasi server bertugas untuk menerima request dari client, memproses data dan mengembalikan hasil dari proses data ke client.

Keuntungan dari arsitektur client dan server ini yaitu ketika kita memiliki perubahan pada aplikasi cukup hanya di server saja yang akan berubah tanpa harus membuat perubahan pada client, bisa juga digunakan dan diakses oleh banyak client dalam waktu yang bersamaan, dan bisa diakses dimana saja asalkan terhubung dengan satu jaringan dengan servernya.

Contoh aplikasi web yang bertugas sebagai client adalah Web Browser seperti Chrome, Firefox, Opera, Edge dan lain-lainnya. Sedangkan aplikasi yang bertugas sebagai client adalah Web Servre dimana di dalamnya terdapat kode program yang sudah kita buat.

Golang Web

Golang bahasa yang populer untuk membuat Web terutama Web API (backend). Selain itu Golang juga sudah menyediakan package untuk kebutuhan Web bahkan disertakan pula package untuk mengimplementasikan unit testing untuk Web. Sehingga pembuatan Web menggunakan Golang itu lebih mudah karena sudah tersedia semua libary package yang dibutuhkan tanpa perlu menambahkan framework.

Cara Kerja GolangWeb

• Web Browser akan mengirim HTTP request ke Web Server
• Golang akan menerima HTTP request tersebut lalu mengeksekusi request tersebut sesuai dengan yang diminta.
• Golang akan mengembalikan data dan melakukan render sesuai kebutuhan client ketika proses eksekusinya sudah selesai, misalkan akan mengembalikan HTML, CSS, Javascript dan lain-lain.
• Golang akan mengembalikan konten hasil render tersebut sebagai HTTP Response ke dalam Web Browser.
• Web Browser akan menerima konten dari Web Server dan menerjemahkan konten tersebut sesuai dengan tipe kontennya.

Menggunakan Package net/http

Pada pemrograman lain biasanya untuk membuat web dibutuhkan tambahan library atau framework. Sedangkan pada Golang tidak perlu menambahkan package apapun karena sudah disediakan package bernama net/http. Walaupun sebenarnya ada beberapa framework golang tambahan yang banyak direkomendasikan untuk kebutuhan membuat web ini.

Server Struct

Server adalah struct yang terdapat pada package net/http yang digunakan sebagai representasi Web Server pada Golang. Ada beberapa hal yang perlu kita tentukan, seperti host dan juga port pada tempat web tersebut akan kita jalankan. Setelah membuat server, kita bisa jalankan server tersebut menggunakan fungsi ListenAndServe().

server := http.Server{
    Addr: "localhost:8080",
}

err := server.ListenAndServe()

Baiklah kita akan coba lanjut memulai dengan membuat projek baru dengan create folder learn-golang-web dan lanjut membuat inisialisasi modul golang dengan perintah dibawah ini.

go mod init github.com/santekno/learn-golang-web

Dan setelah itu kita akan membuat file main dengan nama main.go dengan isi file seperti ini.

package main

import "net/http"

func main() {
	server := http.Server{
		Addr: "localhost:8080",
	}

	err := server.ListenAndServe()
	if err != nil {
		panic(err)
	}
}

Jika kita jalankan dengan perintah

go build && ./learn-golang-web

Maka kita bisa pastikan web server kita jalan dengan melihat di browser kita dengan akses

http://localhost:8080/

Dan akan keluar halaman yang tidak ditemukan seperti dibawah ini

Menambahkan Handler

Server yang sudah kita buat bertugas sebagai Web Server sedangkan untuk menerima HTTP Request yang masuk ke dalam server kita membutuhkan handler. Handler pada Golang ini direpresentasikan dalam interface dimana kontrak tersebut terdapat sebuah fungsi bernama ServeHTTP() yang digunakan sebagai fungsi yang nantinya akan kita eksekusi ketika menerima HTTP Request.

Salah satu implementasi dari interface Handler adalah HandlerFunc. Kita bisa gunakan ini untuk membuat fungsi handler HTTP. Biar lebih kebayang kita langsung coba saja dengan membuat fungsi dibawah ini.

func main() {
	var handlerTest http.HandlerFunc = func(w http.ResponseWriter, r *http.Request) {
		// logic web
		fmt.Fprint(w, "hello world")
	}

	server := http.Server{
		Addr:    "localhost:8080",
		Handler: handlerTest,
	}

	err := server.ListenAndServe()
	if err != nil {
		panic(err)
	}
}

Kita jalankan program tersebut dan coba akses menggunakan curl seperti ini.

curl --location 'http://localhost:8080/'

Maka akan keluar informasi cetak pada terminal seperti ini

➜  learn-golang-web git:(main) ✗ curl --location 'http://localhost:8080/'
hello world% 

Atau langsung diakses pada browser juga bisa dan akan keluar tampilan hello world juga. Ini tandanya kita sudah membuat handler dengan mencetak hello world pada web yang diakses oleh client.

Menggunakan ServeMux

Saat kita membuat web server, pastinya kita ingin membuat banyak sekali endpoint URL dalam satu web server. HandleFunc sayangnya tidak bisa mendukung banyak endpoint, dia hanya bisa mengeluarkan satu endpoint URL saja. Maka alternatif lain yaitu kita perlu mengimplementasikan dari handler adalah ServeMux. Ini adalah implementasi dari Handler yang bisa mendukung multiple endpoint.

Pada projek yang sudah kita buat, maka kita akan modifikasi dengan menambahkan ServeMux agar kita bisa membuat banyak endpoint dalam satu projet ini.

func main() {
	mux := http.NewServeMux()
	mux.HandleFunc("/",func(w http.ResponseWriter, r *http.Request) {
		fmt.Fprint(w,"hello world")
	})

	mux.HandleFunc("/hi",func(w http.ResponseWriter, r *http.Request) {
		fmt.Fprint(w,"Hi")
	})

	server := http.Server{
		Addr:    "localhost:8080",
		Handler: mux,
	}

	err := server.ListenAndServe()
	if err != nil {
		panic(err)
	}
}

Sekarang kita memiliki 2 endpoint yang mana:

• http://localhost:8080/ : akan mengembalikan data hello world
• http://localhost:8008/hi : akan mengembalikan data Hi

Mengenal URL Pattern

URL Pattern dalam ServeMux itu sangat sederhana, jadi kita tinggal menambahkan string yang kita inginkan untuk digunakan menjadi endpoint tanpa perlu memasukkan domain web kita. Jika URL Pattern dalam ServeMux sudah ditambahkan diakhir dengan garis miring artinya semua url tersebut akan menerima path dengan awalan tersebut misalkan, /images/ artinya akan dieksekusi jika endpoint tersebut adalah /images/, images/contoh, /images/contoh/again.

Namun jika web kita terdapat URL Pattern yang lebih panjang, maka akan diprioritaskan yang lebih panjang, misalkan jika kita terdapat URL /images/ dan /images/thumbnails maka pertama mengakses akan diprioritaskan mengakses images/thumbnails bukan /images.

Menambahkan Request

Request adalah struct yang merepresentasikan HTTP Request yang dikirim oleh Web Browser. Semua informasi request tersebut dikirim dan kita bisa mengambil data dari request tersebut seperti URL, http method, http header, http body dan lain-lain.

Kita coba tambahkan pada fungsi main dibawah mux dengan endpoint /hi, penambahannya seperti dibawah ini.

// read request
mux.HandleFunc("/req", func(w http.ResponseWriter, r *http.Request) {
    fmt.Fprintln(w, r.Method)
    fmt.Fprintln(w, r.RequestURI)
})

Kita jalankan program dan akses url /req akan mencetak atau menampilkan pada browser seperti ini

➜  learn-golang-web git:(main) ✗ curl --location 'http://localhost:8080/req'
GET
/req

Pada handler ini kita menampilkan method dari yang dikirim dari HTTP Request client dan menampilkan endpoint yang sedang diakses oleh client.