RINGKASAN MATERI PEMOGRAMAN MOBILE

Framework Flutter

Teknologi sudah menjadi bagian tak terpisahkan dalam hidup kita terutama smartphone.
Menurut data dari We Are Social, pada bulan Januari 2020 pengguna internet di
Indonesia mencapai sekitar 175,4 juta orang. Terdapat peningkatan sebesar 17% atau
sekitar 25 juta pengguna dari tahun 2019. Jika dilihat dari total populasi penduduk
Indonesia yang berkisar 272,1 juta jiwa, maka 64% di antaranya sudah mengakses
internet. Dengan masifnya angka pengguna smartphone ini, kian spesifik
pula requirements alias permintaan bagi seorang pengembang aplikasi.
Termasuk requirement pada perangkat mobile dengan target platform Android dan iOS.
Masing-masing platform memiliki aplikasi native-nya tersendiri.

Mengembangkan dua platform memiliki banyak implikasi. Ditinjau dari sisi bisnis, biaya
yang perlu dikeluarkan tentunya tidak murah. Dua aplikasi berarti ada dua tipe developer
yang perlu direkrut dan dua jenis pengembangan untuk dikelola. Jika ada teknologi yang
memungkinkan pengembangan aplikasi di beberapa platform sekaligus hanya dengan
satu codebase tentunya lebih hemat bukan? Pasti lebih efisien dari sisi biaya, waktu,
dan tenaga.

Tertarik untuk mempelajari stack teknologi yang bisa mewujudkannya? Mari kita
berkenalan dengan Flutter. Inilah framework populer dan powerful buatan Google,
Flutter hadir untuk mengembangkan aplikasi multi-platform yang dikompilasi
secara native.

Apa itu Flutter

Flutter adalah SDK (Software Development Kit) yang dikembangkan oleh Google untuk
membuat aplikasi yang bagus dan bisa berjalan pada berbagai platform. Flutter 2 yang
merupakan versi terbaru memberikan dukungan pada Anda untuk membangun aplikasi
pada sistem operasi Android, iOS, Web, Windows, Linux, dan MacOS. Dengan ini, Anda
cukup sekali coding atau dikenal dengan single codebase. Flutter juga sudah digunakan
oleh banyak developer maupun organisasi di seluruh dunia, selain itu Flutter
bersifat open source.

Mengapa Flutter?
Flutter berbeda dari kebanyakan SDK Cross-platform lainnya untuk membuat
aplikasi mobile. Menariknya, Flutter bukan menggunakan WebView maupun widget
OEM, melainkan mesin rendering berkinerja tinggi. Flutter dapat digunakan bersamaan
dengan aplikasi native yang sudah ada atau digunakan secara keseluruhan untuk
aplikasi baru.

Ada beberapa kelebihan dari Flutter, antara lain:

1. Flutter memungkinkan kita untuk membuat aplikasi yang indah (beautiful)

Desainer dapat dengan bebas berkreasi tanpa adanya banyak batasan dari framework.
Flutter juga dapat mengontrol setiap piksel yang ada di layar, sehingga memudahkan
dalam membuat animasi. Flutter menyediakan banyak komponen material design yang
dapat berjalan baik pada Android, iOS, dan web.

2. Flutter berjalan dengan sangat cepat (fast)

Flutter menggunakan graphic engine bernama Skia-2D yang juga digunakan pada
Chrome dan Android. Kode Flutter menggunakan bahasa Dart, yang memungkinkan
untuk dikompilasi ke kode native 32-bit dan 64-bit ARM untuk iOS dan Android.

3. Flutter sangat produktif (productive)

Flutter memiliki fitur hot-reload yang memungkinkan Anda untuk melihat hasil kompilasi
secara real-time. Dengan hot-reload, Anda dapat dengan mudah melihat perubahan kode
pada perangkat, tanpa perlu menunggu restart dan kehilangan state.

4. Flutter bersifat terbuka (open source)

Flutter adalah proyek open source dengan lisensi BSD. Kode yang ada di Flutter berasal
dari kontribusi ratusan developer dari seluruh dunia. Banyak plugin yang sudah dibuat
oleh developer. Anda dapat ikut berkontribusi mengembangkan Flutter dengan
melaporkan bug/issue atau ikut memperbaiki kode yang sudah ada. Source code dari
Flutter dapat Anda temukan pada tautan [Link]

