1.1.2 Studi kasus: struktur aplikasi

Subtopik 1.1.2 – Studi Kasus: Struktur aplikasi web e-commerce dan aplikasi mobile fintech 

Studi Kasus pada E-Commerce

          Seorang pengguna ingin mencari suatu produk di situs web e-commerce. Diasumsikan bahwa pengguna sudah masuk (login) dan sedang membuka salah satu situs e-commerce. Pengguna kemudian mengetikkan kata kunci pencarian, misalnya "ponsel seri A terbaru", pada kolom pencarian (search bar).

Alur proses dalam aplikasi web berlangsung sebagai berikut:

Front-end
Pengguna memasukkan kata kunci pencarian melalui kolom pencarian pada antarmuka situs. Front-end kemudian mengirim permintaan pencarian ke lapisan middleware melalui sebuah API bernama, misalnya, findProducts.

Middleware
API Gateway sebagai middleware menerima permintaan dari front-end (findProducts), lalu meneruskannya ke layanan katalog pada lapisan back-end, misalnya melalui API retrieveProducts. Setelah menerima respons dari back-end, middleware mengembalikan data hasil pencarian ke front-end.

Back-end
Layanan katalog pada back-end (retrieveProducts) melakukan pencarian dalam basis data untuk menemukan produk yang sesuai dengan kata kunci yang dimasukkan. Sistem akan mengembalikan data seperti nama produk, harga, dan ketersediaan.

Akhirnya, pengguna dapat melihat daftar produk yang relevan sesuai kata kunci yang diketikkan sebelumnya.

Studi Kasus: Pencarian Produk di Website E-Commerce

Diagram kedua merupakan implementasi arsitektur yang sama, tetapi difokuskan pada studi kasus pencarian produk di aplikasi e-commerce. Visual ini menggambarkan secara rinci bagaimana sistem merespons permintaan pengguna ketika melakukan pencarian barang.

Gambar 1.1.11: Arsitektur Web untuk Fitur Pencarian

Alur kerja sistem dalam kasus pencarian produk:

1. Pengguna mengetik kata kunci produk (misalnya "ponsel seri A terbaru") pada kolom pencarian di halaman utama situs.
2. Front-end mengirimkan permintaan ke middleware melalui sebuah API bernama findProducts.
3. Middleware menerima permintaan dan meneruskannya ke layanan pencarian produk di back-end menggunakan API retrieveProducts.
4. Back-end memproses permintaan dengan mengeksekusi kueri pada database untuk menemukan produk yang sesuai dengan kata kunci tersebut.
5. Hasil pencarian, berupa daftar nama produk, harga, dan status ketersediaan, dikembalikan dari back-end ke middleware.
6. Middleware meneruskan hasil tersebut ke front-end.
7. Front-end menampilkan daftar produk kepada pengguna secara dinamis, tanpa perlu memuat ulang seluruh halaman.

Studi Kasus: Melihat Riwayat Transaksi pada Aplikasi Fintech

Seorang pengguna ingin melihat riwayat transaksi pada aplikasi mobile banking. Pengguna sudah login ke akun mereka dan memilih menu “Riwayat Transaksi” di aplikasi.

Alur kerja aplikasi web/mobile fintech adalah sebagai berikut:

1. Pengguna menekan tombol “Riwayat Transaksi”.
2. Front-end akan mengirim permintaan ke middleware (API Gateway), misalnya lewat API getTransactionHistory, dengan parameter seperti userID, startDate, dan endDate.
3. Middleware (API Gateway) menerima permintaan dan melakukan validasi awal, seperti autentikasi token. Setelah itu, request diteruskan ke back-end, ke layanan transaksi atau core banking system.
4. Back-End akan mengambil data transaksi pengguna dari database berdasarkan parameter yang diberikan, kemudian mengembalikan hasilnya dalam bentuk daftar transaksi.
5. Hasilnya, pengguna melihat daftar transaksi sesuai rentang waktu yang diminta, termasuk detail seperti tanggal, nominal, tipe transaksi (debit/kredit), dan keterangan.

Ringkasan Proses

Dari visualisasi di atas, dapat disimpulkan bahwa:

●      Lapisan front-end bertugas mengatur antarmuka dan interaksi dengan pengguna.

●      Lapisan middleware mengelola permintaan, meneruskannya ke sistem yang sesuai, dan menangani keamanan serta efisiensi komunikasi.

●      Lapisan back-end menjalankan logika bisnis dan berinteraksi langsung dengan basis data.

Pendekatan ini memungkinkan setiap lapisan dikembangkan dan diuji secara terpisah namun tetap saling terhubung. Hal ini sangat penting dipahami oleh QA agar dapat menelusuri akar masalah secara tepat, baik itu di sisi pengguna, penghubung, maupun logika data. Setelah memahami alur kerja aplikasi web yang terdiri atas lapisan front-end, middleware, dan back-end, sekarang saatnya kamu melatih pemahaman melalui sebuah pertanyaan reflektif. Bagian ini bertujuan untuk membiasakan kamu berpikir secara logis dan terstruktur saat menghadapi situasi nyata yang sering terjadi dalam proses pengujian perangkat lunak (Quality Assurance).