Page 31 - 4817070273 - Aida aida
P. 31
24
Pada gambar 3.9 dapat dilihat bahwa dalam Modal react-bootstrap menampilkan
beberapa komponen didalamnya yaitu Input untuk search member, data list
member, dan juga button Add yang di tempatkan pada masing-masing data member.
Jika sebelumnya adalah tampilan untuk Add New Member di bawah ini adalah
tampilan dari fitur List Member, dimana menampilkan list para member yang
bertanggung jawab dalam pengerjaaan project Shopify Design Language System.
Pembuatan Fitur List Member ini sama seperti Add New Member dimana
menggunakan Modal react-bootstrap untuk menampilkan data list para member,
yang membedakan dari fitur ini adalah ada button yang berfungsi untuk
menambahkan member baru dalam list member. Serta bukan button Add yang
ditempatkan pada masing-masing data member melainkan button dengan tanda ‘x’
yang berfungsi untuk delete atau menghapus member dalam list member. Berikut
merupakan tampilan dari List Member.
Gambar 3.10 Tampilan Fitur List Member
Selain tampilan user interface pada bagian navbar, penulis juga membuat tampilan
untuk menampilkan list task yang berjalan pada project Shopify Design Language
System. Didalam list task tersebut, menampilkan data-data berupa nama dari Taks,
status pengerjaan, tanggal dateline, dan member yang bertanggug jawab dalam
menyelesaikan task tersebut.
Jurusan Teknik Informatika dan Komputer - Politeknik Negeri Jakarta