StatelessWidget dan StatefulWidget

Seperti yang kita tahu jantung dari aplikasi Flutter adalah widget. Sebagian besar yang
ada pada Flutter merupakan widget. Membuat tombol, menampilkan gambar, text, dan
membuat tampilan berada di tengah pada Flutter semuanya menggunakan widget. Kita
juga dapat membuat widget sendiri untuk dapat digunakan lain waktu ataupun dibagikan
kepada Flutter developer lain (dalam bentuk packages).

Widget pada Flutter memiliki dua jenis, yaitu StatelessWidget dan StatefulWidget.
Sebagai developer Flutter, kita harus memahami betul kedua jenis widget tersebut, maka
pada bagian ini kita akan mempelajari apa itu StatelessWidget dan StatefulWidget.
Apa itu State?
Sebelum membahas kedua jenis widget tersebut, kita harus berkenalan terlebih dahulu
dengan istilah State. Kenapa demikian? Widget kita akan terus berurusan dengan State.
Lalu apa itu State?

Untuk teman-teman dengan background frontend web developer, tentu tak akan asing
dengan istilah State ini, terutama menggunakan framework ReactJS. Tetapi untuk Anda
tanpa background tersebut tidak perlu risau. State tidaklah sulit untuk dimengerti. Jadi
State adalah data yang ada pada suatu widget. Widget menyimpan data yang nantinya
dapat berubah sesuai interaksi pengguna.

Karena Flutter menggunakan paradigma OOP (Object-Oriented Programming), state

biasanya menjadi suatu properti dari sebuah class. Contohnya sebagai berikut:

1. class ContohWidget extends StatelessWidget{

2. final String _judul;

3. ...

4. }

Variabel _judul di atas merupakan contoh pendeklarasian state pada suatu widget.

Stateless Widget
Setelah mengenal apa itu state, maka yang pertama kita akan bahas adalah
StatelessWidget. StatelessWidget adalah widget yang nilai state-nya tidak dapat
berubah (immutable) maka widget tersebut lebih bersifat statis dan memiliki interaksi
yang terbatas.

Stateful Widget
Kebalikan dari StatelessWidget, StatefulWidget ialah widget yang state-nya dapat
berubah-ubah nilainya, yang berarti StatefulWidget bersifat dinamis dan memiliki
interaksi yang tak terbatas.

Penulisan StatefulWidget sangat berbeda dengan StatelessWidget, berikut

penulisannya:

1. class ContohStateful extends StatefulWidget {

2.

3. final String parameterWidget; // ini parameter widget

4.
 5. const ContohStateful({Key? key, required [Link]}) :

super(key: key);

6.

7. @override

8. _ContohStatefulState createState() => _ContohStatefulState();

9. }

10.

11. class _ContohStatefulState extends State<ContohStateful>{

12. String _dataState; // ini state dari Widget ContohStateful

13.

14. @override

15. Widget build(BuildContext context){

16. // isi sebuah widget

17. }

18. }

Contoh di atas adalah cara penulisan StatefulWidget. Seperti yang kita lihat,
penulisan StatefulWidget lebih panjang. Tetapi yang harus diperhatikan adalah
properti dari setiap class-nya. Pada class ContohStateful propertinya hanya
berupa parameter ketika memanggil ContohStateful, parameter tersebut tidak
wajib ada. Sedangkan pada class _ContohStatefulState,
properti _dataState merupakan state yang sebenarnya. Kita akan mengubah
nilai _dataState.
Apa itu Widget

Kita telah berkenalan, menginstal, dan belajar fundamental Flutter. Itu entrée alias
hidangan pembukanya. Nah, sekarang kita akan menyibak ke plat du jour alias menu
utamanya. Apa inti dari Flutter? Yap, widget jawabnya! Sebagian besar yang ada pada
Flutter adalah widget. Jadi, relevan jika kita bilang bahwa “Flutter is all about widget.”
Text sendiri adalah widget. Button juga widget. Selain itu widget juga dapat dibangun
dari kumpulan beberapa widget. Lantas mengapa widget begitu penting dalam flutter?
Penasaran? Mari kita bahas!

