badawi1713/jawaban-batch14-kloter3

Jawaban untuk test Arkademy Class Batch 14 Kloter (11/1/20)

Jawaban untuk Soal Batch 14 Kloter 3 Arkademy Class (11/01/2020)

Oleh: Dzaky Badawi

Bismillah

Jawaban nomor 1 dan 2:

Untuk jawaban nomor 1 dan 2 saya menggunakan bahasa pemrograman Javascript yang dapat deksekusi melalui https://es6console.com/

Beberapa kegunaan JSON pada REST API:

*Digunakan sebagai format standar untuk pertukaran data antar aplikasi atau antar sisi client dan sisi server.

*Format JSON juga sering digunakan karena dapat lebih mudah dibaca, ketimbang format lain; XML, raw, dll.

*JSON memiliki ukuran yang kecil, sehingga lebih cepat diproses.

Referensi: https://www.petanikode.com/json-pemula/

Jawaban nomor 3-5:

Untuk jawaban nomor 3-5 saya memang belum mengerjakannya karena keterbatasan kemampuan saya.

Jawaban nomor 6:

Untuk hasil jawaban nomor 6 membuat sistem POS sederhana, yang dilakukan pertama kali adalah membuat database seperti yang saya gunakan dengan nama "db_pos" kemudian import tabel-tabel yang ada pada folder "database\db_pos", lalu lakukan konfigurasi database yang ada pada folder 'utils/connection.js' sesuai dengan pengaturan yang diinginkan.

Nama database yang digunakan adalah "db_pos" dengan berbagai tabel seperti:

A. tabel "t_product", dengan stuktur berikut:

Column	Type	Size
id	int	11
name	Varchar	255
price	int	11
id_category	int	11
id_cashier	int	11

B. tabel "t_cashier", dengan stuktur berikut:

Column	Type	Size
id	int	11
name	Varchar	255

C. tabel "t_category", dengan stuktur berikut:

Column	Type	Size
id	int	11
name	Varchar	255

Project setup

1. npm install --save

Compiles and run Node.js server

2. nodemon atau npm run start

3. Lalu bukalah browser anda dan ketikkan url; localhost:3001

Demo Example of basic POS App CRUD with Node.js (Express), EJS, and MYSQL:

1st image, halaman utama yang menampilkan daftar produk. Dimana user dapat melihat daftar produk yang telah ditambahkan dan juga terdapat tombol untuk menambah produk pada bagian kanan atas. Pada tabel tampilan produk, terdapat 2 tombol aksi yang dilakukan yaitu mengubah data produk atau menghapus data produk.

2nd image, untuk menambah produk baru, user dapat mengisikan form add produk dengan menekan tombol ADD pada navbar halaman indeks.

3rd image, tampilan modal yang muncul apabila user mengklik tombol ADD sebelumnya untuk memasukkan data produk baru.

4th image, user mencoba untuk menambah produk yang akan ditambahkan.

5th image, tampilan tabel dengan tambahan data produk baru yang berhasil ditambahkan.

6th image, apabila ingin mengubah data produk user mengklik aksi tombol EDIT, kemudian akan tampil modal form EDIT seperti berikut.

7th image, user mencoba untuk mengubah data produk yang dipilih untuk diubah.

8th image, tampilan tabel dengan perubahan data yang berhasil diubah sebelumnya.

9th image, apabila user ingin menghapus data produk maka dapat mengklik tombol aksi DELETE kemudian akan muncuk konfirmasi seperti pada gambar berikut.

10th image, tampilan tabel dengan perubahan data yang berhasil dihapus sebelumnya.

Thank you!