LAPORAN SINGKAT

FINAL PROJECT BACKEND ENGINEERING

MAGANG DAN STUDI INDEPENDEN BERSERTIFIKAT

BATCH 3

DISUSUN OLEH

ASRAF

2001092024

DOSEN PEMBIMBING

Defni, S.Si., M.Kom

NIP: 19811207 200812 2 001

JURUSAN TEKNOLOGI INFORMASI

PROGRAM STUDI D3 MANAJEMEN INFORMATIKA

POLITEKNIK NEGERI PADANG

2022
 Pengembangan Aplikasi Kasir Berbasis Web dengan Menggunakan Bahasa Go dan
Basis Data NoSQL

III.1 Pendahuluan Proyek

Aplikasi berbasis web kasir merupakan implementasi sederhana dari pengembangan

aplikasi berbasis web menggunakan bahasa pemrograman Go dan sistem basis data NoSQL.
Pada aplikasi ini tipe basis data NoSQL yang digunakan adalah tipe JSON yang memiliki
konsep pasangan key-value. Pada tampilan web, digunakan HTML dan CSS dengan
menggunakan framework TailwindCSS.

III.2 API Users

Gambar 3. 1 Halaman Utama Aplikasi

Ketika program pertama kali dijalankan, tampilan pada Gambar 3.1 akan muncul yang
meminta pengguna untuk melakukan aksi registrasi atau masuk jika telah memiliki akun.
Tampilan ini pertama kali keluar karena di atur ketika route dari URL menuju / (root), maka
akan menampilkan template (view) dari file HTML yang bernama index.html.
III.2.1 Proses Registrasi Pengguna

Gambar 3. 2 Halaman Registrasi

Ketika tombol registrasi pada Gambar 3.1 ditekan, maka akan membawa pengguna ke
rute /page/register. Namun terdapat middleware yang harus dilalui yang bernama Get.
Middleware ini menyaring HTTP Request hanya ke jenis request GET. Jika dilakukan
request dengan metode lainnya, maka tampilan register.html tidak dapat ditampilkan.

Setelah pengguna memasukkan username dan password untuk registrasi, maka tombol
Submit pada Gambar 3.2 akan ditekan. Tombol ini akan membawa pengguna ke rute /user/reg
ster yang hanya menerima HTTP Request jenis POST. Terdapat method pada API yang
bernama Reg ster yang akan di hit ketika tombol Submit tersebut ditekan.

Pada API tersebut, dilakukan parsing dari form HTML pada register.html untuk
mendapatkan username dan password yang dimasukkan oleh pengguna baru. Kemudian
method Reg ster ini akan memanggil method AddUser yang akan memeriksa apakah username
sudah ada di dalam basis data dalam kasus ini adalah basis data NoSQL jenis JSON.

Setelah pengguna berhasil melakukan registrasi, maka pada basis data NoSQLyang bertipe
JSON akan ditambahkan seperti gambar berikut:
 Gambar 3. 3 Tampilan Repositori Pengguna

Dapat dilihat pada gambar tersebut terdapat sebuah array dari JSON yang memiliki
keys password dan username. Ketika pengguna melakukan registrasi, maka pada array JSON
tersebut akan ditambahkan data baru (append) dengan username dan password yang
dimasukkan oleh pengguna tersebut.
III.2.2 Proses Masuk Pengguna

Gambar 3. 4 Halaman Login

Pengguna masuk dengan cara memasukkan username dan password yang telah
diregistrasi pada tahap sebelumnya. Proses ini mirip dengan proses registrasi. Ketika pengguna
menekan tombol Submit setelah memasukkan username dan password-nya, maka middleware
akan memeriksa jenis HTTP Request yang diberikan. Pada proses masuk pengguna metode
yang diizinkan adalah POST.

Jika middleware mengizinkan maka akan lanjut ke method Log n. Pada method ini
kembali dilakukan parsing form untuk mendapatkan masukkan dari pengguna. Berbeda dengan
proses registrasi, proses masuk akan memeriksa dalam basis data jika pengguna dengan
username tertentu sudah ada. Kemudian dilakukan pencocokan dengan password berdasarkan
username tersebut.

Jika username dan password tersebut cocok, maka akan dibuat cookie pada browser
untuk session-based authentication yang akan kadaluwarsa setelah 5 jam. Cookie ini
menyatakan bahwa pengguna telah masuk dan sesi pengguna ini hanya dapat digunakan
sebelum 5 jam setelah masuk (atau sebelum keluar secara langsung oleh pengguna) dan akan
muncul view dari dashboard.