World of components
Perlu kita ketahui bahwa konsep Widget pada Flutter itu terinspirasi oleh salah satu
library JavaScript yang digunakan untuk membangun sebuah website yaitu ReactJS.
ReactJS memiliki konsep Component. Mari kita analogikan dengan mainan Lego! Di
Lego terdapat block-block kecil yang nantinya kita susun untuk membangun sebuah
istana Lego. Berarti component dalam programming adalah sekumpulan block-block
code yang digunakan untuk membangun sebuah aplikasi.

Widget sama halnya dengan component yang merupakan kumpulan block code untuk
membangun aplikasi Flutter. Ketika membangun aplikasi Flutter kita harus berpikir
layaknya bermain Lego. Kita harus bisa membuat dan menyusun widget-widget dengan
tepat. Tujuannya, agar aplikasi yang kita buat lebih mudah untuk dikembangkan.

Row dan Column

Selanjutnya kita akan mempelajari bagaimana cara membuat widget yang kita
gunakan berjajar secara vertikal atau horizontal.

Widget Row
Seperti yang dicontohkan sebelumnya, widget Row merupakan suatu widget yang
digunakan untuk membuat widget-widget tersusun berjajar secara horizontal. Row
memiliki sintaks seperti berikut’
 1. Row(

2. children: <Widget>[

3. //di sini berisi widget-widget

4. ],

5. )

Untuk membuat widget-widget berjajar secara horizontal kita harus memasukkan

widget-widget tersebut ke dalam parameter children. Parameter children berisi kumpulan
atau list dari widget karena kita dapat menyusun beberapa widget sekaligus di dalamnya.
Jika mengacu pada contoh tombol-tombol di atas kodenya seperti berikut:

1. Row(

2. mainAxisAlignment: [Link],

3. children: const <Widget>[

4. Icon([Link]),

5. Icon(Icons.thumb_up),

6. Icon(Icons.thumb_down),

7. ],

8. )

Seperti yang kita lihat, kita membuat sebuah IconButton berada di dalam parameter
children. Kita menambahkan pula mainAxisAlignment yang merupakan
parameter alignment pada Row. Parameter mainAxisAlignment yang berfungsi untuk
mengatur alignment horizontal dari Row (alignment utama). Selain itu Row juga memiliki
parameter crossAxisAlignment yang berfungsi untuk mengatur alignment secara
vertikal. Kedua parameter ini juga berlaku sebaliknya untuk widget Column.

Widget Column
Kebalikan dari Row, Column merupakan suatu widget yang digunakan untuk membuat
widget-widget tersusun berjajar secara vertikal. Column memiliki sintaks mirip dengan
Row, seperti berikut:
 1. Column(

2. children: <Widget>[

3. //di sini berisi widget-widget

4. ]

5. )

Contoh penerapan Column seperti berikut:

1. Column(

2. children: const <Widget>[

3. Text(

4. 'Sebuah Judul',

5. style: TextStyle(fontSize: 32, fontWeight: [Link]),

6. ),

7. Text('Lorem ipsum dolor sit amet'),

8. ],

9. )

Maka akan menghasilkan tampilan seperti berikut:

Kesimpulan
Untuk membuat sebuah widget-widget berjajar kita dapat menggunakan
widget Row atau Column. Sebenarnya penggunaan Row dan Column dapat dipadukan
sehingga dapat membuat sebuah layout yang kompleks seperti berikut:
LISTTILE WIDGET
Widget ListTile di Flutter adalah elemen UI yang menampilkan informasi terkait.

Ini mengikuti spesifikasi daftar dari Desain Material. ListTile tipikal dibagi menjadi tiga
bagian; start, center, dan end. Bagian Mulai berisi widget utama; bagian center berisi
judul dan subjudul, dan bagian Akhir berisi widget tambahan.
Hal ini terutama digunakan untuk mengisi tampilan yang dapat digulir seperti ListView,
Column, dan Row. Misalnya, Anda dapat menggunakan ListTile untuk memperlihatkan
daftar item tugas, email, opsi navigasi, dan lainnya. Anda juga dapat menerima acara klik
dengan mengetuk ListTile.

Apa itu API?

API adalah mekanisme yang memungkinkan dua komponen perangkat lunak untuk saling
berkomunikasi menggunakan serangkaian definisi dan protokol. Misalnya, sistem perangkat lunak
badan meteorologi, klimatologi, dan geofisika (BMKG) berisi data cuaca harian. Aplikasi cuaca di
ponsel Anda “berkomunikasi” dengan sistem ini melalui API dan menampilkan pembaruan cuaca
harian di ponsel Anda.

Apa kepanjangan dari API?

API merupakan kepanjangan dari Application Programming Interface (Antarmuka Pemrograman
Aplikasi). Kata Aplikasi pada API merujuk pada perangkat lunak dengan fungsi yang berbeda. Kata
Antarmuka dapat diartikan sebagai kontrak layanan antara dua aplikasi. Kontrak ini menjelaskan
cara keduanya saling berkomunikasi dengan menggunakan permintaan (request) dan respons
(response). Dokumentasi API keduanya berisi informasi cara developer menyusun permintaan dan
respons tersebut.

Bagaimana cara kerja API?

Arsitektur API biasanya dijelaskan dalam kaitannya dengan klien dan server. Aplikasi yang
mengirimkan permintaan disebut sebagai klien dan aplikasi yang mengirimkan respons disebut
sebagai server. Sehingga untuk contoh cuaca di atas, basis data cuaca BMKG adalah servernya
sedangkan aplikasi seluler adalah kliennya.

Berdasarkan waktu dan alasan pembuatan, terdapat empat cara kerja API.
API SOAP

API ini menggunakan Simple Object Access Protocol. Klien dan server saling bertukar pesan
menggunakan XML. API yang kurang fleksibel ini populer di masa lalu.

API RPC

API ini disebut sebagai Panggilan Prosedur Jarak Jauh (Remote Procedure Calls) Klien menjalankan
fungsi (atau prosedur) pada server, dan server akan mengirimkan output kembali ke klien.

API Websocket

API Websocket adalah pengembangan API web modern lain yang menggunakan objek JSON untuk
meneruskan data. API WebSocket mendukung komunikasi dua arah antara aplikasi klien dan server.
Server dapat mengirimkan pesan callback ke klien yang terhubung, menjadikannya lebih efisien
daripada API REST.

API REST

API REST merupakan API yang paling populer dan fleksibel di web saat ini. Klien akan mengirimkan
permintaan ke server sebagai data. Server akan menggunakan input klien untuk memulai fungsi
internal dan mengembalikan data output ke klien. Lihat API REST selengkapnya di bawah ini.

Memahami HTTP Response Status Code

Hypertext Transfer Protocol (HTTP) adalah protokol jaringan di lapisan aplikasi yang digunakan untu
k melakukan proses transfer data antar komputer. Protokol ini digunakan dalam sistem informasi ya
ng terdistribusi dan didesain untuk tujuan kolaboratif. Masing-
masing media (termasuk teks, gambar, dokumen, video dll) yang ada di dalamnya dihubungkan mel
alui sebuah tautan yang disebut dokumen hypertext, membentuk yang disebut dengan World Wide
Web (WWW).
Fungsi HTTP juga mengatur format data dan proses transmisinya. Selain itu juga mengatur bagaima
na web server layanan aplikasi dan browser di perangkat pengguna memproses berbagai macam p
erintah yang masuk.

Gambar 1: Gambaran cara kerja protokol HTTP dalam sebuah sistem web
 Ilustrasi di atas menggambarkan konsep sederhana ketika seorang pengguna mengakses sebuah w
ebsite. Pengguna akan sebuah request (perintah untuk melakukan tugas tertentu) dan Web Server a
kan memberikan Response (menampilkan apa yang diminta dalam browser). Tidak selamanya webs
ite dapat diakses secara lancar, terkadang terdapat kode error yang memberikan makna tertentu ter
kait kendala yang dialami sistem. Kode-
kode tersebut dikenal dengan istilah teknis “HTTP Status Code”.