Adapun tampilan dari repositori session setelah pengguna berhasil melakukan login adalah
sebagai berikut:
 Gambar 3. 5 Tampilan Repositori Session

Dapat dilihat pada gambar tersebut terdapat sebuah array dari JSON yang memiliki
keys token, username, dan exp ry. Ketika pengguna melakukan login, maka sesi dari login
tersebut akan disimpan dalam repositori dengan token unik yang dihasilkan secara otomatis.

Key username menyimpan nama pengguna yang melakukan login sementara key exp
ry mengatur lama waktunya sesi berakhir. Pada contoh ini sesi akan berakhir 5 jam setelah
login. Sebenarnya browser juga menyimpan data tersebut dalam bentuk cookie, jika dalam
waktu 5 jam setelah login pengguna ingin menggunakan aplikasi kembali, maka akan
dilakukan cek waktu berakhir pada repositori berdasarkan token sehingga pengguna tidak perlu
memasukkan username dan password kembali.

III.3 API Products

Ketika pengguna sudah berhasil masuk dan username serta cookie berhasil disimpan
dalam browser, maka pengguna selanjutnya akan dibawa ke tampilan dashboard. Pada tampilan
dashboard, akan dikeluarkan produk-produk yang tersedia berdasarkan data yang ada pada
basis data.
 Gambar 3. 6 Daftar Produk Yang Tersedia
Produk-produk tersebut dapat ditampilkan dengan memanggil repository produk. Pada
repository tersebut, terdapat method Readflroducts yang akan mengeluarkan semua detail
produk dari basis data. Bersamaan dengan tampilan dashboard.html, data dari produk-produk
ini diteruskan (execute) dengan menggunakan template sehingga detail produk tersebut akan
muncul di tampilan dashboard.

III.4 API Carts

III.4.1 Proses Penambahan Produk ke Keranjang

Gambar 3. 7Proses Penambahan Produk oleh Pengguna

 Pengguna dapat menambahkan produk ke kerajangnya dengan menekan checkbox dan
memilih jumlah produk yang ingin di tambahkan ke dalam kerajangnya. Tiap checkbox,
berdasarkan eksekusi template dari dashboard.html memiliki nilai ID dari produk itu sendiri.
Jumlah item merupakan banyaknya produk dalam ID yang sama yang akan ditambahkan ke
dalam keranjang.

Proses penambahan produk ke keranjang sampai penekanan tombol Add to Cart pada
dasarnya merupakan proses form dengan metode POST yang hasilnya perlu dilakukan parsing.
Ketika tombol tersebut ditekan, maka akan memanggil API AddCart yang melakukan parsing
form produk dan menambahkannya ke keranjang serta menghitung jumlah harganya.

III.4.2 Tampilan Kerajang Setelah Penambahan Produk

Gambar 3. 8 Tampilan Keranjang Belanja

Pada gambar tersebut dapat dilihat setelah menambahkan produk ke keranjang belanja,
maka produk-produk tersebut akan muncul dalam keranjang belanja pengguna beserta total
harga tiap produk dalam satu ID dan total keseluruhan harga produk dalam keranjang.
Tampilan daftar keranjang belanja tersebut didapatkan dari penggunaan repository carts.

Ketika pengguna pertama kali masuk, maka akan diperiksa keranjang belanjanya
berdasarkan username pada basis data keranjang belanja. Ketika tidak ada keranjang belanja
dengan username pengguna, maka keranjang belanja tidak akan dikeluarkan. Ketika terdapat
kerajang belanja dengan username pengguna tersebut, maka nama- nama produk yang ada
dalam keranjang belanja pengguna akan dikeluarkan.

Pada repositori keranjang belanja juga disimpan data kerajang belanja dari pengguna sekarang
seperti pada gambar berikut:

Gambar 3. 9 Tampilan Repositori Keranjang Belanja

Pada gambar tersebut dapat dilihat terdapat array dari JSON yang memiliki key name
bertipe data string, cart bertipe data array berisi produk-produk yang ditambahkan ke
keranjang. Key ini memiliki key di dalamnya, yaitu d, name, price, quant ty, dan total. Key
terakhir di repositori keranjang belanja adalah total_pr ce. Pada repositori tersebut ditunjukkan
implementasi dari array JSON dua dimensi.