Gambar 2 : Alur kerja pesan error ketika sistem gagal melakukan tugasnya
Apa itu HTTP Status Codes?
HTTP Status Codes adalah sebuah kode respons standar yang diberikan oleh web server yang bero
perasi di internet. Kode-
kode ini membantu mengidentifikasikan masalah ketika ada sebuah halaman web atau sumber daya
yang tidak berhasil termuat atau ditampilkan dengan baik. Istilah-
istilah dalam HTTP Status Code terdiri dari kode-
kode khusus beserta penjelasan terkait error yang saat itu terjadi.
Istilah lain yang sering digunakan untuk menyebut HTTP Status Code ialah Browser Error Codes ata
u Internet Error Codes. Ada beberapa kode yang umum ditampilkan. Berikut daftar dan masing-
masing status kode:
Status code: 1xx Information
Kode tersebut berkaitan dengan Request dari protokol HTTP. Berfungsi untuk membaca dan menjel
askan permintaan pesan yang dikirimkan oleh client melalui browser. Kode tersebut memiliki bebera
pa turunan, misalnya:
• 100 Continue: Mengindikasikan permintaan telah diterima dan proses sedang berlangsung.
• 10 Switching Protocols: Mengindikasikan bahwa web server telah melakukan peralihan protokol.

Status code: 2xx Succesful

Kode status ini memberikan informasi bahwa Request yang diminta oleh pengguna telah diterima at
au dipahami oleh sistem, dan telah diproses dengan baik.
 Gambar 3 : Alur kerja status kode 2xx Successful

Dalam jenis status ini, terdapat beberapa kode yang umum ditampilkan oleh sistem, sebagai berikut:
• 200 Successful Server: Mengindikasikan sistem berhasil memproses permintaan. Ini berarti bahwa s
erver telah menyediakan halaman yang diminta secara utuh. Jika pengguna melihat status ini pada
berkas [Link] di web server, berarti Googlebot telah mengambil data (retrieve) dengan sukses.
• 201 Created: Mengindikasikan bahwa permintaan berhasil dan server telah membuat resource baru.
• 202 Accepted: Mengindikasikan bahwa server telah menerima permintaan, tetapi belum diproses.
• 203 Non-
authoritative: Mengindikasikan Information Server berhasil memproses permintaan, tetapi menampil
kan informasi yang mungkin berasal dari sumber lain.
• 204 No content: Mengindikasikan bahwa server berhasil memproses permintaan, tetapi tidak mena
mpilkan konten apa pun.
• 205 Reset content Server: Mengindikasikan bahwa sistem berhasil memproses permintaan, tetapi ti
dak menampilkan konten apa pun. Tidak seperti response 204, respons ini mengharuskan penggun
a mereset tampilan dokumen (misalnya, memasukan input baru pada form atau refresh pada halam
an web).
• 206 Partial Content Server: Mengindikasikan bahwa sistem telah berhasil memproses permintaan p
arsial (sebagian).
Status code 3xx Redirect
Kode status ini menunjukkan bahwa tindakan lebih lanjut perlu dilakukan oleh agen pengguna untuk
memenuhi permintaan. Berikut ini beberapa kode yang sering muncul:
• 300 Multiple choices: Server memiliki beberapa pilihan tindakan berdasarkan permintaan dan memili
h tindakan berdasarkan dari pemohon (user agent) atau server menyediakan daftar tindakan sehing
ga pemohon dapat memilih tindakan yang diinginkan.
• 301 Moved permanently: Halaman yang diminta telah secara permanen dipindahkan ke lokasi baru.
Ketika server mengembalikan respons ini (sebagai respon terhadap permintaan GET atau HEAD), s
ecara otomatis mengarahkan pemohon ke lokasi baru. Anda harus menggunakan kode ini untuk me
mberi tahu Googlebot bahwa laman atau situs sudah permanen pindah ke lokasi baru.
• 302 Moved temporarily : Hampir sama dengan 301, namun kode ini bersifat sementara. Dan Anda s
ebaiknya tidak memberitahu Googlebot bahwa laman atau situs telah dipindahkan karena Googlebot
harus terus crawl dan indeks lokasi asli.
• 303 See other location : Server mengembalikan kode ini ketika pemohon membuat permintaan GET
terpisah ke lokasi yang berbeda untuk menerima respon. Untuk semua permintaan selain permintaa
n HEAD, server secara otomatis mengarahkan ke lokasi lain.
• 304 Not modified : Halaman yang diminta belum dimodifikasi sejak permintaan terakhir. Ketika serve
r menampilkan respons ini, tidak mengembalikan isi halaman.
Anda harus mengkonfigurasi server Anda untuk menerima respon ini ( the If-Modified-
Since HTTP header). Ini menghemat bandwidth dan overhead karena server Anda akan memberitah
u Googlebot bahwa halaman belum berubah sejak terakhir kali crawling.
• 305 Use proxy : Pemohon hanya dapat mengakses halaman yang diminta dengan menggunakan pr
oxy. Ketika server menampilkan respons ini, itu juga menunjukkan proxy yang harus digunakan pem
ohon.
• 307 Temporary redirect : Server sedang merespons permintaan dengan halaman dari lokasi yang b
erbeda, tetapi pemohon harus terus menggunakan lokasi asli untuk permintaan di masa depan. Kod
e ini mirip dengan 301.
Status code 4xx Request Error
Kode status ini menunjukkan bahwa ada kemungkinan kesalahan dalam permintaan yang mencega
h server untuk memprosesnya.

Gambar 4 : Alur kerja status kode 4xx Successful

• 400 Bad Request : Server tidak memahami sintaks/syntax permintaan.
• 401 Not authorized : Permintaan membutuhkan otentikasi. Server biasanya menampilkan respon ini
untuk halaman setelah login (page behind a login)
• 403 Forbidden : Pada status 403, pengunjung sama sekali tidak dapat mengakses ke folder tujuan.
Status 403 muncul disebabkan oleh kesalahan pengaturan hak akses pada folder. Cek kembali hak
akses dari folder tujuan, hak akses yang normal untuk folder adalah 755 (rwxr-xr-x).
• 404 Not Faund : menyatakan bahwa file/folder yang diminta, tidak ditemukan. Pastikan file/folder su
dah di-
upload ke account hosting, dan pastikan nama file/folder tersebut sudah sesuai dengan nama file/fol
der yang akan diakses (terutama pada penggunaan huruf besar dan kecil/case-sensitive).
• 405 Method not allowed : Metode yang ditentukan dalam permintaan tidak diperbolehkan.
• 406 Not acceptable : Halaman yang diminta tidak dapat merespons dengan karakteristik konten yan
g diminta.
• 407 Proxy Authentication Required : Ini kode status yang mirip dengan 401 (not authorized), tetapi
menetapkan agar pemohon harus mengotentikasi menggunakan proxy.
• 408 Request timeout : Request Time Out bisa terjadi jika koneksi jaringan internet lambat, sehingga
server memutus request terhadap alamat yang dituju karena waktunya terlalu lama. Untuk mengata
sinya re-
fresh halaman tersebut, jika masih sama berarti jaringan provider yang sedang digunakan tidak bag
us atau sedang mengalami gangguan.
• 409 Conflict : Pesan error ini muncul ketika kita sedang mengakses sebuah situs, namun pada saat
yang bersamaan pemilik situs sedang mengedit halaman sehingga terjadi konflik, dan tidak dapat di
proses oleh komputer server.
• 410 Gone : Server menampilkan respon ini ketika sumber yang diminta telah dihapus secara perma
nen. Hal ini mirip dengan kode 404 (Not found). Jika sumber telah dipindahkan secara permanen, A
nda harus menggunakan kode 301 untuk menentukan lokasi baru sumber.
• 411 Length required : Server tidak akan menerima permintaan tanpa Content-
Length header field yang sah.
• 412 Precondition failed : Server tidak memenuhi salah satu prasyarat yang pemohon gunakan untuk
permintaan.
• 413 Request entity too large : Server tidak dapat memproses permintaan karena terlalu besar untuk
server tangani.
• 414 Requested URI is too long : Pesan error seperti ini sudah jarang dijumpai karena URL sudah dib
uat sedemikian rupa lebih singkat. Kode error ini berarti URL yang ingin dituju terlalu panjang dan se
rver tak mampu memprosesnya.
• 415 Unsupported media type : Error ini akan muncul jika kita menggunakan jenis media yang tidak d
idukung atau tidak diizinkan oleh server. Misalnya kita mengunggah file gambar dengan format .PN
G, namun server hanya mengizinkan format .JPG atau .GIF. Umumnya server tidak akan menampilk
an status ini pada browser kita saat kondisi tersebut terjadi, melainkan hanya menampilkan pemberit
ahuan bahwa file gambar yang kita unggah tersebut tidak sesuai.
• 416 Requested range not satisfiable : Server menampilkan kode status ini jika permintaan untuk rent
ang/range tidak tersedia untuk halaman tersebut.
• 417 Expectation failed : Server tidak dapat memenuhi persyaratan Expect request-header field.

Status code 5xx Server Error

Kode status ini menunjukkan bahwa server mengalami galat/error internal saat mencoba untuk mem
proses permintaan tersebut. Kesalahan ini cenderung dari server sendiri, tidak berkaitan dengan per
mintaan.
 Gambar 5 : Alur kerja status kode 5xx Successful
• 500 Internal Server Error : Status 500 menyatakan bahwa ada kesalahan konfigurasi pada account
hosting. Cek kembali file .htaccess pada account hosting Anda, dan pastikan setiap barisnya sudah t
ertulis dengan benar.
• 501 Not implemented : Merupakan pesan yang menjelaskan bahwa Server tidak memiliki fungsi unt
uk memenuhi permintaan dari pengguna. Misalnya, server akan menampilkan kode ini ketika tidak
mengenali permintaan user.
• 502 Bad Gateway : merupakan pesan yang menjelaskan bahwa Server saat ini bertindak sebagai g
ateway atau proxy dan menerima respon tidak valid dari file server.
• 503 Service unavailable : Server saat ini tidak tersedia (karena kelebihan beban atau dalam proses
maintenance ). Umumnya, ini bersifat sementara.
• 504 Gateway timeout : Merupakan pesan yang menjelaskan bahwa Server bertindak sebagai gatew
ay atau proxy dan tidak menerima permintaan tepat waktu dari server upstream.
• 505 HTTP version not supported : Server tidak mendukung versi protokol HTTP yang digunakan dal
am permintaan.
HTTP status code yang telah diuraikan di atas memberikan informasi spesifik kepada pemilik websit
e, sehingga Anda dapat secara akurat mengambil langkah penyelesaian sesuai dengan kode yang d
iberikan.
HTTP Request

Format pesan HTTP Request terdiri dari 4 bagian, yakni:

1. Baris request
2. Baris header
3. Baris kosong
4. Message Body (opsional)

Contoh paling sederhana untuk sebuah pesan HTTP Request adalah di

bawah ini
GET / HTTP/1.1
Host: [Link]

Mari bahas bagian per bagian pada contoh di atas.

Bagian 1
GET / HTTP/1.1

Bagian 1 ini dipecah lagi menjadi tiga bagian, pertama GET adalah salah satu dari
berbagai jenis request method yang tersedia di HTTP. Selanjutnya, / yang
merupakan request target yakni URL yang dituju. Terakhir adalah HTTP/1.1 yang
merupakan nama standard yang digunakan untuk melakukan request.

Request method yang tersedia di HTTP adalah sebagai berikut,

• GET
• HEAD
• POST
• PUT
• DELETE
• TRACE
• OPTIONS
• CONNECT
• PATCH

Masing-masing memiliki kegunaannya tersendiri yang dapat dibaca di dokumen RFC

7231. Kebanyakan request yang lalu lalang di internet adalah GET yang digunakan untuk
meminta data dari server dan POST yang digunakan untuk mengirim data ke server.
Bagian 2
Host: [Link]

Bagian ini berisi satu baris pada contoh diatas. Bagian ini berisi request headers yang
biasanya berisi metadata dari sebuah request.

Header yang paling banyak kamu dengar

adalah header bernama Cookie. Cookie tersebut diletakkan di baris ini.
Contoh header lain adalah Referer yang digunakan untuk mengidentifikasi halaman
yang kamu kunjingi sebelumnya. Header Host sendiri diwajibkan ada dan harus berisi
nama website atau IP address dari website yang ingin kamu akses. Tentunya, masih
banyak header lain baik yang standar maupun tidak.

Berikut contoh penggunaan header tersebut.

Cookie: _ga=GA2.5.9992144407.352216230; cookie-notice-dismissed=true
Host: [Link]
Referer: [Link]

Bagian 3

Bagian ini adalah baris kosong, tidak diisi apa-apa. Memang diharuskan terdapat
sebuah baris kosong setelah request header.

Bagian 4

Bagian terakhir biasanya berisi request body. Baris ini terisi biasanya saat
menggunakan request metod bentuk POST. Di contoh ini, tidak ada baris ke 4 karena
memang tidak diperlukan.